DTD(Doctype)
1. 요약
Document Type Definition. 문서의 형식을 지정한다.--> 해당 문서가 어떤 표준(스펙)을 따르는지 지정하는 것을 말한다.
웹 문서의 시작을 알려주는 <html> 보다 먼저 사용하는 것이 '문서 유형'을 지정하는 <!doctype> 태그이다. 문서 유형은 웹 브라우저에서 "이제부터 처리할 문서는 HTML 문서이고 어떤 유형을 사용했으니 그 버전에 맞는 방법으로 해석하라"고 알려주는 것이다.
HTML4에서는 문서 유형을 설정하는 것이 까다로워서 아예 문서 유형을 지정하지 않은 문서도 많았다. 문서 유형을 지정하지 않을 경우에는 브라우저에서 웹 문서를 로딩할 때 관용 모드(quirks mode)로 인식하게 된다.
관용 모드는 아주 오래된 브라우저에서도 볼 수 있도록 하는 유형이기 때문에 웹 표준은 고려되지 않는다. 또한 웹 문서 제작자가 의도한 대로 결과 화면이 나오지 않을 수도 있다.
2. 문법
HTML 3.2
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
엄격모드: HTML4 문법을 정확히 지켜야 하는 문서 유형이다.
HTML 4.01
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
호환모드: 표준 규약의 변형을 어느 정도 허용하는 유형이다.
HTML 4.01 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
프레임세트 모드: 프레임세트란 웹 브라우저 화면을 분할해서 화면마다 다른 웹 문서를 표시하도록 하는 방법이다.
HTML 4.01 Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
HTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
XHTML Basic 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
XHTML Basic 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN">
HTML5
<!DOCTYPE html>
3. 설명
웹 기술의 진보에 따라 HTML도 변화 되는데, 변화에 따라 브라우져가 HTML을 해석하는 방식도 변화가 생겼다.
이를 극복하기 위해서 브라우져에게 해당 HTML이 어떤 표준에 따른 것인지를 알려주는 것을 DTD(Document Type Definition)이라고 한다.
DTD는 문서의 제일 위에 위치한다.
example1. HTML5의 doctype를 적용한 웹페이지.
<!DOCTYPE html>
<html>
<head>
<title>DTD</title>
</head>
<body>
Hello, HTML5!
</body>
</html>
'WebFont-end > HTML5' 카테고리의 다른 글
| [HTML5] 아이프레임과 프레임 (0) | 2014.12.20 |
|---|---|
| [HTML5] <meta> 태그 (0) | 2014.12.20 |
| [HTML5] 이스케이핑 (0) | 2014.12.20 |
| [HTML5] URL (0) | 2014.12.20 |
| [HTML5] HTML5 시멘틱 구조 태그 (0) | 2014.12.20 |