세인드의 블로그


이 글을 읽기 전에 웹표준에 대해서 찾아보고, 생각해보는 시간을 가졌으면 좋겠습니다.
많은 사람들이 웹표준이 무엇인지, 웹표준을 지켜서 자신에게 돌아올 이득이 무엇인지, 왜 웹표준을 지켜야하는지를 모르고 있습니다.
웹표준을 한마디로 말하자면 "의미가 있는 태그는 그 의미에 맞게 사용하라" 입니다.

예를들어, <HTML>태그를 생각해봅시다. 많은 사람들은 HTML을 "웹페이지를 제작하기 위한 언어"라고 생각합니다.
하지만, 그 생각은 반은 맞고 반은 틀린겁니다. HTML은 HyperText Markup Language의 약자입니다. 일단 HyperText의 의미만 생각해봅시다.
HyperText는 "문서와 문서를 링크를 통해 연결시켜준다"라는 의미를 내포하고 있습니다. 즉, 현재 보고있는 이 문서는 링크를 통해 수 많은 문서와 연결된 상태라는 뜻입니다.

그렇다면 MarkUp Language는 어떤 의미를 가질까요?

위키백과에는 다음과 같이 Markup Language를 정의하고 있습니다.

마크업 언어(markup, markup language)는 태그 등을 이용하여 데이터의 구조를 명기하는 언어의 한 가지이다.

즉, HTMarkupLanguage는 구조정의하는 언어입니다.
그래서!! HTML에서는 <b>, <i>, <font>등과같은 표현(디자인)을 정의하는 태그들은 사라졌습니다.

<B>    : Bold의 의미로 글자를 굵게해! 라는 표현을 의미합니다.
<i>     : Italic의 의미로 글자를 이텔릭체로 만들어줘!, 글자를 기울여! 라는 표현을 의미합니다.
<font> : 는 글자를 꾸며줘! 라는 표현을 의미합니다.

대신, 다음과 같은 태그가 생겨났습니다.
<em> = emphasis (강조) :: 대부분의 브라우저에서는 italic(이텔릭체)로 표현됩니다.
<strong> = stronger emphasis (강한 강조) :: 대부분의 브라우저에서는 굵게(Bold)로 표현됩니다.

물론, 대부분의 브라우저는 <b>태그와 <i>태그의 사용을 허용해줍니다. 그렇지만, 구조를 정의하는 HTML에서 표현을 나타낸다는 이유로 웹표준에는 적합하지 않습니다. 또한, 시각장애인을 위한 스크린리더기가 <b>태그와 <i>태그를 제대로 인식하지 못합니다.
그렇다면, 우리는 어떻게 HTML문서를 꾸밀까요? 우리가 만드는 HTML문서는 전혀 디자인할 수 없는걸까요?
아닙니다. 우리는 HTML문서를 보다 더 보기좋게 꾸미기 위해 CSS라는 표현을 정의하는 언어를 사용할 수 있습니다.
CSS에 대해서는 좀 나중에 알아가도록 하죠^^.



이쯤되면.. 슬슬 의문을 갖는 사람이 생길겁니다.
"뭐하러 구조와 표현을 분리하냔 말이야!! 그리고, 대체 웹 표준을 지켜서 얻는 이득이 뭐지??"
구조표현을 분리시키고, 웹표준을 지키면 우리에게 돌아오는 이득은 많습니다.

  1. 다양한 브라우저에서 작동됩니다.
    • 모든 브라우저는 웹표준 방식을 기준으로 설계되어있습니다. 보통 익스플로어에서만 보여졌던 페이지들도 웹표준을 지키면 모든 브라우저에서 보여지게 됩니다.
    • 휴대폰, PDA등 컴퓨터가 아닌 단말장치에서도 문제없이 보여집니다.
    • 모든 브라우저와 단말장치에서 동일한 형태의 페이지가 보여집니다.
  2. 페이지 로드속도가 빨라집니다.
    • HTML파일과 CSS파일을 완전히 분리하면서 한번의 CSS파일로드로 페이지의 모든 디자인요소가 완성됩니다.
    • 브라우저가 이해하기 쉽도록 구조화 되어있어서 쓸대없는 호출을 줄입니다.
  3. 유지/보수가 쉬워집니다.
    • 수 많은 HTML파일을 수정할필요 없이 하나의 CSS파일을 수정하여 모든 페이지의 디자인과 레이아웃을 바꿀 수 있습니다.
    • 코드가 간결하게 정리되어 사용자가 알아보기 쉽고, 문제점을 신속하게 찾아낼 수 있습니다.
  4. 통일성이 생깁니다.
    • 하나의 CSS파일을 모든 페이지에 적용시키므로, 많은 색을 사용하지 않고 통일성있는 페이지를 꾸밀 수 있습니다.
  5. 장애를 가진 사람도 쉽게 컨텐츠를 이용할 수 있습니다.
    • 색상이나 글씨체같은 모든 디자인요소를 배제할 수 있습니다.
    • 모든 이미지파일은 음성으로 설명이 가능해집니다.
  6. 검색엔진 노출이 잘 됩니다.


모든 사람들이 왜 웹표준을 지켜야하는지, 그로인해 얻는 이득은 무엇인지를 알았으면 합니다.
다음에는 XHTML을 알아보기 전에 HTML의 기본 구조에 대해서 알아보도록 하겠습니다. : )
( 사실상 XHTML과 HTML은 거의 동일하지만 말이죠.....; )