홈페이지 운영팁

혹시, 홈페이지 제작이 고민이신가요? A/S와 서비스 품질이 다릅니다.
인천을 대표하는 IT 기업으로써 고객만족과 기업가치의 극대화를 실현합니다.

홈페이지 상담 문의하기
1566-8667

웹접근성에 맞는 디자인을 하려면?

2022-05-16

웹접근성에 맞는 디자인을 하려면?

 

 

[웹접근성에 맞는 디자인을 하려면?]


접근성은 웹 디자인에서 그 어느 때보다 중요한 요소입니다.
웹 표준에 속하는 개념이고, 월드 와이드 웹(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도 사용됩니다.


감사합니다.

주소
인천 남동구 선수촌공원로 5, C동 912호
(구월동, 구월테크노밸리)
대표번호
1566-8667
운영시간
평일 오전 9:30 ~ 오후 6:30

사이트 하단 정보

카카오톡 카카오스토리 블로그 인스타그램 페이스북
  • 상호 : 에이디커뮤니케이션
  • 대표 : 우세진
  • 사업자등록번호 : 130-39-21061
  • 고객센터번호 : 1566-8667
  • 팩스 : 02--6924-8414

  • 소프트웨어 사업자 : B11-43345
  • 이메일 : master@ad-com.kr
  • 주소 : 인천 남동구 선수촌공원로 5, C동 912호(구월동, 구월테크노밸리)