웹을 만들어가는데 있어서 숙지해야할 웹 접근성[프로그램]

프로그램

• 개발에 앞서 반드시 숙지해야 할 사항.

1. 불필요 하거나 과도하게 많은 프레임을 사용하지 않아야 한다.
2. 키보드만으로 모든 콘텐츠를 제어할 수 있어야 한다.
3. 각 서식 제어 요소를 설명하는 레이블을 사용하여야 한다.
4. 키보드만으로도 온라인 서식 입력 및 서식 간 이동이 가능하여야 한다.
5. 스크립트, 애플릿, 플러그인 등 부가 어플리케이션에 의한 콘텐츠는 자체적인 접근성을 지니고 있어야 

• html페이지에 프로그램을 입히면서 올바른 태그를 사용하지 않는 경우

최근 개발된 사이트는 대부분 XHTML 1.0 Transitional 형식 이지만 개발자 대부분은 

그에 맞는 태그 지식이 없음. 최초 만들어진 html 문서와 함께 개발과 연관된 태그 가이드라인 제공 필요.

  - DTD가 XHTML형식일 때에는 닫기와 따옴표를 생략할 수 없음.

    <img> -> <img src="" alt="" /> , <br> -> <br /> , <input> -> <input />

  - 애트리뷰트의 값의 짝들이 항상 완전하게 기술되어야 함.

    <input checked="checked" />

    <option selected=”selected”></option>

    <input type=”text” disabled=”disabled” />

 - 스크립트 삽입 시 type 명시.

    <script type="text/javascript"></script>

    <script type="text/javascript" src="js/common.js"></script>

 - 특수문자는 Entity 코드로 변환.

    & -> &amp;

 - 모든 요소 및 속성은 소문자로 표기.

   <IMG /> -> <img /> , <INPUT TYPE="TEXT" /> -> <input type="text" /> ,

   <SCRIPT> -> <script>

    onChange -> onchange, onClick -> onclick

• 기본적으로 iframe을 사용하지 않는 것을 원칙으로 하며, 부득이하게 iframe을 사용해야 한다면  한 페이지 내에 4개를 넘지 않도록 하며, 반드시 title속성을 명시해야 함

<iframe src="#" title="로그인"></iframe>

  프로그램상 필요한 빈프레임은 title값 역시 비워둔다. title=""

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

• 모든 컨텐츠는 키보드만으로 이용할 수 있어야 함

스크립트 삽입과정에서 onmouseover 이벤트로만 동작이 이루어지기 때문에 키보드로의 접근이 불가능. onfocus도 같이 넣어주어야 함.

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

• 마크업 언어로 구현할 수 있는 기능을 자바스크립트로만 구현하지 말아야 함.

위 그림은 중소기업청 게시판 페이징 부분인데, 마크업 언어로 구현 가능한 링크를 자바스크립트로만 구현하고 있다.

<a href="board_list.jsp?page=2" onclick="javascript:jsPage('2','1','')">2</a> 이런식으로 스크립트를 사용할 수 없을 경우 직접 링크를 통해서 접근이 가능하게 코딩.

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

• 글 작성시 웹 에디터 사용의 따른 문제점

웹 에디터를 사용하는 경우 발생할 수 있는 이슈는 2가지가 있다.

첫 번째, 키보드로만 에디터 기능을 이용할 수 있는가.

두 번째, 자바스크립트를 사용할 수 없는 환경에서도 글을 쓸 수 있는가.

에디터를 사용하면 접근성, 크로스브라우징, 표준등에 문제가 있는 코드를 양산해낼 확률이 높기 때문에 가능하면 에디터를 사용하지 않는 것을 추천.

 

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

• Form은 자바스크립트를 사용하지 못해도 정상적으로 도작해야 함.

form에 action 속성을 사용해야 하며, submit 버튼을 input 요소로 처리해야 하고, form을 submit하는 동작이 전적으로 자바스크립트에 의존하면 안됨.

만약, 자바스크립트를 사용하지 못하는 환경에서 form의 submit이 안된다면 접근성 지표18항목(마크업 언어로 구현할 수 있는 기능을 자바스크립트로만 구현하지 말아야 한다)을 통과할 수 없음.

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

• 인접한 링크는 하나 이상의 공백으로 분리해야 함

<a href="link1.html">링크1</a><a href="link2.html">링크2</a>

위와 같이 인접한 링크는 공백으로 분리해 주세요. 스크린리더가 잘못된 판단을 할 수 있기 때문에 <a href="link1.html">링크1</a> <a href="link2.html">링크2</a> 이런식으로 사이에 공백을 주어야 함.

출처 : : http://raonbnp.blog.me/130126387251

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들

[출처] 웹프로그램에 있어 고려하고 숙지해야할 웹접근성에 대한 간략한 내용입니다.|작성자 즐거운일과 사람들