이전에 웹 표준에 대해 다룬적이 있다.
웹 표준은 웹페이지가 형성해야할 기술적인 측면의 수칙이라면 웹 접근성은 굉장히 휴머니즘적인 수칙이다.
바로 장애인(시각,청각,색맹 등) 혹은 글자가 잘 안보이는 노인들, 즉 사회적 약자를 고려한 웹페이지인지를 검사하는것이다.
사실 개인적인 홈페이지나 포트폴리오페이지에서는 웹접근성까지 고려한 웹페이지들은 거의 없다. 굉장히 휴머니즘적인 좋은 취지이지만 모든 접근성 수칙을 지키기엔 디자인적인 제약이 생길 수 있다. 그래서 최소한의 접근성을 고려해보자면 대표적으로
<img src="경로" alt="이미지에 대한 설명">
<a href="경로" target="_black" title="바로가기 버튼">바로가기</a>
대체 텍스트가 있다.
태그가 가지고 있는 기능, 혹은 의미를 제목으로 넣어주는것이다. 이렇게 하면 스크린리더기를 사용하여 듣는 시각장애인들도 이용할 수 있게 된다.
두번째로, 포커스이동이 있다. tap키를 이용해 모든 기능적인 태그들을 이동할 수 있게 설정해주는 것이다. 마우스로 정교한 작업이 힘든 손 운동 장애인들을 고려할 수 있다.
세번째로, 동영상을 넣을 경우 자막을 넣어준다. 청각장애인들을 고려한 것이다.
웹 접근성 품질 마크를 받기 위해서는 철저한 웹 접근성에 대한 지식과 수칙들을 지켜내야한다. 그래서 사실 이 마크는 주로 공기업홈페이지나 글로벌기업 사이트에서나 볼 수 있긴 하다.
웹 접근성 체크리스트
https://nuli.navercorp.com/sharing/a11y/checklist
웹 접근성을 체크해 볼 수 있는 사이트로 '널리' 가 있다. 네이버에서 제공하는 웹 양식 및 정보 공유 사이트인데, 웹 접근성에 대한 정보도 제공하고 아무래도 IT 대표기업이다 보니 참고할 사항들이 많다.
'HTML' 카테고리의 다른 글
iframe으로 동영상 넣기 (0) | 2020.07.08 |
---|---|
[HTML Tag] 리스트를 위한 태그들 (ol,ul,li,dt,dd,dl) (0) | 2020.03.03 |
[HTML Tag] <a> 태그와 mailto (0) | 2020.03.03 |
웹페이지를 만들기 위한 기본 packaging과 포토샵 이미지 저장하기 (0) | 2020.03.03 |
[HTML Tag] <p>태그와 <pre>태그의 차이점 (0) | 2020.03.03 |