A11y 프롬프트: 태그 및 양식 컨트롤 바인딩

HTML 코드에서 autocomplete 속성을 사용하더라도 각 양식 컨트롤에는 표시되는 레이블이 있어야 합니다.
아이콘은 적당한 표시만 하면 보이는 탭일 수도 있습니다.
따라서 항상 for의 <label> 속성과 폼 컨트롤의 id 속성을 사용하여 탭을 폼 컨트롤에 연결하여 접근 가능한 이름을 받는 것을 기억하십시오.

<label for="name">Name</label>
<input type="text" id="name" name="name">

이러한 방식을 통해 우리는 세 가지 우세를 얻었다.

폼 컨트롤을 활성화하는 구역이 더 큽니다. <label>와 관련된 폼 컨트롤을 누르면 초점을 받을 수 있기 때문입니다.

음성 브라우저가 창 컨트롤에 초점을 부여할 때 관련 <label>를 발표합니다.

음성인식 소프트웨어를 사용하는 사용자는 관련<label>의 이름을 말해서 폼 컨트롤을 활성화할 수 있다.

하나의 특례는 <input type="button"> 인데, 이것은 정확한 value 속성을 포함하고 있으며, 어떤 라벨도 그것과 연관시키지 않는 것이 가장 좋다. 왜냐하면 일부 보조 기술이 폼 컨트롤을 해석하는 방식을 방해하기 때문이다.<button>도 마찬가지다.