일반 원칙

랜드마크는 웹 페이지의 구성과 구조를 식별하는 강력한 방법을 제공합니다. 사용자에게 시각적으로 전달되는 구조 정보는 랜드마크 역할(role)을 사용하여 마크업에 프로그래밍 방식으로 표현되어야 합니다. 랜드마크 역할(role)의 사용은 스크린리더 사용자들에게 웹 페이지의 구조에 키보드 탐색을 지원하고, 작성자가 제공한 "스킵 링크"에 대한 타겟으로 그리고 향상된 키보드 탐색에 대한 브라우저 확장으로 사용될 수 있습니다.

이 섹션은 HTML 섹셔닝 엘리먼트(sectioning element)와 ARIA 랜드마크 역할(role)을 사용하여 보조 기술 설계자, 개발자, 품질 보증 담당자가 보조 기기들에 대한 논리성, 사용성 및 접근 가능한 레이아웃의 중요성을 정의하고 이해하는 것에 목적을 두고 있습니다.

오늘 날의 웹 콘텐트의 목잡성 때문에, 랜드마크를 사용한다면, 모든 인지 가능한 콘텐트는 사용자가 콘텐트를 못 보고 지나가지 않도록 의미론적(semantically)으로 유의미한(meaningful) 랜드마크에 존재해야 합니다.

1 단계: 논리적 구조 식별

"영역"이라고 불리는 인식 가능한 영역으로 페이지를 쪼갭니다.
일반적으로, 디자이너는 콘텐트의 정렬과 간격을 사용하여 시각적으로 영역을 나타탭니다.
필요에 따라 영역이 논리적 하위 영역 안으로 추가 정의될 수 있습니다.
하위 영역의 예는 포털 어플리케이션의 포틀릿입니다.

2 단계: 각 영역에 랜드마크 역할(role) 할당

영역 내의 콘텐트 유형에 따라 랜드마크 역할(role)을 할당 하세요.
banner, main, complementary, contentinfo 랜드 마크는 최상위 랜드마크여야 합니다.
랜드마크 역할(role)은 표시되는 정보의 부모/자식 관계를 식별하기 위해 중첩 될 수 있습니다.

3 단계: 각 영역에 레이블 지정

특정 랜드마크 역할(role)이 페이지에 두 번 이상 사용될 경우, 고유한 레이블을 가져야 합니다.
영역이 헤딩 엘리먼트(예를 들어 h1-h6)로 시작한다면, aria-labelledby 어트리뷰트를 사용하여 영역에 대한 레이블로 사용될 수 있습니다.
영역이 헤딩 엘리먼트를 가지지 않는다면, aria-label 어트리뷰트를 사용하여 레이블을 제공하세요.
랜드마크 역할(role)을 레이블의 일부로 사용하지 마십시오. 예를 들어, "사이트 내비게이션"이라는 레이블을 가진 네비게이션 랜드마크는 스크린리더에 의해 "사이트 내비게이션 내비게이션"이라고 낭독될 겁니다. 레이블은 단순하게 "사이트"이어야 합니다.