왜 키보드 유형이 중요할까
레이얄과 동료들(2015)의 연구처럼 터치 키보드 입력은 실제 생활에서 느리고 오타가 잦아요. 카드 번호 칸에 글자 키보드가 뜨면 사용자는 숫자 전환부터 해야 해요. 숫자 칸에는 큰 키의 숫자 키패드를 띄우면 엄지로 누르기 쉬워 오타가 줄어요(Parhi et al., 2006). 작은 설정 하나가 모바일 폼 사용성을 크게 바꿔요.
웹과 앱에서 정하는 법
웹에서는 type(email, tel, search)과 inputmode(numeric, decimal, tel)로 키보드를 고르고(MDN, n.d.-a), autocomplete로 이메일·주소·인증번호 자동 채우기를 켜요(MDN, n.d.-b). 생년월일이나 카드 번호처럼 숫자지만 계산하지 않는 값은 type=number 대신 inputmode=numeric이 안전해요. iOS는 textContentType(Apple, n.d.), 안드로이드는 inputType으로 같은 일을 해요(Android Developers, n.d.).
엔터 키와 자동 수정
엔터 키는 상황에 맞게 '다음', '검색', '보내기'로 바꿔요(enterkeyhint, imeOptions). 마지막 칸이 아니면 '다음'을 눌러 다음 칸으로 가게 해요. 이메일·아이디·코드 칸에서는 자동 수정과 첫 글자 대문자를 꺼야 엉뚱하게 바뀌지 않아요. WCAG 2.2(W3C, 2023)의 1.3.5처럼 autocomplete로 입력 목적을 밝히면 보조 기술과 자동 채우기 모두에 도움이 되고, 틀린 값은 인라인 유효성 검사로 알려요.
자주 묻는 질문
- type=number를 쓰면 안 되나요?
- 수량처럼 계산하는 값엔 괜찮지만, 카드·전화번호 같은 식별 번호엔 inputmode=numeric이 더 안전해요.
- 자동 수정은 언제 꺼야 하나요?
- 이메일, 아이디, 코드, 주소처럼 정확한 문자열이 필요한 칸에서 꺼요.
출처 검토일: 2026-10-27
참고문헌
- MDN Web Docs. (n.d.-a). inputmode. numeric, tel, email 같은 값으로 가상 키보드 종류를 정하는 방법이라, 입력칸마다 맞는 키보드를 띄울 때 참고하면 도움이 돼요.
- MDN Web Docs. (n.d.-b). HTML attribute: autocomplete. 이메일·전화·주소 자동 완성 토큰을 정리해, 키보드 제안과 자동 채우기를 켤 때 참고하면 도움이 돼요.
- Apple. (n.d.). UITextContentType. UIKit documentation. iOS에서 입력칸의 의미를 알려 키보드 제안을 받는 방법이라, 네이티브 앱 입력칸을 설정할 때 참고하면 도움이 돼요.
- Android Developers. (n.d.). Specify the input method type. inputType과 엔터 키 동작(imeOptions)을 다뤄, 안드로이드 키보드와 '다음' 버튼을 정할 때 참고하면 도움이 돼요.
- Reyal, S., Zhai, S., & Kristensson, P. O. (2015). Performance and user experience of touchscreen and gesture keyboards in a lab setting and in the wild. In Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems (pp. 679–688). ACM. 터치 키보드 입력이 느리고 오류가 잦다는 실제 사용 연구라, 타이핑을 줄여야 하는 근거로 참고하면 도움이 돼요.
- Parhi, P., Karlson, A. K., & Bederson, B. B. (2006). Target size study for one-handed thumb use on small touchscreen devices. In Proceedings of MobileHCI 2006 (pp. 203–210). ACM. 엄지 타깃 크기 연구라, 숫자 키패드의 큰 키가 오타를 줄이는 이유로 참고하면 도움이 돼요.
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. 입력 목적 식별(1.3.5) 기준이 있어, autocomplete로 입력칸의 의미를 밝힐 때 참고하면 도움이 돼요.