장애가 있는 사람을 포함해 누구나 읽고 이용할 수 있는 웹 콘텐츠 만들기

## 쓰기 전에 읽는 사람이 막힐 수 있는 곳 살피기 초안을 작성하기 전에 누군가가 메시지를 받거나 과제를 완료하지 못하게 할 수 있는 조건을 파악하십시오. 다음과 같은 차이를 고려하십시오. - 언어 유창성과 읽기 능력 - 주제 또는 기술에 대한 친숙도 - 시각, 청각, 인지, 운동 조절 능력 - 기기 크기, 연결 품질, 누락된 미디어 - 사용할 수 있는 시간, 집중력, 스트레스 상상 속의 한 사용자를 기본값으로 간주하지 마십시오. 콘텐츠 설계와 개발 전반에 접근성 점검을 포함하고, 팀이 중대한 장벽을 해결할 수 없을 때는 자격을 갖춘 전문가를 참여시키십시오. ## 쉬운 말로 쓰고 낯선 용어는 설명하기 핵심 요점을 직접적으로 제시하십시오. 필요한 의미는 보존하면서 익숙한 단어, 짧은 문장, 주제가 분명한 단락을 사용하십시오. 익숙하지 않은 과학, 법률 또는 기술 용어는 처음 등장하는 곳에서 정의하십시오. 제품, 서비스 또는 절차 이름은 약어를 도입하기 전에 전체 명칭으로 작성하십시오. 정의가 많이 필요하다면 독자가 주요 설명에서 반복해서 벗어나도록 강요하지 말고 추가 경로로 용어집을 제공하십시오. 관용 표현이나 특정 문화에 의존하는 표현이 일부 독자를 배제하거나 혼란스럽게 할 수 있다면 사용하지 마십시오. 가독성 도구는 진단 신호로 활용하고, 그 결과를 사람이 검토하고 대표 독자가 확인하도록 하십시오. ## 필요한 설명은 설명하는 대상 바로 옆에 두기 필수 설명은 그 설명이 적용되는 진술, 컨트롤 또는 시각 요소 옆에 배치하십시오. 보충 세부 정보가 주요 흐름을 방해한다면 가까운 정의, 명확한 레이블이 있는 링크 또는 도구 설명을 사용하십시오. 읽기 맥락에 맞춰 방법을 선택하십시오. 큰 화면에서 효과적인 참조 방식도 좁은 화면이나 보조 기술 환경에서는 찾거나 해석하기 어려울 수 있습니다. 현재 단계를 이해하는 데 필요한 정보와 독자를 분리하는 참조 방식에 의존하지 마십시오. ## 알기 쉬운 제목으로 나눠 페이지를 훑어보기 쉽게 하기 전체 내용을 읽지 않아도 목적과 핵심 요점을 알 수 있도록 정확한 페이지 제목과 머리말을 사용하십시오. 긴 구절은 짧고 일관된 섹션으로 나누십시오. 관련 단락은 생각이 명확하게 이어지도록 연결하십시오. 이해에 도움이 될 때만 문장 길이를 달리하고, 문장의 길이나 구조가 행동, 조건 또는 결론을 가린다면 문장을 나누십시오. 넓은 화면뿐 아니라 좁은 너비에서도 페이지를 확인하십시오. 훑어보기 쉬운 특성은 데스크톱 간격에 의존해서는 안 되며 반응형 레이아웃의 변화 속에서도 유지되어야 합니다. ## 이미지와 그래프에 대체 텍스트 쓰기 각 이미지, 차트, 아이콘 또는 기타 시각 요소가 정보 제공용인지, 중복인지, 장식용인지 판단하십시오. - 정보 제공용 시각 요소에는 맥락상 필요한 정보를 전달하는 대체 텍스트를 제공하십시오. - 바로 옆에 동등한 텍스트가 이미 있다면 빈 대체 텍스트를 사용하십시오: `alt=""`. - 보조 기술이 무시해야 하는 장식용 시각 요소에는 빈 대체 텍스트를 사용하십시오. - 대체 텍스트를 ‘~의 이미지’와 같은 레이블로 시작하지 마십시오. 보조 기술이 이미 요소의 유형을 식별합니다. 독자에게 눈에 보이는 맥락이 필요할 때는 캡션을 추가하고 캡션 스타일을 일관되게 유지하십시오. 시각 요소를 설명 가까이에 두십시오. 필수 기술 용어나 데이터를 이미지 안에만 넣지 말고 접근 가능한 텍스트 또는 데이터 등가물을 제공하십시오. ## 어디로 가는지 알 수 있는 링크 문구 쓰기 주변 단락 없이 읽어도 의미가 유지되도록 링크 텍스트를 충분히 구체적으로 작성하십시오. 모호한 지시 대신 목적지나 행동을 명시하십시오. 링크가 별도의 형식을 열거나, 다운로드를 시작하거나, 다른 종류의 경험으로 이어질 때 독자에게 알리십시오. 링크 텍스트의 어조를 나머지 콘텐츠와 일관되게 유지하십시오. 적절한 경우 설명적인 페이지 제목, 목차, 교차 링크, 검색 또는 사이트 맵과 같이 넓은 정보 공간을 통과하는 실용적인 경로를 두 가지 이상 제공하십시오. 각 경로에는 뒤에 이어질 내용을 정확히 예측할 수 있는 레이블을 사용해야 합니다. ## 제목·양식·페이지 언어를 보조 기술이 읽을 수 있게 만들기 보조 기술이 시각적으로 제공되는 것과 같은 조직 구조를 제시할 수 있도록 의미론적인 머리말, 레이블, 관계, 지침을 사용하십시오. 양식은 레이블, 요구 사항, 오류, 지침을 프로그램 방식으로 노출해야 합니다. `lang="en"`과 같은 적절한 언어 속성으로 문서의 기본 언어를 선언하고, 언어가 바뀌는 구절을 표시하십시오. 그러면 발음 및 번역 도구가 텍스트를 정확히 해석할 수 있습니다. 시각적 위치, 색상 또는 스타일만으로 구조나 필수 행동을 전달하지 마십시오. ## 동영상과 오디오에 자막과 대본 붙이기 자막을 음성 내용 및 의미 있는 소리와 동기화하십시오. 자막은 단어를 그대로 옮기지 않고 간결하게 작성할 수 있지만 메시지는 보존해야 합니다. 음성으로 말한 내용, 필수 화면 텍스트, 중요한 시각 정보에 대한 설명을 포함한 대본을 제공하십시오. 관련 미디어 가까이에 대본 링크를 배치하십시오. 필수 정보가 시각적으로 나타나며 음성으로는 달리 제공되지 않을 때 음성 해설을 제공하십시오. 키보드 및 보조 기술 사용자가 자막과 재생 컨트롤에 접근할 수 있는 재생기를 사용하십시오. ## 완성된 페이지를 키보드와 실제 독자로 시험하기 완성된 콘텐츠를 여러 경로로 검토하십시오. 1. 제목, 머리말, 링크만 훑어보면서 구조와 목적지가 분명한지 확인하십시오. 2. 키보드와 보조 기술로 탐색하면서 컨트롤, 레이블, 상태, 양식 지침이 의미 있게 안내되는지 확인하십시오. 3. 좁은 화면과 확대된 글자 크기를 사용하여 잘림, 과도한 밀집 또는 잘못된 읽기 순서를 찾으십시오. 4. 이미지, 오디오 또는 비디오를 비활성화하거나 생략하고 필수 정보가 계속 제공되는지 확인하십시오. 5. 대표 독자에게 정보를 찾고 의도한 과제를 완료하도록 요청하십시오. 장벽을 기록하고, 장벽을 일으킨 콘텐츠나 구조를 수정한 뒤, 영향을 받은 점검을 반복하십시오. 도구 점수만으로는 경험이 접근 가능하다는 증거가 되지 않습니다.