고객센터
에이디커뮤니케이션에서는 빠른 유지보수, 트렌드 적용, 안정적인 웹호스팅 등
고객사 이슈반영에 신속하고 친절히 대응해드립니다.
웹접근성에 맞는 디자인을 하려면?
- 날짜
- 2022-05-16
- 조회
- 317
[웹접근성에 맞는 디자인을 하려면?]
접근성은 웹 디자인에서 그 어느 때보다 중요한 요소입니다.
웹 표준에 속하는 개념이고, 월드 와이드 웹(www)의 창시자 버너스-리의 웹 평등성이란 철학에서 시작되었습니다.
웹접근성 영역까지 섬세히 신경쓸 때 더 진정성있고 완성도 높은 디자인/개발이 나오지 않을까 싶습니다.
오늘은 '웹접근성에 맞는 디자인'에 대해 이야기해 보겠습니다.
- 웹접근성
웹접근성(Web Accessibility)이란 장애를 가진 사람과 그렇지 않은 사람이 모두 동일하게 콘텐츠를 볼 수 있도록 하는 것을 의미합니다.
- 단계
웹접근성은 3단계로 나뉘는데 A등급은 웹접근성을 반드시 지켜야 하는 최소한의 단계이고
AA등급은 최소한의 단계를 넘어 그보다 더 높은 접근성을 갖춘 수준의 단계입니다.
마지막으로 AAA등급은 웹접근성을 최상으로 극대화하며 장애를 가진 사용자가 불편함 없이
편안하게 홈페이지를 사용할 수 있도록 하는 단계인데 대부분의 홈페이지는 AA등급으로 구축합니다.
- 디자인
(명도대비 확인 출처 : webaim.org)
웹접근성에 맞는 디자인을 하려면 색의 대비를 잘 지켜야 합니다.
텍스트와 같은 경우는 배경과의 명도대비를 4.5 : 1로 지켜주어야 합니다.
(텍스트:배경=화이트:화이트=1:1 / 텍스트:배경=화이트:블랙=21:1)
주요 콘텐츠의 명도대비는 4.5 : 1로 지키고, 보조 콘텐츠의 명도대비는 3 : 1정도까지 허용이 가능합니다.
또한 나머지 콘텐츠의 명도대비는 미적으로 설정하며 명도대비를 크게 맞추지 않아도 괜찮습니다.
이것은 AA웹접근성을 지키는 기준입니다.
- 테이블
테이블 헤더는 항상 <th />요소로 지정하고 눈에 띄는지 확인해야 합니다.
필요시 scope 특성을 활용해 행 또는 열의 헤더를 지정합니다.
시각 장애가 있는 사용자를 위해 표와 함께 대체 텍스트를 활용합니다.
테이블 요약에 <caption />이 선호되지만, <table /> summary도 사용됩니다.
감사합니다.
안내&새소식
- 에이디커뮤니케이션
- 대표 : 우세진
- 사업자등록번호 : 130-39-21081
- 고객센터번호 : 1566-8667
- 팩스 : 02-6924-8414
- 소프트웨어 사업자 : B11-43345
- 통신판매신고번호 : 2010-인천남동-0403
- 이메일 : master@ad-com.kr
- 주소 : 인천 남동구 선수촌공원로 5, C동 912호(구월동, 구월테크노밸리)
Copyright ⓒ AD COMMUNICATION. All Rights Reserved.
견적
빠른견적신청
