성공 기준(SC)
제목과 레이블은 주제나 목적을 설명한다.
2.4.6 제목과 레이블
(Level AA)
- 목표
- 페이지의 콘텐츠를 제목과 레이블로 설명한다.
- 할 일
- 내용을 설명하는 제목과 레이블을 제공한다.
- 중요성
- 특히 인지 장애나 시각 장애가 있는 사람이 스스로 위치를 파악할 수 있다.
이 성공 기준의 목적은 사용자가 웹 페이지에 어떤 정보가 담겨 있고 그 정보가 어떻게 구성되어 있는지 이해하도록 돕는 것이다. 제목이 명확하고 내용을 알려준다면, 사용자는 원하는 정보를 더 쉽게 찾고, 콘텐츠의 여러 부분 간 관계를 더 쉽게 이해할 수 있다. 내용을 설명하는 레이블은 사용자가 콘텐츠 내의 특정 구성 요소를 식별하는 데 도움이 된다.
레이블과 제목이 길 필요는 없다. 콘텐츠를 찾고 탐색하는 데 적절한 단서를 제공한다면, 한 단어 또는 단 하나의 문자만으로도 충분할 수 있다.
양식 컨트롤의 레이블은 보통 텍스트 기반이다. 경우에 따라 이미지가 추가 텍스트 없이 내용을 설명하는 레이블 역할을 할 수 있다. 이러한 경우, 저작자는 해당 이미지와 그것이 (맥락 상에서) 레이블로 사용되는 방식이 누구나 이해되도록 해야 한다.
동일한 이미지라도 맥락에 따라 다르게 해석할 수 있다는 점에 유의해야 한다. 그러나 각 맥락에서 그 쓰임을 일반적으로 이해할 수 있다면 여전히 내용을 설명하는 것으로 볼 수 있다. 예를 들어, 텍스트 필드에 함께 놓인 돋보기 아이콘에 “검색”이라는 대체 텍스트가 있으면, 사용자는 대개 그 필드가 검색어를 입력하고 제출하는 곳임을 알 수 있다.
다른 이미지 위나 근처에 놓인 돋보기 아이콘을 보면, 일반적으로 사용자는 해당 이미지를 확대해서 보는 수단이라고 이해한다(예를 들어, 이미지를 확대하는 기능을 하거나, 원본 크기의 이미지를 새 창에서 여는 방식).
이 성공 기준은 제목이나 레이블을 제공하는 경우 그것이 내용을 설명할 것을 요구한다. 이 성공 기준이 제목이나 레이블을 반드시 제공하도록 요구하는 것은 아니다. 입력란의 레이블은 3.3.2 레이블 또는 지시문에서 별도로 다룬다. 또한 이 성공 기준은 제목이나 레이블 역할을 하는 콘텐츠를 올바르게 마크업하거나 식별하도록 요구하지도 않는다. 이 측면은 1.3.1: 정보와 관계에서 별도로 다룬다. 콘텐츠가 이 성공 기준을 충족하면서 성공 기준 1.3.1을 위반할 수 있다(제목이나 레이블 역할을 하는, 내용을 설명하는 콘텐츠 제공했지만 올바르게 마크업하거나 식별하지 않은 경우). 반대로, 콘텐츠가 성공 기준 1.3.1을 충족하면서 이 성공 기준을 위반하는 것도 가능하다(제목이나 레이블을 올바르게 마크업하거나 식별하였으나 그 내용이 부정확하거나 충분히 명확하지 않은 경우).
또한 레이블의 경우, 이 성공 기준은 양식 컨트롤과 입력란에 접근 가능한 이름을 제공하는 다른 방식을 사용했는지 고려하지 않는다. 이 측면은 4.1.2: 이름, 역할, 값에서 별도로 다룬다. 컨트롤과 입력란이 적절한 접근 가능한 이름을 가져(예: aria-label=”…” 사용) 성공 기준 4.1.2를 충족하더라도, 이 성공 기준을 여전히 위반할 수 있다(레이블이 부정확하거나 충분히 명확하지 않거나 내용을 제대로 설명하지 않는 경우).
이 성공 기준은 레이블 사용을 요구하지 않는다. 다만 레이블이 있는 경우 정확하고 충분히 명확하게 내용을 설명해야 한다. 레이블 사용에 대한 자세한 내용은 3.3.2: 레이블 또는 지시문을 참조한다.
- 내용을 설명하는 제목은 특히 읽기가 느린 사용자와 단기 기억에 어려움이 있는 사람에게 도움이 된다. 이들은 섹션 제목만으로 각 섹션에 무엇이 담겨 있는지 예측할 수 있어 유용하다.
- 양식 입력 컨트롤에 입력할 내용을 명확하게 설명하는 레이블이 있으면 사용자는 양식을 성공적으로 작성하는 방법을 알 수 있다.
- 제목과 레이블을 1.3.1: 정보와 관계에 따라 올바르게 마크업하고 식별하면, 레이블과 제목이 다른 형식으로 더 명확하게 제시된다. 이를 통해 스크린 리더 사용자를 돕는다. 예를 들어 자동으로 생성된 제목 목록, 목차, 또는 페이지 내에서 제목과 제목 사이를 이동할 때가 그렇다.
- 뉴스 사이트
한 뉴스 사이트의 홈페이지에 그 시각의 주요 기사 헤드라인이 나열되어 있다. 각 헤드라인 아래에는 기사의 첫 35단어와 전체 기사로 연결되는 링크가 있다. 각 헤드라인은 기사의 주제를 명확하게 설명한다.
- 글을 잘 쓰는 방법에 대한 안내서
글쓰기 안내서에 다음과 같은 섹션 제목이 있다.
잘 쓰는 법
,쓸모없는 단어 덜어내기
,불필요한 단어 찾아내기
등이다. 섹션 제목은 명확하고 간결하며, 정보의 구조가 제목의 구조에 정확하게 드러난다.- 여러 논문의 일관된 제목
한 웹사이트에 학회 논문이 게시되어 있다. 학회 제출물은 다음과 같은 구성을 갖추어야 한다.
요약
,서론
, [해당 논문의 고유한 기타 섹션],결론
,저자 소개
,용어집
,참고문헌
이다. 각 웹 페이지의 제목은 그 페이지에 담긴 논문을 명확하게 나타내며, 이를 통해 논문 각각의 고유성과 섹션 제목의 일관성이 적절한 균형을 이룬다.- 사용자 이름을 묻는 양식
한 양식이 사용자의 이름을 묻는다. 이 양식은 이름과 성을 묻는 두 개의 입력란으로 이루어져 있다. 첫 번째 입력란에는
이름
, 두 번째 입력란에는성
이라는 레이블이 붙어 있다.- 돋보기 아이콘으로 레이블이 지정된 검색 필드
검색 텍스트 입력란 뒤에 검색 기능을 실행하는 돋보기 아이콘 버튼이 있다. 이 아이콘은 프로그래밍 방식으로 판별 가능한 레이블로 “검색”이라는 문자열이 지정되어 있다.
자료는 정보 제공 목적으로만 제공되며 보증을 암시하지 않는다.
- How Users Read on the Web A study showing that most users scan Web pages rather than reading them word by word.
- Applying Writing Guidelines to Web Pages A report on the effects of making Web sites concise, easy to scan, and objective.
이 섹션의 각 번호가 매겨진 항목은 접근성 지침 실무 그룹이 이 성공 기준을 충족하기에 충분하다고 판단하는 기법 또는 기법의 조합을 나타낸다. 기법은 기준의 최소 요구 사항을 넘어설 수 있다. 이러한 기법에서 포괄하지 않은 기준 충족의 다른 방법이 있을 수 있다. 다른 기법 사용에 대한 정보는 WCAG 성공 기준에 대한 기법 이해, 특히 “기타 기법” 섹션을 참조하라.
참고
제목과 레이블은 성공 기준 1.3.1에 따라 프로그래밍 방식으로 판별되어야 한다.
적합성을 위해 반드시 필요하지는 않지만, 콘텐츠의 접근성을 높이기 위해 다음의 추가 기법을 고려해야 한다. 모든 기법을 모든 상황에서 사용할 수 있거나 효과가 있는 것은 아니다.
- G201: Giving users advanced warning when opening a new window
- SCR24: Using progressive enhancement to open new windows on user request
다음은 이 성공 기준의 특정 측면에 대한 점검 규칙이다. WCAG 준수 여부를 확인하기 위해 이러한 특정 점검 규칙을 사용할 필요는 없지만 이것은 정의되고 승인된 검사 방법이다. 점검 규칙 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 점검 규칙 이해를 참고하라.