웹아틀리에 - Web atelier

[HTML] DOCTYPE 선언 - DTD 본문

IT-웹 Front end/HTML

[HTML] DOCTYPE 선언 - DTD

네루펜 2016. 7. 7. 20:22


HTML DTD

HTML DTD(독타입 선언)는 사용하고자 하는 HTML 문서의 종류와 버전을 표시합니다. 독타입에는 몇 가지 종류가 있지만 주로 사용하는것은 다섯 개 정도로 꼽아 볼 수 있겠습니다.
DTD는 W3C에서 정의한 웹표준을 의미하는데요, 선언을 해 주지 않으면 다양한 웹 브라우저들이 제각각의 형태로 렌더링을 하고 맙니다. 그래서 최소한의 격차로 줄이고 표준을 만들기 위해 정의 한 것이죠.
DTD선언이란 것은 크로스 브라우징의 출발점이자 웹표준의 기초 입니다.

독 타입의 종류와 선언

HTML5

<!DOCTYPE html>

가장 최신의 시맨틱한 트렌디의 독타입 문서 입니다. 대부분의 스마트폰들은 지원을 하고있지만 PC사양에서의 구버전 브라우저들은 완전히 지원을 하지는 못합니다. W3C에서 html5를 공식 표준 권고안으로 2014년 10월 28일에 확정 발표했습니다.

HTML5 표준 권고안

HTML 4.01 Strict (엄격모드)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML4.01 Transitional (호환모드)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"

XHTML 1.0 Strict (엄격모드)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1-strict.dtd"

XHTML 1.0 Transitional (호환모드)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"

DTD를 적지 않는 브라우저들은 Quirks Mode 상태(어물쩡한 상태)로 렌더링 되기 때문에 바른 DTD를 적어주는 것이 좋습니다. 크로스 브라우징을 하기 위해서는 꼭 필요한 원칙이죠.

우리나라에서는 DOCTYPE 중에서 XHTML 1.0 Transitional를 가장 많이 사용합니다. 그 이유중에 하나는 IE중에서도 하위 브라우저를 사용하는 곳이 많기 때문입니다. 또 하나는 표준모드는 너무 엄격하여 적용하기가 쉽지 않아 하위 브라우저 호환성을 고려하여 Transitional 모드를 많이 사용합니다.

그렇지만 IE7이상에서 사용할 때는 HTML5를 사용해도 상관이 없습니다.


Quirks Mode(쿼크모드) 렌더링과 DTD

쿼크모드

오래된 구버전의 웹 브라우저를 위해서 웹페이지의 하위 호환성을 유지하기 위해서 엄격히 준수하는 표준모드를 대신해 사용되는 웹 브라우저 기술입니다.

쿼크모드의 발생 원인
  • DOCTYPE 선언이 존재 하지 않거나 잘못 적혀있을 경우, 웹 브라우저는 문서를 쿼크 모드로 해석한다.
  • DOCTYPE 선언 내의 URL이 생략된 경우, 웹 브라우저는 문서를 쿼크 모드로 해석한다.
호환 출력 방식(Quirks Rendering Mode)의 특징
  • 브라우저가 HTML을 읽는데 시간이 더 걸린다.
  • 브라우저가 HTML을 해석하는데 시간이 더 걸린다.
  • 브라우저가 HTML을 출력하는데 시간이 더 걸린다.
  • 브라우저마다 HTML을 각각 다르게 출력한다.
참고사항

HTML5가 표준이 되었지만 아직 IE 웹 브라우저에서는 호환성 보기 헤더(X-UA-Compatible header)가 설정되지 않을 경우, 쿼크모드(Quirksmode)로 변경되는 문제를 가진다.

<meta http-equiv="X-UA-Compatible" content="IE=Edge">


공유하기 링크
Comments