W3C Logo

ARIA 랜드마크 예제

다음 버튼을 사용하여 페이지의 랜드마크와/또는 헤딩에 대한 윤곽을 시각적으로 보세요.

Banner 랜드마크

banner 랜드마크는 웹사이트 내 각 페이지의 시작 부분에 있는 사이트 지향적인(site-oriented) 콘텐츠를 식별합니다. 사이트 지향적인(site-oriented) 콘텐츠는 일반적으로 로고나 사이트 제공자의 신분 같은 것들과, 사이트 지향적인(site-oriented) 검색 도구를 포함합니다. 배너는 보통 페이지의 맨 위에 나타나고 일반적으로 전체 너비에 걸쳐 있습니다.

ARIA 1.2 명세: banner landmark.

디자인 패턴

  • 각 페이지는 하나의 banner 랜드마크를 가질 수 있습니다.
  • banner 랜드마크는 최상위 랜드마크이어야 합니다.
  • 페이지가 중첩된 document와/또는 application 역할(role)을 포함하는 경우 (예를 들어, 일반적으로 iframeframe 엘리먼트의 사용을 통해), 각 documentapplication 역할(role)은 하나의 banner 랜드마크를 가질 수 있습니다.
  • 페이지가 두 개 이상의 banner 랜드 마크를 포함한다면, 각각은 고유한 레이블을 가져야 합니다.
  • HTML header 엘리먼트는 그것의 컨텍스트가 body 엘리먼트인 경우 banner 랜드마크를 정의합니다.
  • HTML header 엘리먼트는 다음 엘리먼트들 중 하나의 후손일 경우 banner 랜드마크로 간주되지 않습니다:
    • article
    • aside
    • main
    • nav
    • section

HTML 예제

<header>
  <h1>website information<h1>
  .... banner content....
</header>

banner 랜드마크를 지정하도록 role="banner" 어트리뷰트가 사용됩니다.

ARIA 예제

<div role="banner">
  <h1>page title identifying website<h1>
  .... banner content....
</div>