🟩 DOCTYPE(Document Type): 문서 타입 정의
웹 문서가 어떠한 형식으로 작성되었는지 HTML 최상단에 문서의 형식을 선언하는 것
DOCTYPE을 선언하지 않으면 같은 내용의 HTML 문서라 할지라도, 각 브라우저의 환경에 따라 전혀 다른 결과물을 출력할 수 있습니다.
선언된 페이지의 HTML 버전이 무엇인지를 웹 브라우저에 알려주는 역할로써 사용하며,
모든 브라우저가 HTML 문서를 동일하게 인식할 수 있고, 문서 간 호환성을 높이게 됩니다.
DOCTYPE은 HTML 문서에서 태그를 정의하기 전에 가장 먼저 선언되야 하며, 아래 코드에서 <!DOCTYPE html>이 바로 그 필수 서문 부분입니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
...생략...
</head>
<body>
...생략...
</body>
</html>🟣 DOCTYPE 종류
HTML 버전 별로 strict(엄격한 타입), transitional(유연한 타입), framset(프레임셋 타입) 3가지로 구분되나,
HTML 4.01 버전 이하로는 더이상 사용하지 않으니 HTML4.01~5 버전 까지만 알고 있으면 됩니다.(사실상 5버전까지)
| 버전 | 형식 | DTD(Document Type Declaration)구문 |
|---|---|---|
| HTML4.01 | strict | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
| transitional | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> | |
| frameset | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> | |
| HTML5 | 구분없음 | <!DOCTYPE html> |
HTML 4.01에서는 DOCTYPE을 세 가지 방법으로 선언할 수 있었습니다.
- strict - 모든 HTML 요소와 속성들을 포함하고 있지만, 더 이상 사용되지 않거나 아직 정식으로 포함되지 못한 요소들은 포함하고 있지 않습니다.
- transitional - 모든 HTML 요소와 속성들뿐만 아니라 더 이상 사용되지 않거나 아직 정식으로 포함되지 못한 요소들까지도 포함하고 있습니다. 하지만 프레임셋(frameset) 콘텐츠의 사용은 허용하지 않습니다.
- frameset - 모든 HTML 요소와 속성들, 더 이상 사용되지 않거나 아직 정식으로 포함되지 못한 요소들까지도 모두 포함하며, 프레임셋(frameset) 콘텐츠의 사용까지 허용합니다.
HTML 4.01에서 DOCTYPE 선언은 SGML을 기반으로 하기 때문에 DTD(Document Type Declaration)를 참조해야 합니다. DTD는 브라우저가 콘텐츠를 정확하게 표현하도록 마크업 언어에 대한 규칙을 명시합니다.
하지만 HTML5는 SGML을 기반으로 하지 않기 때문에 DTD를 참조할 필요가 없습니다.
☝🏻 SGML?
문서용 마크업 언어를 정의하기 위한 메타 언어다.
- SGML
가장 먼저 나온 마크업 언어. 특정 문서를 정의하는데 필요한 태그를 임의로 생성해 문서 구조를 정의. 너무 복잡해서 활용하기 어렵고 이를 지원하는 소프트웨어를 개발하기가 어렵다.
- HTML
웹 브라우저에서 웹 문서가 보여질 형식을 표현. 단순성, 사용의 용이성이 좋다.단, HTML 태그는 문자의 크기나 색깔 등 표현 방식에만 치중하고 문서의 구조 정보를 표현하기가 어렵다.
- 근본적으로 HTML의 태그는 고정
- 사용자가 자신의 태그를 추가할 수 없다.
- 또한 HTML의 태그는 웹 브라우저에서 내용이 어떻게 보여질 것인가를 지정하기 위한 태그
- 즉 내용의 의미는 HTML에게는 전혀 고려대상이 아니다.
- XML
SGML의 하위셋. 디자인에만 제한된 HTML과 달리 홈페이지 구축 기능, 검색 기능 등이 향상되었고 클라이언트 시스템의 복잡한 데이터 처리를 쉽게 한다. 단 HTML처럼 데이터를 보여주는 목적보다는 데이터를 저장하고 전달하는 목적으로만 만들어졌다.
- HTML과 같은 마크업 언어를 생성하기 위해 태그 집합을 정의하고 태그들 간의 관계를 설정할 수 있도록 지원하는 언어
- 실제로 HTML은 SGML을 이용해 정의되어으며, XML을 이용해 HTML을 정의하는 것도 충분히 가능
- 태그를 사용자가 정의할 수 있으며, 이를 통해 자료의 성격과 속성을 구분할 수 있고, 이러한 정보를 통해 추가적인 처리가 가능
🎁 참고
다 하자