ARIA: landmark 역할
랜드마크는 페이지의 중요한 하위 구획입니다. landmark
역할은 사용자가 직접 탐색하고자 할 만큼 중요한 콘텐츠 구획에 대한 aria 역할 값의 추상 상위 클래스입니다.
참고: > landmark
역할은 추상 역할입니다. 문서의 완성도를 위해 여기에 포함되었습니다. 웹 작성자가 사용해서는 안 됩니다.
설명
landmark
는 사용자가 쉽게 탐색하고자 하며 페이지의 동적으로 생성된 요약에 포함되기를 원할 만큼 중요한 콘텐츠 구획을 위한 추상 역할입니다. 랜드마크를 사용하면 보조 기술이 콘텐츠를 빠르게 탐색하고 찾을 수 있습니다.
랜드마크 역할을 만들려면 <section>
, <nav>
, <main>
과 같은 의미론적 요소를 사용하거나 role="banner"
, role="complementary"
, role="region"
과 같은 landmark
역할의 하위 클래스인 ARIA 역할을 추가하여 콘텐츠의 목적을 정의하세요. role="landmark"
는 사용하지 마세요.
가시적인 레이블을 제공하고 aria-labelledby
로 참조해야 합니다. 필요한 경우 aria-label
을 사용하여 간단하고 설명적인 레이블을 제공할 수 있습니다.
스크린 리더 사용자의 경우, 랜드마크 역할을 추가하면 효과적으로 '건너뛰기 링크'가 생성되지만 페이지 내 탐색을 대체하지는 않습니다. 랜드마크 역할은 다른 방식으로 표면화되지 않기 때문입니다.
모범 사례
role="landmark"
를 사용하지 마세요. HTML과 하위 클래스 랜드마크 역할을 사용하세요.
랜드마크는 콘텐츠가 탐색 가능한 영역에 있도록 보장합니다. role="main"
에는 <main>
, role="banner"
에는 <header>
, role="navigation"
에는 <nav>
, role="contentinfo"
에는 <footer>
를 사용하세요. 관련된 의미론적 요소와 함께 역할을 중복해서 포함하는 것도 좋은 방법입니다. <div>
와 같은 비의미론적 요소에 랜드마크 역할로 의미를 추가하는 것은 그만큼 좋은 방법은 아닙니다. 하지만 둘 중 하나 또는 둘 다를 포함하세요. 그렇지 않으면 스크린 리더 사용자가 콘텐츠를 탐색하기 어려워집니다.
명세서
Specification |
---|
Accessible Rich Internet Applications (WAI-ARIA) # landmark |