웹접근성의 잘못된 예와 올바른방법

웹접근성은 장애를 가진 사람도 정보에 접근할 수 있도록 제작되는 것을 말하는데 장애인 뿐만아니고 모든 사람들이 정보를 제공받는데 있어서 불편없이 편리하게 사용될 수 있도록 제작되는 개념입니다.

The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect

검색창에서 웹접근성 연구소를 검색하고 웹 접근성 연구소 사이트로 들어가면

여기서 웹접근성에 대한 자세한 사항을 확인 할 수 있습니다.

웹콘텐츠 제작기법에 보면 지켜야 할것들이

인식의 용이성, 운용의 용이성, 이해의 용이성, 견고성

이렇게 4가지로 구분 되어있습니다.

먼저 잘못된 사례를 보면 img를 넣으면서 alt를 붙이지 않은 경우 입니다.

위와 같이 이미지를 넣을 때는 alt를 꼭 넣어줘서

시각 장애인들도 어떤 이미지가 있는지 알 수 있도록 편의를 제공해줘야 합니다.

다음 이미지는 내용이 많은데 이 경우에도 충분히 대체텍스트를 넣어줘야 합니다.

키보드 사용만으로도 홈페이지 조작이 가능하도록

제작되어야 합니다.

<span><img src="" alt="왼쪽" onclick="this.src='';" /></span> 
<span><img src="" alt="오른쪽" onclick="this.src='';" /></span>

-> 이런식으로 변경해 줍니다.

<button type="button" class="prev" onclick="prev();">이전 내용</button> 
<button type="button" class="next" onclick="next();">다음 내용</button>

키보드 탭을 이용해 이동시에

순서대로 이동하도록 작업되어야 합니다.

예전에 정말 많이 썼던 onfocus="this.blur();"

반드시 없어져야 하는 코드라고 되어있네요 ㅎㅎ 

이 코드로 인해서 초점이 안보이기 때문에 시각장애인들이 위치에 대해서 혼란스러워질 수 있다고합니다.

주로 사용하는 언어가 명시되어야 합니다.

동일 id값을 한페이지에 쓰면 안됩니다.