현재 페이지 위치

Home> 나눔> 웹접근성 가이드> PC/모바일 웹 접근성 체크리스트

PC/모바일 웹 접근성 체크리스트

체크리스트 보기

7.3.1 링크 텍스트가 단독으로 사용될 때도 정확한 의미 파악이 가능한가??

장애 유형

장애 유형
전맹, 저시력
오류 설명
  • 키보드 Tab키, 가상포커스로 이동 시 링크로만 이동이 가능함.
  • 링크가 단독으로 쓰였을 때 그 목적지를 알 수 없으면 앞뒤 문맥을 모두 파악해야 하므로 링크가 단독으로 쓰였을 때도 용도나 목적지가 모호하지 않도록 제공해야 함.
  • 구체적인 링크 텍스트를 제공하기에 공간이 부족할 경우 title속성이나 숨김텍스트로 제공할 수 있음.

오류 유형

목적이나 용도를 알기 어려운 링크 텍스트를 제공한 경우

오류 예시
공지사항, 재단뉴스, 입찰정보 각각의 더보기를 그냥 '더보기'로만 제공하고 있음.
참고 이미지
목적이나 용도를 알기 어려운 링크 텍스트를 제공한 예
해결 방법
각각 '공지사항 더보기', '재단뉴스 더보기','입찰정보 더보기' 로 제공해야 함.

한 페이지에 다른 목적지를 가진 동일한 링크 텍스트가 두개 이상 들어간 경우

오류 예시
페이지에 다른 목적지를 가진 동일한 링크 텍스트인 '더보기' 가 두개 이상 존재함
참고 이미지
한 페이지에 다른 목적지를 가진 동일한 링크 텍스트가 두개 이상 들어간 예
해결 방법
한 페이지에 다른 목적지를 가진 링크가 동일한 텍스트 링크 텍스트를 갖지 않도록 해야 함.

모바일 환경에서 목적이나 용도를 알기 어려운 링크 텍스트를 제공한 경우

오류 예시
오늘의 레시피 더보기를 '더보기'로만 제공하고 있음.
참고 이미지
해결 방법
'오늘의 레시피 더보기'와 같이 명확한 링크명을 제공해야 함

주의 사항

UI상 정확한 링크 텍스트 제공이 어려워(공간이 협소한 경우 등) 숨김 텍스트 혹은 title로 제공한 경우 오류 아님.

오류 예시
'백업' 'edit', 'del', '비우기' 등 동일한 링크텍스트를 여러개 사용하고 있으나 공간이 협소하고 숨김 텍스트 혹은 title로 정확한 텍스트를 제공하고 있어 오류가 아님.
참고 이미지
공간이 협소하여 링크 텍스트의 정확한 정보를 title로 제공한 예
해결 방법
UI상 정확한 링크 텍스트 제공이 어려운 경우 숨김 텍스트 혹은 title 속성으로 전체 링크 텍스트 제공.
단, title 속성은 보조 도구의 설정에 따라 사용자에게 전달되지 못하는 경우도 발생할 수 있으므로 숨김 텍스트로 제공하는 것을 권장함.
<a href='...'><span class='blind'>기타</span> 백업</a>
<a href='...' title='기타 백업'>백업</a>

평가 방법

  • 링크가 없을 경우 해당 없음 처리

링크 텍스트의 용도나 목적지가 정확한지 검토

평가 도구
N-WAX
평가 방법
'7.3.1 링크 텍스트' 항목에서 동일한 링크 텍스트가 있는지 확인
동일한 링크 텍스트가 있을 경우 title 속성으로 구체적인 링크의 목적이 표현되었는지 확인
참고 이미지

모바일 환경에서 링크 텍스트의 용도나 목적지가 정확한지 검토

평가 도구
User Agent Switcher(파이어폭스 부가기능), N-WAX
평가 방법
Firefox 도구 메뉴 User Agent Switcher 의 Defalut User Agent 설정으로 원하는 모바일 기기 환경을 선택한 후, N-WAX를 활용해 PC환경에서의 평가와 동일하게 진행함

평가 도구 전체 설치 방법