[웹표준사이트] 스킵 메뉴

2021. 3. 24. 14:37TIL/웹표준사이트

728x90

우리는 웹을 만들 때 웹표준과 접근성에 대해 생각하고 만들어야 한다.

 

웹 접근성이란 장애를 가진 사람들도 웹을 이용할 수 있도록 보장하는 것으로, 장애를 가진 사람들이 웹 콘텐츠를 인지하고(Perceivable), 운영하고(Operable), 이해하고(Understandable), 기술에 상관없이 이용할 수 있도록 견고한(Robust)하게 웹콘텐츠를 만드는 것을 의미한다

 

월드 와이드 웹 (World Wide Web)을 창시한 팀 버너스 리(Tim Berners-Lee)는 웹이란 '장애에 구애 없이 모든 사람들이 손쉽게 정보를 공유할 수 있는 공간'이라고 정의하였으며, 웹 콘텐츠를 제작할 때에는 장애에 구애됨이 없이 누구나 접근할 수 있도록 제작하여야 한다고 하였다.

 

이러한 웹의 기본적 철학을 바탕으로 장애인뿐만 아니라 모든 사람이 정보통신 기기나 서비스를 손쉽게 활용할 수 있도록 만드는 것을 접근성이라고 말한다.

 

"웹의 힘은 그것의 보편성에 있다. 장애에 구애없이 모든 사람이 접근할 수 있는 것이 필수적인 요소이다." (The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect.)

-팀 버너스 리(Tim Berners - Lee , W3C Director and inventor of the World Wide Web)

 

 

 

스킵메뉴는 웹접근성을 위한 가장 기본적인 버튼으로, 키보드의 TAB 키를 눌렀을 때 해당 영역으로 갈 수 있는 메뉴 바로가기를 나타낸다.

 

 

  1. 스킵 네비게이션은 <body> 다음으로 나오는 것이 가장 적절하다
  2. a링크를 이용, #아이디선택자를 불러낸다

 

  1. skip 메뉴의 위치를 -로 설정하여 메뉴가 활성화되지않았을 경우엔 화면에 보이지 않도록 설정한다.
  2. TAB키를 눌러 메뉴가 활성화 된 상태일 때(:active, :focus) 위치값을 조정하여 화면 안에 노출되도록 설정해준다.

'TIL > 웹표준사이트' 카테고리의 다른 글

Reset.css의 필요성  (0) 2021.03.31
Html 특수기호 표시  (0) 2021.03.31
Float 영역깨짐 방지법  (0) 2021.03.31
웹표준을 준수한 이미지 적용 방법 / 대체텍스트  (0) 2021.03.28
인라인/블럭 속성  (0) 2021.03.28