스킵 내비게이션 쉽게 구현하고 이해하기

 

인지 장애인분이나 몸이 불편하신 신체 약자분들도 웹 환경을 동등하게 사용하기 위해 웹 접근성 지침 항목이 만들어져 있습니다. 

 

그 중 스킵 내비게이션(Skip Navigation)은 접근성에서 키보드 사용자를 위해 필요한 요소로 키보드만 사용하여 하단 메뉴나 다른 페이지 메뉴로 이동시 지속적으로 탭키로 이동하여야 하는 번거로움을 덜어줄 수 있게 하기 위해 만들어진 구조입니다. 쉽게 이야기하면 사용자가 원하는 대 메뉴로 바로 이동할 수 있는 메뉴 바로가기라고 생각하시면 이해하기가 조금 더 쉬울 거 같아요.

 

그렇기 때문에 탭키로 포커스 진입시 가장 먼저 스킵 메뉴로 진입해야 하기 때문에 마크업 시 DOM 구조의 가장 최상단에 위치하여야 합니다. 

 

예제로 만든 스킵 네비게이션은 탭으로 포커스가 스킵 내비게이션에 진입하였을 경우 스킵 내비게이션 메뉴가 노출되는 구조로 만들어져 있습니다.