Banner Landmark
배너 랜드마크
배너 랜드마크는 전체 웹사이트의 주요 헤더 영역입니다. 넓은 공지 스트립 또한 배너라고 부를 수 있지만, 이는 다른 디자인 패턴입니다.
다른 예시
한 사이트가 모든 페이지에서 로고, 전체 사이트 검색, 계정 컨트롤을 반복합니다. 하나의 최상위 배너 랜드마크가 이들을 그룹화하여 스크린 리더 사용자가 그곳으로 바로 이동할 수 있게 합니다. 글 안의 헤더는 모두 배너 랜드마크가 되어서는 안 됩니다.
주요 부분
- 01사이트 아이덴티티
- 02전역 컨트롤
- 03배너 랜드마크
사용할 때
메인 사이트 헤더 랜드마크에 이 용어를 사용하세요. 시각적 공지 스트립을 의미한다면 명확히 말하세요.
다음 경우에는 사용하지 마세요
여러 최상위 배너 랜드마크를 만들거나 모든 넓은 상자를 의미론적 배너라고 가정하지 마세요.
코드에서 사용된 이름
<header> at document scope → role=banner 출시하기 전에
Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.
Outcome:Complete the task with 배너 랜드마크 (Banner Landmark)。 User context:한 사이트가 모든 페이지에서 로고, 전체 사이트 검색, 계정 컨트롤을 반복합니다. 하나의 최상위 배너 랜드마크가 이들을 그룹화하여 스크린 리더 사용자가 그곳으로 바로 이동할 수 있게 합니다. 글 안의 헤더는 모두 배너 랜드마크가 되어서는 안 됩니다. Recommended pattern:배너 랜드마크 (Banner Landmark)。 Why it fits:메인 사이트 헤더 랜드마크에 이 용어를 사용하세요. 시각적 공지 스트립을 의미한다면 명확히 말하세요. Do not use it when:여러 최상위 배너 랜드마크를 만들거나 모든 넓은 상자를 의미론적 배너라고 가정하지 마세요. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary):이 표준은 나열된 범위만 적용합니다. 시각적 스타일, 제품 결정, 또는 Vibulary 예시는 선택하지 않습니다. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
이 요청을 확인하세요
Review how 배너 랜드마크 (Banner Landmark) is used now. Definition: 배너 랜드마크는 전체 웹사이트의 주요 헤더 영역입니다. 넓은 공지 스트립 또한 배너라고 부를 수 있지만, 이는 다른 디자인 패턴입니다. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.