본문 바로가기
떠돌이방랑자.
기록작업물소개
바이브코딩 일기장

휴대폰 키보드가 신청 버튼을 가릴 때

떠돌이방랑자2026.10.10화면과 사용성
이 글의 내용
작은 화면과 키보드가 열린 화면은 다릅니다입력 종류에 맞는 키보드를 사용해요가장 긴 입력 순서로 시험합니다
휴대폰 키보드가 신청 버튼을 가릴 때 원문 이미지

앱 만들기를 하며 신청 화면을 준비했습니다. 컴퓨터에서는 입력칸과 버튼이 한눈에 보입니다. 휴대폰에서 이름을 적으려고 하니 키보드가 올라오고, 아래의 신청 버튼은 보이지 않네요.

작은 화면과 키보드가 열린 화면은 다릅니다

휴대폰 화면에 맞게 너비를 줄였다고 입력이 편해지는 것은 아닙니다. 키보드가 열리면 실제로 볼 수 있는 공간이 줄어듭니다. 아래에 고정한 버튼이 키보드 뒤에 들어갈 수도 있고, 입력칸이 가려져 무엇을 쓰는지 안 보일 수도 있어요.

입력 중인 칸이 보이도록 화면이 움직이는지, 마지막 칸까지 내려갈 수 있는지부터 확인합니다. 버튼을 고정해두는 방식과 내용 아래에 두는 방식 중 어떤 것이 맞는지도 실제 입력 순서로 비교해봅니다.

입력 종류에 맞는 키보드를 사용해요

이메일 칸과 숫자 칸은 필요한 입력 방식이 다릅니다. 전화번호를 받는데 일반 글자 키보드가 나오면 손님이 한 번 더 바꿔야 하죠. 입력 종류에 맞는 키보드를 요청할 수 있습니다.

다만 입력 편의를 위한 키보드 설정이 값 검증을 대신하지는 않습니다. 붙여넣기로 다른 값이 들어올 수도 있으니까요. 칸의 이름도 예시 글자만으로 대신하지 말고, 무엇을 적는지 알 수 있게 표시합니다.

가장 긴 입력 순서로 시험합니다

이름을 적고, 연락처를 적고, 긴 문의 내용을 적은 뒤 신청해봅니다. 입력 오류가 났을 때 해당 칸이 보이는지도 봅니다. 키보드를 닫았다 다시 열고, 세로 화면에서 가로 화면으로 바꿔볼 수도 있고요.

미리보기의 작은 화면만으로 확인을 끝내지 않습니다. 사용할 기기의 브라우저나 실제 앱에서도 입력해봅니다. 기기와 브라우저에 따라 키보드가 열린 상태의 화면 처리가 다를 수 있습니다.

컴윗에서 앱이나 웹 화면을 만들 때도 “휴대폰 키보드가 열린 상태에서 마지막 입력칸과 신청 버튼을 확인해줘”라고 사용할 상황을 설명해보세요. 화면을 작게 만드는 것에서, 휴대폰으로 끝까지 쓸 수 있는 화면으로 넘어갈 수 있습니다.

https://comwit.io (새 탭)

네이버 원문 보기 (새 탭)

함께 읽는 일기

  • 화면과 사용성2026.10.31

    신청서를 인쇄했는데 메뉴까지 따라 나옵니다

  • 화면과 사용성2026.10.25

    오늘 닫은 팝업이 계속 다시 나온다면

  • 화면과 사용성2026.10.24

    마우스 없이도 신청을 마칠 수 있나요?

일기 목록으로
계속 배우고, 계속 만드는 중입니다.

다음은, 더 재밌는 걸로.

방랑자 소개
떠돌이방랑자.

© 2026 떠돌이방랑자.

바이브코딩 일기장이 블로그에 대하여RSS