표준화 방식으로 만들고 title을 통해 추가적인 정보를 제공해 주면, '보조 기술 사용자'들이 정보를 이해 하고 판단하는데 큰 도움을 주게 됩니다.
기술설명
이 기술의 목적은 보조 기술이 웹 콘텐츠를 이해하게 하여 보조 기술을 사용하는 사용자에게 동등한 정보를 전달하고, 사용자가 보조 기술을 통해 컨트롤 할 수 있게 하는 것입니다.
이 기술은 표준화, 문서화 및 지원되는 기능을 사용하여 보조 기술(Assistive Technology)이 인식하게 만드는 것입니다.
이는 표준 브라우저의 이러한 표준 컨트롤이 요구 사항을 충족해야 가능합니다.
HTML은 다음과 같은 사항을 좋아합니다. 또한 다른 기술에도 적합하게 적용할 수 있습니다.
구성 요소가 접근성을 지원하더라도 작성자가 일부 정보를 제공하는 것이 필수적입니다.
예를 들어 컨트롤은 이름(name)을 제공하는 기능이 있지만, 작성자는 여전히 이름을 제공해야 합니다.
그러나 역할 속성은 고정된 역할을 가진 표준 구성 요소라서 이미 제공될 수도 있습니다.
예시
HTML 또는 XHTML로 작성된 웹페이지는 표준 폼 컨트롤을 사용하고 title속성을 사용하여 폼 컨트롤을 식별합니다.
사용자 에이전트 DOM과 플랫폼별 Accessibility API를 통해 이러한 컨트롤에 대한 정보를 보조기술로 제공한다.
관련기술
G135: 기술의 접근성 API 기능을 사용하여 이름과 역할을 노출하고 사용자가 설정할 수 있는 속성을 직접 설정할 수 있도록 하며 변경 사항에 대한 알림을 제공합니다.
H44: 레이블 요소를 사용하여 텍스트 레이블을 양식 컨트롤과 연결
SCR21: DOM(문서 개체 모델) 기능을 사용하여 페이지에 콘텐츠 추가
점검절차
1. 마크업을 검사합니다. 도구를 사용해도 됩니다.
2. 각 사용자 인터페이스 구성 요소의 이름과 역할을 결정할 수 있도록 적절한 마크업이 사용되었는지 확인합니다.
3. 사용자 입력을 허용하는 사용자 인터페이스 구성 요소를 모두 '보조 기술(Assistive Technology)'에서도 작동할 수 있도록 적절한 마크업이 사용되었는지 확인합니다.
나의 정리
한 번씩 이해할 수 없는 내용의 지침이 나오는데 이번에도 그런 것 같습니다.
결론부터 말하면 HTML을 만들 때 마크업(markup)을 잘 지켜서 만들라는 것입니다.
그럼 마크업(markup)이란 무엇일까요? 마크업은 문서의 내용을 구조에 맞는 형식으로 지정하는 것입니다.
<h1>HTML 이란?</h1>
<p>하이퍼 텍스트 마크업 언어를 말합니다.</p>
<a href=“about.html”>자세히 보기</a>예를 들면 가장 큰 헤드라인은 <h1>요소를 쓰고 긴 설명의 글에는 <p>요소를 사용하며, 링크가 되어야 하는 부분에는 <a>태그를 사용해야 합니다.
이렇게 상황과 특성에 맞는 요소를 사용하는 것을 마크업이라고 할 수 있습니다.
이렇게 마크업에 맞게 작업하는 것을 다른 말로 '표준화'라고 합니다.
표준화로 만들게 되면 '보조 기술'이 해당 요소를 정확하게 이해할 수 있게 되고 그렇게 되면 '보조 기술을 사용하는 사용자'들 또한 해당 요소의 역할을 정확하게 이해 할 수 있게 됩니다.
즉 표준화로 만들면 '보조 기술'이 이해할 수 있고, 이해한 '보조 기술'이 '보조 기술을 사용하는 사용자'에게 정확한 정보를 전달해 줄 수 있는 것입니다.
예를 들어 <h1>HTML 이란?</h1>라고 선언하면 보조 기술은 'HTML 이란?'은 이 문서의 헤드라인이라고 인식합니다. 그리고 보조 기술을 사용하는 사용자에게 이 문서의 헤드라인은 'HTML 이란?'이라고 알려주게 됩니다.
하지만 마크업만으로는 '보조 기술 사용자'에게 모든 것을 알려줄 수 없습니다.
그래서 'title' 속성을 추가하여 동작 및 자세한 정보를 제공해야 합니다.
위 예제에서 <a href="about.html">자세히 보기</a> 부분이 있습니다.
클릭하면 다른 페이지로 이동하는 링크 요소입니다. 여기에 'title'요소를 추가하여 앞으로 일어날 행동을 알려줍니다.
<a href="about.html" title="클릭하면 자세한 내용을 알려주는 페이지로 이동합니다.">자세히 보기</a>이렇게 title을 통해 페이지가 이동된다는 것을 알려주면 '보조 기술 사용자'는 자세한 내용을 알기 위해서는 페이지를 이동해야 한다는 것을 알게 되고, 그에 맞는 판단과 행동을 결정할 수 있게 됩니다.
표준화 방식으로 만들고 title을 통해 추가적인 정보를 제공해 주면, '보조 기술 사용자'들이 정보를 이해 하고 판단하는데 큰 도움을 주게 됩니다.
G108: Using markup features to expose the name and role, allow user-settable properties to be directly set, and provide notification of changes
https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G108.html
G108: Using markup features to expose the name and role, allow user-settable properties to be directly set, and provide notifica
Example 1: A Web page written in HTML or XHTML uses standard form controls, and identifies the form control using the title attribute. The user agent makes information about these controls, including the name, available to assistive technology through the
www.w3.org
'웹접근성지침(WCAG2.0)' 카테고리의 다른 글
| [웹접근성 지침-일반기술 G111] 색상과 패턴 사용법 (2) | 2024.08.27 |
|---|---|
| [웹접근성 지침-일반기술 G110] 클라이언트의 즉각적인 반응을 위해 리다이렉트(redirect)를 사용해야 합니다. (0) | 2024.08.20 |
| [웹접근성 지침-일반기술 G107] 콘텍스트 변화의 시발점은 '포커스(Focus)'가 아닌 '활성화(Activate)'이어야 합니다. (0) | 2024.08.08 |
| [웹접근성 지침-일반기술 G105] 사용자가 재인증한 후에 계속 사용할 수 있도록 데이터를 저장해야 한다. (0) | 2024.07.31 |
| [웹접근성 지침-일반기술 G103] 생각이나 상황, 과정을 이해하는데 도움을 주는 시각적 그림이나 사진, 일러스트를 제공해야 한다. (0) | 2024.07.26 |
