반응형
콘텐츠는 논리적인 순서로 제공해야 합니다.
즉, 웹 페이지를 구성하는 모든 콘텐츠는 사용자가 그 내용을 이해할 수 있도록 선형 구조로 작성되어야 합니다.
탭 제목-내용 콘텐츠
탭 메뉴가 나열되어 있고 탭에 대한 내용이 있는 경우 시각적으로는 클릭하면 해당 내용이 보이기 때문에 쉽게 인식할 수 있습니다.
스크린리더 사용자는 메뉴와 내용을 따로 마크업하는 경우 메뉴를 다 읽어주고 나서야 내용을 읽어주기 때문에 어떤 메뉴에 대한 내용인지 인식할 수 없습니다.
따라서 메뉴 내용 메뉴 내용 순으로 마크업하거나 메뉴끼리 내용끼리 마크업하되 내용에 해당 메뉴 제목을 제공해 주어야 합니다.
1) 탭 1제목 > 탭 1내용 > 탭 2제목 > 탭 2내용
2) 해당 탭 콘텐츠에 제목 제공
제목-내용-더 보기 콘텐츠
제목, 내용, 더 보기가 있는 콘텐츠를 많이 보셨을 텐데요,
보이는 순서대로 공지사항, 더 보기 버튼, 내용 순으로 마크업 된 경우 오류입니다.
논리적인 순서는 제목 다음, 내용 다음, 더 보기 버튼 순이므로 마크업도 이 순서대로 해주셔야 합니다.
반응형
'Spec UP - Frontend > 부스트코스_UI 개발' 카테고리의 다른 글
웹 접근성_레이블 제공 (0) | 2020.04.01 |
---|---|
웹 접근성_표의 구성 (0) | 2020.04.01 |
웹 접근성_사용자 요구에 따른 실행 (0) | 2020.04.01 |
웹 접근성_기본 언어 표시 (1) | 2020.04.01 |
웹 접근성_적절한 링크 텍스트 (0) | 2020.04.01 |
댓글