Form 랜드마크
form
랜드마크는 다른 기명 랜드마크(예를 들어, main 또는 search)가 적절하지 않은 경우 양식을 만들도록 결합되는 항목과 객체들의 모음을 포함하는 영역 전체로 식별합니다.
ARIA 1.2 명세: form
랜드마크
디자인 패턴
- 양식이 검색 기능으로 사용되는 경우
form
랜드마크 대신search
랜드마크를 사용하세요. form
랜드마크는 사용자들이 양식의 목적 이해를 돕기 위한 레이블을 가져야 합니다.form
랜드마크에 대한 레이블은 보이는aria-labelledby
를 사용하여 제목 엘리먼트로 (예를 들어,h1-h6
엘리먼트) 식별되어야 합니다.- 페이지가 둘 이상의
form
랜드마크를 포함하는 경우, 각각은 고유한 레이블을 가져야 합니다. -
가능한 항상 HTML 문서의
form
랜드마크에 포함된 컨트롤들은 네이티브 호스트 의미론을 사용해야 합니다:button
input
select
textarea
form
엘리먼트가 접근 가능한 이름을 가진다면 form
랜드마크로 간주됩니다.
HTML Form 랜드마크 예
다음 두 양식이 (예를 들어, 주소록 추가와 조직 추가) 동일한 웹 페이지에서 독립적으로 제출될 수 있다고 가정해보세요.
Source Code
<form aria-labelledby="contact">
<fieldset>
<legend id="contact">연락처 추가 </legend>
... 연락처 추가 폼 컨트롤 ...
</fieldset>
</form>
...............
<form aria-labelledby="organization">
<fieldset>
<legend id="organization">조직 추가 </legend>
... 조직 추가 폼 컨트롤 ...
</fieldset>
</form>
<fieldset>
<legend id="contact">연락처 추가 </legend>
... 연락처 추가 폼 컨트롤 ...
</fieldset>
</form>
...............
<form aria-labelledby="organization">
<fieldset>
<legend id="organization">조직 추가 </legend>
... 조직 추가 폼 컨트롤 ...
</fieldset>
</form>
role="form"
어트리뷰트가 form 랜드마크를 정의합니다.- 페이지의 영역을 식별하도록
role="form"
을 사용하세요; 모든 양식 필드를 식별하는데 사용하지 마세요.
ARIA Form 랜드마크 예
다음 두 양식 (예를 들어, 주소록 추가와 조직 추가)이 동일한 웹 페이지에서 독립적으로 제출할 수 있다고 가정해보세요.
Source Code
<div role="form" aria-labelledby="contact">
<fieldset>
<legend id="contact">주소록 추가 </legend>
... 주소록 추가 폼 컨트롤 ...
</fieldset>
</div>
...............
<div role="form" aria-labelledby="organization">
<fieldset>
<legend id="organization">조직 추가 </legend>
... 조직 추가 폼 컨트롤 ...
</fieldset>
</div>
<fieldset>
<legend id="contact">주소록 추가 </legend>
... 주소록 추가 폼 컨트롤 ...
</fieldset>
</div>
...............
<div role="form" aria-labelledby="organization">
<fieldset>
<legend id="organization">조직 추가 </legend>
... 조직 추가 폼 컨트롤 ...
</fieldset>
</div>