[HTML5] 1장 HTML5를 시작하기 전에...

HTML5에 대한 궁금증 BEST 3

하나, 지금 당장 HTML5를 사용해도 되나요?

결론부터 말하자면, "그렇다" 이다. 하지만 HTML5를 사용할때 몇가지 주의점이 있다. 그것들을 알아보기 위해 이번 장을 준비했다.

둘, 현재 브라우저들은 HTML5를 얼마나 지원하나요?

각각의 브라우저마다 그 지원여부가 다르다. 이를 확인하기 위해서는 http://caniuse.com 을 방문하여 살펴보길 추천한다. 물론 대부분의 디자이너, 개발자들이 관심있어 하는 부분들은 앞다투어 Modern Brower(파이어폭스, 크롬, 오페라, 사파리, IE9이상)에서 지원되고 있으니 미리 경계의 날을 세울 필요는 없다.

셋, HTML5는 사용하기 어렵나요?

HTML5는 기존의 HTML과 XHTML의 장점을 흡수하며 일정한 설계 원칙에 의해 개발되고 있다. 이 원칙들은 HTML5 구현에 충돌이 발생할 경우, 이론적인 순수성보다는 기술명세를, 기술 명세보다는 구현자를, 그리고 구현자보다는 개발자를, 또한 개발자보다는 사용자를 고려하라와 같은 사용 기반 우선권이라는 설계원칙을 적용하기에 기존 버전의 HTML을 알고 있다면 쉽게 배우고 익힐수 있는 언어이다.

폴리필(polyfill)

구형 브라우저에서 새로운 기능을 제공하기 위한 플러그인으로 사용되는 라이브러리들을 폴리필(polyfill)이라고 부른다. 물론, 사이트 제작시에 애초부터 지원되지 않는 브라우저들을 무시하거나 폴리필이 필요치 않은 사이트를 만드는 것이 권장되나 클라이언트의 요구는 그렇지 않을 테니 개발자들은 최후의 수단을 준비해야 한다.

ie7-js

새로 생긴 HTML5 요소들(article, section등)을 IE 6~8에서 지원하길 원할때 사용한다.

http://code.google.com/p/ie7-js/의 최신 버전 IE9.js 버전을 추가하면 된다.

<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->

위 코드를 삽입하면 구버전의 IE에서도 HTML5의 새로운 요소들과 CSS의 다양한 선택자와 속성을 지원할수 있게 된다.

html5shiv

html5shiv도 IE6,7,8에서 HTML5를 사용하고 싶을 때 유용한 javascript 라이브러리이다.

html5shiv는 Modernizr 및 기타 라이브러리에서도 추천하는 폴리필이니 알아두도록 하자.

Modernizr

Modernizr를 사용하여 HTML5의 새로운 요소들을 IE에서 사용하는 것이다.

프로젝트에서 Modernizr의 다른 여러기능과 함께 사용한다면 고려해볼만 하다.

HTML5 등장 배경

책을 뒤적이다가 HTML5의 등장 배경이 잘 정리된 것이 있어 발췌한다. HTML을 시작하는 분들이 읽어 보면 좋을듯 싶다.

HTML3.2가 널리 보급되면서 웹 개발에 엄청난 가속이 붙기 시작합니다. 이에 좀더 발전된 HTML 기술이 요구됨에 따라 HTML4.0이 출현하게 되었습니다. 웹 표준화를 담당하는 W3C에서는 HTML4.0을 발표한 직후, 더 큰 모듈성, 유연성과 성능이 필요하게 되었습니다. 왜냐하면 초기에 HTML 문서는 단순한 정보를 사용자에게 보여주는 것을 목적으로 했지, 엄청나게 많은 문서와 각종 미디어 파일, 그리고 다양한 브라우저에서 사용되리라곤 생각을 하지 못했습니다. 이러한 사용자의 요구에 따라 2000년에 나온 언어가 XHTML 입니다.

XHTML이란 eXtensible Hypertext Markup Language의 약자입니다. HTML을 대체하기 위해서 만들어 졌지만, W3C에서 만든 HTML4.1의 규약에 거의 준한 규격을 가집니다. 이 말은 XHTML이란 문서가 HTML 문서보다 좀 더 명확하고, 구조적인 특징을 가진다는 것을 의미합니다.

XHTML은 기존 HTML4.0보다 호환성과 확장성 면에서 유리합니다. 이 말은 XHTML 문서는 XML 애플리케이션과의 호환성이 좋다는 것을 의미합니다. XML 애플리케이션이라는 말은 프로그래밍 언어로 작성된 프로그램을 말합니다. 이런 프로그래밍 언어는 기계어입니다. 기계가 인식하는 것은 단순한 코드만 인식합니다. 즉 기존 HTML 문서들이 표현을 위해 각종 태그를 이용했다면, 그 표현을 위한 태그는 기계가 인식하지 못합니다. 우리가 시각적인 표현을 위한 태그는 기계가 인식하지 못한다는 말입니다. 시각적인 표현을 위한 글꼴 모양, 색상, 레이아웃등은 태그에서 배제되어야 한다는 것입니다. 기계는 사람과 달라서 이게 왜 필요한지 이해하지 못하기 때문입니다. 그래서 XHTML에서는 이런 호환성을 위해 표현과 구조를 엄격하게 분리하게 된 것입니다.

이렇게 XHTML이 등장하면서 웹 사이트 유지 보수 비용 또한 감소하는 효과를 가져왔습니다. 웹 문서의 표현과 구조가 분리 되었기 때문에 XHTML 이전에 일일이 HTML 문서를 수정했던 것을 CSS 파일만 수정하면 모든 웹 문서에 적용되기 때문입니다. XHTML이 이러한 장점을 가지고 있지만, 2000년에 개발된 언어이고, 그 동안 엄청나게 기술이 발전하고 스마트폰과 같은 더 다양한 기기에서 다양한 구성의 웹페이지를 구현할 필요가 생기게 됩니다.

HTML5는 기존 XHTML에서  HTML 자체에서 처리해주지 못하는 여러 멀티미디어적인 요소, 기존 XHTML 문서보다 더 구조화된 문서 구조등, 다양한 기술적 요구가 나오게 되자 W3C가 아닌 다른 단체(WHATWG)에 의해 먼저 HTML5의 규격이 만들어지고 나중에 W3C에서 수용하게 된 것입니다. 특히  HTML5는 애플 컴퓨터에서 적극적으로 밀고 있는데, 이것은 현재 어도비의 플래시 기술과 마이크로 소프트에서 개발한 실버라이트 그리고 썬의 자바 FX와 같은 비표준화 기술을 대체하기 위함입니다. 현재 아이폰이나 아이패드에서는 플래시가 작동되지 않습니다.

처음부터 다시 배우는 HTML5 & CSS3