전체 글26 웹 접근성 가이드 - 웹 애플리케이션 접근성 준수 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다. 웹 애플리케이션이란 웹 콘텐츠에 포함되어 특정한 기능을 수행하도록 구성된 소프트웨어의 일종으로, 리치 인터넷 애플리케이션(RIA : Rich Internet Application)이라고도 한다. 예를 들면 플래시 같은 것을 말한다. 즉, 웹 애플리케이션을 사용할 수 있도록, 접근 가능하도록 구현해야 한다는 것. 따라서 웹 애플리케이션에 대한 접근성 프로그래밍 인터페이스 사용을 지원한다거나 대체 수단을 제공하거나 보조 기술을 지원해야 한다. 예를 들어, 접근성이 어려운 플래시의 경우 HTML 버전을 선택할 수 있는 대체 수단이나 대체 텍스트를 제공해야 한다. 참고 : www.edwith.org/web-accessibility/lecture/46030 2021. 2. 22. 웹 접근성 가이드 - 마크업 오류 방지 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다. 오류가 없도록 마크업 문서를 구성하면 웹 브라우저나 보조 기술이 작동을 멈추지 않고 콘텐츠를 명확히 전달할 수 있으며, 콘텐츠의 일부 기능이 누락되는 것을 방지할 수 있다. 1. 요소의 열고 닫음 첫 번째 목록 두 번째 목록 세 번째 목록 첫 번째 목록 두 번째 목록 세 번째 목록 요소의 열고 닫음이 일치해야 한다. 현재 예시에서는 ol 태그가 열려만 있고 닫혀 있지는 않아 오류이다. 마크업 언어로 작성된 콘텐츠는 표준에서 특별히 정한 경우를 제외하고는 시작 요소와 끝나는 요소가 정의되어야 한다. img 요소와 같이 단일 태그가 아닌 열고 닫힘이 존재하는 태그의 경우 열고 닫음이 일치해야 한다. 첫 번째 목록 두 번째 목록.. 2021. 2. 22. 웹 접근성 가이드 - 오류 정정 입력 서식 작성 시, 사용자의 실수로 오류가 발생할 경우 이를 정정할 수 있는 방법을 제공해야 합니다. 1. 입력 오류 시 입력 내용이 모두 사라지는 경우 입력 서식 작성 시 오류가 발생하여 입력 내용이 모두 사라지는 경우 오류이며, 작성된 내용이 삭제되지 않고 오류가 있는 부분만 수정할 수 있도록 제공해야 한다. 2. 오류 내용 제공 오류가 발생하는 경우 사용자에게 오류가 발생한 원인을 알려 주어야 한다. 3. 오류 발생 시점으로 초점 이동 오류가 발생한 입력 서식으로 초점이 이동해야 합니다. 참고 : www.edwith.org/web-accessibility/lecture/46027 2021. 2. 22. 웹 접근성 가이드 - 레이블 제공 사용자 입력에는 이와 대응하는 레이블을 제공해야 한다. 레이블이란 모든 사용자 입력의 용도 또는 역할에 대한 설명을 말한다. 옷에도 라벨이 있듯이 입력 서식에도 라벨, 즉, 레이블을 제공해야 한다. 1. 레이블이 시각적으로 노출되어 있는 경우 청각으로 웹을 인식하는 사용자는 입력 서식에 초점이 갔을 때 스크린리더가 "편집창"이라고만 읽어준다. 아이디 입력창도 "편집창", 비밀번호 입력 창도 "편집창"이라고 읽어주기 때문에 무엇을 입력해야 하는지 알 수 없다. 따라서 이에 대한 설명을 제공해야 합니다. 레이블과 입력 서식이 1:1 매칭인 경우 - 레이블을 제공하고 label for 값과 input의 id 값을 동일하게 제공 아이디 비밀번호 이렇게 제공하게 되면 입력 서식 선택 시 초점이 가는 것은 물론이고.. 2021. 2. 22. 웹 접근성 가이드 - 표의 구성 표는 이해하기 쉽게 구성해야 한다. 1. 데이터 표 표의 구성 - 제목 셀과 내용 셀 구분 - 제목과 요약 정보 제공 제목 셀은 th로 내용 셀은 td로 마크업하면 된다. 또한 제목 셀이 가로, 세로로 있는 경우 scope로 행 제목인지 열 제목인지 구분 가능하도록 제공해야 한다. XHTML, HTML4 - caption으로 제목을 제공, table의 summary 속성으로 요약 정보를 제공 직원 관리 현황 표 번호 부서 직원 수 합계 15명 1 총무부 5명 2 인사부 4명 3 기획부 6명 HTML5 - HTML5부터는 summary 속성이 없어졌으므로 caption에 제목과 요약 정보를 모두 제공 * caption 내부에 있는 태그는 시각적으로 제목과 요약 정보를 구분하기 위한 태그로 필수는 아니다. .. 2021. 2. 22. 웹 접근성 가이드 - 콘텐츠의 선형 구조 콘텐츠는 논리적인 순서로 제공해야 한다. 즉, 웹 페이지를 구성하는 모든 콘텐츠는 사용자가 그 내용을 이해할 수 있도록 선형 구조로 작성되어야 한다. 1. 탭 콘텐츠 탭 메뉴가 나열되어 있고 탭에 대한 내용이 있는 경우 시각적으로는 클릭하면 해당 내용이 보이기 때문에 쉽게 인식할 수 있다. 스크린리더 사용자는 메뉴와 내용을 따로 마크업하는 경우 메뉴를 다 읽어주고 나서야 내용을 읽어주기 때문에 어떤 메뉴에 대한 내용인지 인식할 수 없다. 따라서 메뉴 내용 메뉴 내용 순으로 마크업하거나 메뉴끼리 내용끼리 마크업하되 내용에 해당 메뉴 제목을 제공해 주어야 한다. 탭 1제목 > 탭 1내용 > 탭 2제목 > 탭 2내용 상품 상품 내용 쇼핑몰 쇼핑몰 내용 … 해당 탭 콘텐츠에 제목 제공 상품 … 상품 상품 내용 .. 2021. 2. 22. 이전 1 2 3 4 5 다음
