아직 작성중인 글입니다!
웹 접근성
웹 접근성이란?
웹 사이트, 도구, 기술이 장애가 있는 사용자들이 사용할 수 있도록 설계 및 개발된 것을 말한다. - W3C 웹 접근성 -
과거에는 웹이 각각의 브라우저에 따라 다른 방식으로 만들어져서 웹 접근성이 좋지 못하였고, 신체적 장애나 상황적 장애에 의해 웹을 사용하는데 어려움이 있었다.
이러한 문제를 줄이고자 W3C에서 전 세계 개인 및 단체와 협력하여 W3C 프로세스를 통해 WCAG(Web Content Accessibility Guidelines, 참고)라는 웹 접근성 표준을 제공하고 있다. 이제는 웹을 개발할 때 웹 접근성을 지키는 것이 무엇보다 중요해졌다.
WCAG가 필요한 사람
- 웹 콘텐츠 개발자(페이지 작성자, 사이트 설계자 등)
- 웹 저작 도구 개발자
- 웹 접근성 평가 도구 개발자
- 모바일 접근성을 포함한 웹 접근성 표준을 원하거나 필요로 하는 기타 사용자
WCAG 발표 현황
- WCAG 2.0은 2008년 12월 11일에 출판되었다.
- WCAG 2.1은 2018년 6월 5일에 출판되었다.
- WCAG 2.2는 2021년에 출판될 예정이다.
WCAG 2.0과 WCAG 2.1은 안정적이고 참조 가능한 기술 표준이다.
2.0의 내용은 2.1에 모두 포함되어 있고, 2.1도 마찬가지로 2.2에 모두 포함될 예정이라고 한다.
웹 접근성 원칙 및 지침
웹 접근성은 크게 4가지 원칙과 각 원칙을 다루는 12개의 지침*으로 이루어진다. 그리고 각 지침들은 작성자가 노력해야 하는 기본 목표를 성공 기준(Success Criteria)으로 제공한다.
성공 기준은 A급(최하위), AA급, AAA급(최상위)라는 세 가지 준수 수준으로 나누어 진다.
이 글에서는 Level AA까지만 다룬다.
🔎 1. 인지 가능(인식의 용이성)
정보 및 사용자 인터페이스 구성 요소는 사용자가 인지할 수 있도록 표시되어야 한다.
1.1 대체 텍스트
텍스트가 아닌 콘텐츠는 그 의미나 용도를 인식할 수 있도록 대체 텍스트를 제공해야 한다.
Level A
1.1.1 Non-text Content
사용자에게 제공되는 모든 비 텍스트 콘텐츠(Non-text Content)*는 아래 상황을 제외하고 동일한 목적으로 사용되는 텍스트 대체 내용이 있다.
- Controls, Input : 비 텍스트 콘텐츠가 컨트롤 또는 사용자 입력을 허용하는 것일 경우(지침 4.1.2 참고)
- Time-Based Media : 비 텍스트 콘텐츠가 시간 기반 미디어인 경우(지침 1.2 참고)
- Test : 텍스트가 유효하지 않은 테스트 또는 연습인 경우
- Sensory : 비 텍스트 콘텐츠가 특정한 감각 경험을 만들기 위한 것일 경우
- CAPTCHA : 비 텍스트 콘텐츠가 사용자가 실제 사람인지 컴퓨터 프로그램인지를 구별하기 위해 사용되는 것일 경우
- Decoratio, Formatting, Invisible : 비 텍스트 콘텐츠의 내용이 순수한 장식이거나 시각적 형식으로만 사용되거나 사용자에게 표시되지 않는 것일 경우
※ 비 텍스트 콘텐츠(non-text content) : ASCII Art(문자의 패턴), 이모티콘, 리츠피크(문자 대체 사용), 및 텍스트를 나타내는 이미지 등을 의미한다.
1.2 시간 기반 미디어
시간 기반 미디어(Time-based Media)*에 대한 대인을 제공한다.
Level A
1.2.1 Audio-only* and Video-only*(Prerecorded)
제공된 오디오 또는 비디오가 텍스트에 대한 대체 미디어이고 명확하게 레이블이 지정된 경우를 제외하고, 오디오 또는 비디오를 대체할 자막, 영상, 오디오 등이 제공된다.
Level A
1.2.2 Captions(Prerecorded)
제공된 미디어의 오디오가 텍스트에 대한 대체 미디어이고 명확하게 레이블이 지정된 경우를 제외하고, 미리 기록된 모든 항목에 대한 캡션이 제공된다.
Level A
1.2.3 Audio Description or Media Alternative(Prerecorded)
제공된 미디어가 텍스트에 대한 대체 미디어이고, 명확하게 레이블이 지정된 경우를 제외하고, 비디오 콘텐츠의 오디오에 대한 설명이나 대체 미디어가 제공된다.
Level AA
1.2.4 Captions(Live)
라이브로 실행되는 모든 오디오 콘텐츠에 캡션(설명)이 제공된다.
Level AA
1.2.5 Audio Description(Prerecorded)
사전 녹음된 비디오 콘텐츠의 모든 항목에 대한 오디오 설명이 제공된다.
※ Time-based Media : 오디오 클립, MIDI 시퀀스, 동영상 크립, 애니메이션 과 같이 시간에 따른 변화가 중요한 미디어
※ Audio-only : 오디오만 포함하는 시간 기반 프레젠테이션(비디오 및 상호 작용 없음)
※ Video-only : 비디오만 포함하는 시간 기반 프레젠테이션(오디오 및 상호 작용 없음)
1.3 적응성
콘텐츠는 정보나 구조의 손실 없이 다른 방법들(예: 보다 간단한 레이아웃)로 표시될 수 있도록 제작되어야 한다.
Level A
1.3.1 Info and Relationships
프레젠테이션(presentation)*을 통해 전달되는 정보/구조/관계는 프로그래밍 방식으로 결정*되거나 텍스트로 이용 가능해야 한다.
이 성공 기준의 목적은 정보와 관계를 보장하는 것이다.
사용자가 보는(인식하는) 콘텐츠의 정보/구조/관계를 다른 방식(정보 추출, 텍스트)으로도 이용 가능해야 한다는 것이다. 예를 들어 데이터 테이블이 있는데, 중요한 정보를 이미지를 넣어 표시하거나, 색깔을 입혀 표시하는 등의 방식은 누군가 이용할 수 없는 정보가 될 것이다.
Level A
1.3.2 Meaningful Sequence
콘텐츠가 표시되는 순서가 의미에 영향을 미치는 경우, 프로그래밍 방식으로 올바른 읽기 순서가 결정되어야 한다.
Level A
1.3.3 Sensory Characteristics
콘텐츠를 이해하고 작동하기 위해 제공된 지시문은 모양/색상/크기/시각적 위치/방향/소리 등과 같은 감각적인 특성에만 전적으로 의존해서는 안 된다. 1.3.1의 예시에서 말하는 것과 같다.
Level AA
1.3.4 Orientation
특정 디스플레이 방향이 필수적*(고정적)일 필요가 없다면, 콘텐츠는 세로/가로 같이 한 방향으로 보거나 작동되도록 제한하지 않는다.
Level AA
1.3.5 Identify Input Purpose
사용자에 관한 정보를 수집하는 각 입력필드의 목적이 아래와 같은 경우 프로그래밍 방식으로 결정되어야 한다.
- 입력 필드가 사용자 인터페이스 구성요소를 위한 입력 목적 절(section)에서 식별 목적으로 사용될 때 : ex) name, nickname, barthday, sex 등 참고
- 콘텐츠가 서식(form) 입력 데이터에 대해 예상되는 의미를 식별할 수 있도록 지원하는 기법을 사용하여 실행될 때
※ 프레젠테이션(Presentation) : 사용자가 인식할 수 있는 형태로 콘텐츠를 렌더링하는 것
※ 프로그래밍 방식으로 결정되는/가능한(programmatically determined) : 개발자가 설정(제공)해주는 데이터로 인해 소프트웨어에 의해 결정되거나 결정 가능한 것. 보조 공학을 포함한 다른 사용자 에이전트가 정보를 추출하여 사용자에게 다른 형식으로 제시할 수 있도록 제공된다.
※ 필수적인(essential) : 해당 사항이 제거된다면, 콘텐츠의 정보 또는 기능이 근본적으로 변경될 수 있고, 정보와 기능이 다른 방식으로는 준수될 수 없는 경우 필수적인 것으로 한다.
1.4 식별 가능
배경으로부터 전경을 분리하는 것을 포함하여, 콘텐츠는 사용자가 더 쉽게 보고 들을 수 있도록 제작되어야 한다.
Level A
1.4.1 Use of color
정보 전달, 동작 표시, 반응 유발 등 시각적 요소를 구별하는 방법으로 색상만 사용해서는 안 된다.(지침 1.3 참고)
Level A
1.4.2 Audio Control
웹 페이지에 있는 어떤 오디오가 3초 이상 자동으로 재생되는 경우, 해당 오디오를 일시정지 또는 중단할 수 있는 메커니즘*이나 오디오 음량을 전체 시스템 음량과는 별도로 제어할 수 있는 메커니즘을 제공해야 한다.
다른 성공 기준의 충족 여부와 관계없이, 웹 페이지에 있는 모든 콘텐츠는 이 성공 기준을 준수해야 한다.(준수 사항 5.2.5 참고)
Level AA
1.4.3 Contrast(Minimum)
아래의 경우를 제외하고, 텍스트와 텍스트 이미지*의 시각적 표현을 위한 명도대비율은 최소한 4.5:1 이상이어야 한다.
- 커다란 텍스트(Large Text) : 최소 18pt 또는 14pt의 볼드체, 또는 중국어, 일본어 및 한국어 글꼴과 같은 크기를 산출하는 글꼴은, 최소한 3:1 이상이어야 한다.
- 부수적인(Incidental) : 비활성 사용자 인터페이스 구성요소의 일부, 순수한 장식, 사용자에게 보이지 않는, 또는 의미 있는 다른 시각적 콘텐츠를 포함하고 있는 그림의 일부인 텍스트 또는 텍스트 이미지에는 어떤 명도대비 요구사항도 없다.
- 로고 타입(Logotypes) : 로고 또는 상표명에 포함된 텍스트에는 어떤 명도대비 요구사항도 없다.
Level AA
1.4.4 Resize text
Level AA
1.4.5 Images of Text
※ 메커니즘(mechanism) : 결과(result) 성취를 위한 과정이나 기법
※ 텍스트 이미지(image of text) : 특정 시각적인 효과를 달성하기 위해 텍스트가 아닌 형식(ex. 이미지)으로 렌더링된 텍스트
🔎 2. 작동 가능(운용의 용이성)
사용자 인터페이스 구성 요소가 작동 가능해야 한다.
🔎 3. 이해 가능(이해의 용이성)
정보 및 사용자 인터페이스 구성 요소의 작동이 이해 가능해야 한다.
🔎 4. 견고성
보조 기술을 포함한 다양한 사용자 에이전트만으로도 컨텐츠에 접근할 수 있어야 한다.
⚠ 5. 준수
준수 요구사항에 대한 설명이다.
