모바일 사용자를 위해 올바른 입력 요소(input) 사용하기

input태그: 사용자로부터 입력을 받을 수 있는 입력 필드(input filed)를 정의할 때 사용합니다.

PC 환경이 아닌 Mobile 환경에서 input 태그에 입력을 할 때 불편한 상황을 겪을 수 있으므로
input 태그에 적절한 type을 지정해 주어 사용자에게 편의를 제공해야 합니다.

---

<input type="text" />

<input type="url" />

<input type="email" />

아래 버튼에 text는 . url은 www. email은 .com이 나타난다.

---

<input type="tel" />

<input type="number" />

tel은 전화번호 입력시 필요한 문자가 나타납니다.

---

<input type="date" />

<input type="time" />

<input type="month" />

<input type="month" />

이처럼 다양하게 활용이 가능합니다.
다만, 위의 결과들은 안드로이드에서 직접 캡처한 화면입니다.
버전과 기기에 따라서 조금씩 혹은 크게 다를 수 있으니 주의바랍니다.