웹 표준(Web Standards) 이란?
웹표준에 대해 설명하기 전에 웹표준은 "웹 접근성 향상을 위한 보편적인 가치"로 통용되고 있습니다.
"웹 접근성" 에 대해 모르시는 분들이라면 우선 알고 가시면 좋을것 같습니다.
웹 접근성(Web Accessibility) 이란?
[1. 접근성 이란?] 웹 접근성을 살펴보기전에 서비스를 제공하는데 있어 접근성이 무엇인지부터 확인해 봐야 합니다. 접근성은 사용자마다 각자 다른 환경과 상황에서 컨텐츠 를 접하거나, 사용
seaplus.tistory.com
[1. 웹표준 이란?]
웹 표준이란 "웹에서 표준적으로 사용되는 기술이나 규칙" 을 의미하는데,
여기서의 표준이란 W3C의 토론을 통해 나온 권고안을 의미하며 이외의 스펙은 비표준 이거나 독자 확장 요소를 의미하기 때문에 구분해서 사용해야 합니다.
비표준 이거나 독자 확장 요소에 대한 대표적인 예로는 인터넷 익스플로러에서 지원했던 marquee 요소와 bgsound 요소, 넷스케이프 네비게이터에서 지원했던 layer 요소 등을 들 수 있습니다.
이러한 요소는 자사 웹 브라우저의 우수성을 홍보할 목적에서 경쟁적으로 지원했던 요소이기 때문에 웹표준 권고안에는 포함되어 있지 않습니다.
과거에는 비표준 요소나 독자확장 요소를 구분하지 않고 웹 사이트를 구축하였기 때문에 오히려 웹 표준을 지원하는 기기나 웹 브라우저에서 제대로 보이지 않는 문제가 발생하기도 하였습니다.
[ 2. 웹표준 의 장점 ]
웹접근성 수준의 향상
웹표준을 준수하는 것만으로도 자연스럽게 웹 접근성이 향상됩니다.
웹 표준을 준수한 웹 사이트는 다양한 웹 브라우저나 새로운 기기에서도 올바르게 표시되기 때문입니다.
검색 친화적인 웹 사이트 구현
meta 요소를 이용한 정확한 문서 정보의 제공과 적절한 제목(heading 요소)의 사용, 의미에 맞는 마크업은 검색 시 결과에 영향을 미칠 수 있는 중요한 정보입니다.
충실하게 작성된 문서 정보만으로도 검색의 효율성을 높일 수 있습니다.
구조와 표현의 분리
테이블(table)을 레이아웃의 용도로 활용하여 사용하던 과거의 방식은 구조와 표현이 뒤섞여 접근 및 사용을 어렵게 하는 원인으로 작용했습니다.
그러나 웹표준 방법론에서 구조는 마크업 언어를 통해 구축하고, 디자인과 같은 표현 정보는 CSS를 이용함으로써 구조와 표현이 분리된 독립적인 구현이 가능하도록 도와줍니다.
손쉬운 유지 보수 및 비용 절감 효과
구조와 표현을 분리하여 제작하면 유지 보수 시 많은 이점을 얻을 수 있습니다.
또 구조와 표현을 분리했을 경우, 소스의 경량화로 인해 서버의 트래픽 비용이 감소하는 부수적인 효과도 얻을 수 있습니다.
호환성 확보
올바른 마크업과 CSS를 이용하여 웹 사이트를 제작하면 사용자의 디바이스 환경 상태에 상관없이 정보전달을 위한 콘텐츠가 적절하게 표시되기 때문에 하위 호환성이나 상위 호환성을 확보할 수 있습니다.
[ 3. 웹표준 을 위한 기술 ]
이처럼 웹표준을 준수하는 일은 웹페이지의 성능과 직결될 수도 있는 중요한 개념 입니다.
웹표준 기술은 크게 HTML, CSS, Script 와 같이 3가지로 나뉘어 있습니다.
구조언어 (X)HTML & XML
HTML 은 웹에서 사용하는 표준 마크업 언어 입니다.
HTML 은 컴퓨터 언어로서는 매우 느슨한 구조로 태그의 운용법이나 오류의 처리 방법 등이 일반적인 컴퓨터 언어보다 매우 관대합니다.
이점은 HTML 사용이 빠르게 확산될수 있게 했지만 점점 복잡해지고 다양해지는 웹 환경에서는 한계가 있었습니다.
XML은 1996년 W3C에서 제안한 것으로, 웹에서 구조화된 문서를 전송할 수 있도록 설계된 표준화된 텍스트 형식입니다.
기존에 사용하던 HTML의 한계를 극복하고 SGML의 복잡함을 해결하는 방안으로 HTML에 담겨져 있는형식적 요소를 완전히 배제하고 순수 데이터 포맷으로 작성되었습니다. 또 HTML과는 달리 태그의 운용 방법이나 오류에 매우 엄격합니다.
HTML5는 HTML의 다음 버전으로, HTML4를 업그레이드한 것입니다. HTML5는 특정 플러그인에 의존하지 않고 콘텐츠를 제공하는 것이 목표입니다.
많은 기업들이 HTML5의 표준화에 힘을 보태고 있고, Firefox, Opera, Safari, Chrome 등 최신의 웹 브라우저에서 기본적으로 HTML5를 지원하고 있으며, 마이크로소프트사 IE9부터 HTML5의 새로윤 요소를 지원하고 있습니다.
가장 최신 표준인 HTML5에서는 기존 div 요소 외에 다양한 구조 요소를 지원하는데, 새로운 구조 요소에는 header, footer, aside, figure, section, article 등이 있습니다.
표현 언어 CSS
CSS에서는 폰트, 색상, 공백, 공간과 그 밖의 문서 표현 등을 자유롭게 지정할 수 있는 기능을 제공합니다. 기존의 HTML은 웹 문서를 다양하게 설계하고 수시로 변경하는 데에 많은 제약이 있었기 때문에 이것을 보완하기 위해 CSS를 만든 것입니다.
CSS는 W3C 표준이므로 CSS를 이용하여 만든 문서는 사용자의 웹 브라우저 환경에 따라 홈페이지가 다르게 나타나지 않고, 어느 환경에서나 제작자가 의도한 대로 표현할 수 있습니다.
동작 및 제어를 위한 DOM & ECMA Script
웹 페이지의 요소를 객체화해서 동작을 제어하는 데 사용하는 웹 표준 기술에는 DOM과 ECMA Script가 있습니다.
DOM(Document Object Model)은 웹 페이지의 구성 체계를 말하는데, 이것은 HTML을 작성하면서 생성되는 요소들의 논리적 규칙입니다.
웹 브라우저는 이 논리적 구성 체계인 DOM을 해석하여 화면을 표현하거나 DOM 을 구성하는 객체 모델을 스크립트 언어로 제어하는 방법으로 동작을 제어 합니다.