반응형
인지 장애인분이나 몸이 불편하신 신체 약자분들도 웹 환경을 동등하게 사용하기 위해 웹 접근성 지침 항목이 만들어져 있습니다.
그 중 스킵 내비게이션(Skip Navigation)은 접근성에서 키보드 사용자를 위해 필요한 요소로 키보드만 사용하여 하단 메뉴나 다른 페이지 메뉴로 이동시 지속적으로 탭키로 이동하여야 하는 번거로움을 덜어줄 수 있게 하기 위해 만들어진 구조입니다. 쉽게 이야기하면 사용자가 원하는 대 메뉴로 바로 이동할 수 있는 메뉴 바로가기라고 생각하시면 이해하기가 조금 더 쉬울 거 같아요.
그렇기 때문에 탭키로 포커스 진입시 가장 먼저 스킵 메뉴로 진입해야 하기 때문에 마크업 시 DOM 구조의 가장 최상단에 위치하여야 합니다.
예제로 만든 스킵 네비게이션은 탭으로 포커스가 스킵 내비게이션에 진입하였을 경우 스킵 내비게이션 메뉴가 노출되는 구조로 만들어져 있습니다.
반응형
'IT > HTML & CSS' 카테고리의 다른 글
| 모바일에서 caption 속성 처리 시 유의점 (0) | 2021.03.09 |
|---|---|
| 누구나 쉽게 가로 스크롤 메뉴 적용하기 (2) | 2021.03.09 |
| 의외로 잘 모르는 HTML & CSS 8가지 알아보기 (0) | 2021.03.05 |
| html5의 data- 속성 톺아보기 (0) | 2021.03.04 |
| BEM 방법론 알아보기 (0) | 2021.02.26 |
광고차단(애드블록)프로그램이나 브라우저를 사용중이시면 프로그램을 비활성화이나 블로그 주소를 예외 처리 해주시면 광고가 노출됩니다. 귀찮고 번거롭겠지만 광고 클릭은 저에게는 큰 힘이 됩니다. 🙇🏻♂️🙇🏻♀️
제 블로그의 모든 글은 제가 직접 작성 하고 다른 글을 참고할 때는 이전 글보다 읽기 편하게 수정해서 작성하고 있습니다. 커피 한잔 사먹고 더 열심히 좋은글로 보답하겠습니다.
오늘도 제 블로그에 와 주셔서 감사합니다. :)
제 블로그의 모든 글은 제가 직접 작성 하고 다른 글을 참고할 때는 이전 글보다 읽기 편하게 수정해서 작성하고 있습니다. 커피 한잔 사먹고 더 열심히 좋은글로 보답하겠습니다.
오늘도 제 블로그에 와 주셔서 감사합니다. :)
