Freeive

uiux·발행 2026.07.21

Date picker, Mac OS 9 첫 도입

날짜를 선택하는 캘린더 UI 데이트 피커. Mac OS 9에서 표준화된 이 컴포넌트가 HTML5 input type=date까지 어떻게 진화했는지 정리합니다.

한 줄로

날짜를 선택하는 캘린더 UI입니다. Mac OS 9(1999)에서 시스템 컴포넌트로 처음 표준화됐습니다.

어디서 왔나

이전까지 날짜 입력은 텍스트 필드로 "2026-05-12" 형식이었습니다. 사용자가 형식을 잘못 쓰면 에러가 났습니다. Mac OS 9이 시스템 차원의 달력 위젯을 도입하면서 표준이 됐습니다.

웹에서는 한참 늦은 2013년 HTML5의 <input type="date">가 표준화됐습니다. 그 이전은 jQuery UI 등 라이브러리로 직접 구현했습니다.

종류

Calendar grid: 월 단위 달력. 가장 흔합니다.
Wheel picker: iOS의 스크롤 휠.
Date range picker: 시작과 끝 두 날짜.
Inline vs Modal: 폼에 직접 두거나 팝업으로 띄움.

한국어 캘린더

요일 순서가 한국은 일월화수목금토이고, 미국도 일요일 시작입니다. 다만 ISO 8601 표준은 월요일 시작입니다. 사용자 지역에 따라 자동 조정이 필요합니다.

함정

모바일 입력 어려움: 작은 화면에서 작은 날짜 셀.
과거/미래 제약: 어디까지 선택 가능한지 명시 안 하면 사용자가 혼란스럽습니다.
형식 표시: 12/5와 5/12 차이 (미국 vs 한국).

바이브 메이커가 챙길 한 가지

HTML5 <input type="date">는 모바일에서 OS 네이티브 picker를 자동 호출합니다. 직접 구현보다 안전한 출발점입니다. 단, 디자인 일관성이 필요하면 라이브러리를 사용합니다.

관련

Combo box · Form design · Postel's Law

#UI/UX#용어사전#날짜 선택#Mac OS 9#HTML5#UI 패턴·컴포넌트

Comments

댓글 0

로그인 상태 확인 중…

댓글 불러오는 중…

Recent

다른 일기도 같이.