본문 바로가기
Spec UP - Frontend/부스트코스_UI 개발

웹 접근성_제목 제공

by TIS_Ha 2020. 4. 1.
반응형

페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 합니다.

 

페이지 제목 제공

웹 페이지의 제목은 유일하고 서로 다르게 제공해야 합니다.

그렇게 제공하면 여러 페이지가 열려 있는 경우 비장애인들도 제목만 보고 구분하여 빨리 선택할 수 있습니다.

스크린리더 사용자도 제목이 전부 똑같이 제공되어 있거나 내용과 다르게 제공되어 있으면 인식하기 힘들기 때문에 페이지 제목을 적절하게 제공해야 합니다.

페이지 제목은 해당 내용을 이해할 수 있도록 제일 하위분류로 적절하게 제공해야 합니다.

뉴스 상세 페이지 제목도 마찬가지로 해당 뉴스에 대한 타이틀을 제목으로 제공해야 하며 게시판의 경우에도 글 읽기, 글 보기, 목록 등 각각의 게시판 용도에 맞게 페이지 제목을 제공해야 합니다.

각 페이지의 핵심 내용을 제목으로 제공해주시면 됩니다.

 

프레임 제목 제공

프레임이나 아이프레임에도 각 프레임을 설명하는 간단 명료한 제목을 제공해야 합니다.

광고를 아이프레임으로 제공한 경우 아이프레임의 title을 "광고"라고 제공하면 됩니다.

내용이 없는 빈 프레임의 경우에도 title을 다음과 같이 "빈 프레임" 또는 "내용 없음" 등으로 제공해야 합니다.

웹 페이지를 구성하는 모든 프레임에 제목을 제공하면 시각 장애인, 지적 장애인, 중증 지체 장애인 등의 사용자가 프레임 제목을 통해 프레임 간을 매우 편리하게 이동할 수 있습니다.

 

콘텐츠 제목 제공

콘텐츠 블록에도 제목을 제공해야 합니다.

뉴스스탠드 콘텐츠는 헤딩 태그로 콘텐츠의 제목을 "뉴스스탠드"라고 제공하는 것이 적절하며,

여기에서 주의할 사항은 뉴스스탠드랑 동일한 depth에 있는 콘텐츠는 하위나 상위 콘텐츠가 아니기 때문에 동일한 헤딩 태그로 일관성 있게 제목을 제공해야 합니다.

이때 제목을 숨김 처리할 경우 1번 항목에서 언급했듯이 "display:none"나 "visibility:hidden"속성은 스크린리더에서 읽어주지 않기 때문에 다른 방법으로 보이지 않게 처리해야 합니다.

 

특수 기호 사용 제한

연속된 특수기호를 사용하게 되면 스크린리더에서 불필요한 음성을 반복해서 출력하게 되므로 시각적인 장식을 위해 반복되는 특수문자는 제공하지 않아야 하며 특수 기호는 1개까지만 사용 제한을 두고 있습니다.

페이지, 프레임, 콘텐츠 제목 모두 마찬가지입니다.

반응형

댓글