5장 막연한 요청과 조건이 담긴 요청
막연한 요청
"문의 폼 만들어줘"
✕
보내기
이름표가 없어 입력하면 무엇을 쓰던 칸인지 사라진다
오류는 빨간 테두리와 ✕뿐 · 보내기는 div
조건이 담긴 요청
"문의 폼 만들어줘. 조건: 모든 입력에
label 연결, 오류는 무엇이 왜 잘못됐는지
텍스트로, 키보드만으로 제출까지"
이메일 주소에 @ 뒤의 주소가 없습니다. 예: hong@example.com
이름표가 칸 위에 남는다 · 오류가 문장으로 설명된다
보내기는 button이라 Tab과 Enter로 제출된다
「막연한 요청」이 의도적으로 잘못 만든 교보재입니다.
이름표를 placeholder로만 두어 입력을 시작하면 사라지고,
오류는 색과 기호로만 알리며, 보내기는 <div>라
Tab으로 도달할 수 없습니다.
두 폼을 만든 요청의 차이는 타이핑 두 줄입니다. 결과의 차이는 '사용할 수 없는 사람이 있는 폼'과 '누구나 사용할 수 있는 폼'입니다. 「조건이 담긴 요청」의 폼에서 Tab을 눌러보면 이름, 이메일, 문의 내용, 보내기 순으로 이동하고 마지막에서 Enter로 제출됩니다. 「막연한 요청」 쪽은 보내기에 도달하지 못합니다.
책 5장에서 이 비교를 다룹니다. 폼 자체의 자세한 이야기는 13장입니다.