웹 접근성 향상을 위한 전략 : 웹표준

웹 접근성 향상을 위한 전략 : 웹표준

방법론 : 웹표준 준수

- 웹에서 표준적으로 사용되는 기술이나 규칙

- W3C와 같은 웹표준 기구에서 정리한 규칙

1. W3C(World Wide Web Consortium)란?

- 1994년 만들어진 국제적인 비영리 웹 기술 표준 기구

- W3C 공식 사이트(http://www.w3.org)에서 웹 기술의 공식적인 기술명세서 확인 가능

- WD > CR > PR > REC의 순서로 표준 확정

1) Working Draft (WD:초안)

2) Candidate Recommendation (CR:권고안후보)

3) Proposed Recommendation (PR:제안권고안)

4) Recommendation (REC:표준화)

2. 웹 표준 관련 기술

웹의 기술적 요소

- W3C(World Wide Web Consortium)가 문법 제정, 권고

- 사용자측 기술 : HTML, CSS, JAVASCRIPT, ...

- 서버측 기술 : JSP, PHP, ASP, DB,..

- HTML(구조) + CSS(표현) + Javascript(동작)

3. 구조 언어

1) 구조 언어(마크업 언어)란?

- 콘텐츠의 가독성을 높이고 컴퓨터에게 구조를 이해시킴

- 화면에는 나타나지 않는 태그를 사용하여 콘텐츠가 갖는 특성을 정의

- 한 문서의 문자열을 웹 상의 다른 문서에 연결해 주는 하이퍼텍스트 기술을 사용한 무료 공개 표준

- HTML, XHTML, HTML5 등

2) HTML (HyperText Markup Language)

- SGML(Standard Generalized Markup Language)기반의 마크업 언어

- 느슨한 규칙

- HTML 4.01 : SGML 기반. 스탠다드.

3) XHTML (eXtensible Hypertext Markup Language)

- HTML을 XML(Extensible Markup Language)로 재구성한 마크업 언어

- 기계적 처리에 용이한 규격화된 구조

- XHTML 2.0 : xml로 재구성 마크업. 기계적 처리에 용이.

4) HTML5

- HTML5 : 자바스크립트 API 프로그램 포함

4. 표현 언어

CSS(Cascading Style Sheet)는 HTML 3.2부터 지원하기 시작

- 1996년 CSS1 Recommendation

- 1998년 CSS2 Recommendation

- 2011년 CSS2.1 Recommendation

- 2011년 CSS3 Recommendation

5. 동작 및 제어 언어

1) DOM(Document Object Model)

- W3C 권고안

- 웹문서의 각 요소들을 객체화해서 활용할 수 있도록 하는 방법

2) ECMA Script (에크마 스크랩트 ECAM 표준)    

모든 플랫폼, 개발언어에서 적용되는 스크립트의 표준안

6. 구조와 표현과 동작의 분리

- 제약이 있는 경우에도 기본 정보는 제공 가능

- 유지보수가 쉬움

- 파일 사이즈를 줄일 수 있음

- 웹 접근성 향상

- CSS ZEN GARDEN (http://www.csszengarden.com/)

www.csszengarden.com

- 동일한 구조의 HTML이 CSS에 따라 어떻게 바뀔 수 있는지 보여주는 사이트.

- 오른쪽 메뉴에 보이는 다양한 사람이 만든 다양한 스킨을 눌러 css의 변화를 확인해보자.

- 구글 크롬에서 요소검사(F12) 후 elements에서 마우스 오른쪽 edit attribute로 요소를 수정하여 수정한 화면 확인 가능.

- css를 로딩하는 <link rel="stylesheet" media="screen" href="/196/196.css?v=8may2013">에서 숫자만 변경해본다던지 하는 테스트를 해보자.

7. 웹 표준의 장점

- 웹 접근성 수준의 향상

- 검색로봇에 친화적인 웹사이트 구현

- 구조와 표현의 분리

- 비용 절감 효과

- 손쉬운 유지 보수

- 파일 사이즈 축소

- 하위, 상위 호환성 확보

8. 다양한 웹 브라우저

인터넷 익스플로러(Internet Explorer) : Window 운영체제의 기본 브라우저

사파리(safari) : Mac 운영체제의 기본 브라우저

파이어폭스(firefox) : 여러 운영체제에서 무료로 사용할 수 있는 브라우저 https://www.mozilla.org/ko/firefox/new/

구글 크롬(chrome) : 구글에서 만든 무료 브라우저 https://www.google.com/chrome/browser/desktop/index.html

오페라(opera) : 여러 운영체제에서 무료로 사용할 수 있는 브라우저

컹커러(conqueror) : 파일관리자 기능을 담고 있는 무료 브라우저