들어가며
html 문서를 작성하다보면, 또 우리가 이용하는 웹 사이트들을 개발자 도구를 통하여 확인해보면 <!DOCTYPE>이 문서 최상단에 작성되어 있는 것을 볼 수 있습니다.

저는 해당 <!DOCTYPE>의 존재를 학부생 1학년 시절, VSCode의 html 문서 자동완성 기능을 통하여 처음 접하게 되었던 기억이 있습니다. 그때에도 크게 <!DOCTYPE>이 정확히 무엇인지 짚고 넘어가지 않았던 것으로 기억합니다.
HTML Doctype이란?
Doctype은 선언문 이름 그대로 문서(document)가 어떤 버전을 기반으로 작성(type) 되었는지를 알려주는 역할을 수행합니다. <!DOCTYPE>은 문서의 최상단에 위치하여 브라우저가 HTML 문서를 해석하고 렌더링하는 방식을 결정하게 됩니다. 대소문자를 구별하지 않지만 관습상, 강조를 위하여 전체를 대문자로 표기하는 경우가 많습니다.
HTML5를 사용한 뒤부터는 <!DOCTYPE html>라고 간단한 선언문을 작성해주면 HTML 5에 맞추어 문서를 해석하고 렌더링해줍니다.
HTML5 사용 이전에는 다양한 html 버전이 존재하여씨 때문에 Doctype 선언 단계에서 아래와 같이 복잡한 방법으로 선언을 해주었어야 한다고 합니다.

그렇다면 Doctype을 선언하지 않아도 괜찮을까?
결론부터 말하자면 Doctype은 꼭 필수적으로 선언해주어야 합니다. 브라우저는 문서상 Doctype이 없다면 문서를 쿼크 모드(quirks mode)로 렌더링할 수 있다고 합니다. 쿼크 모드는 오래된 웹 사이트와의 호환성을 유지하기 위하여 표준과 다른 방식으로 동작하기에 기대 동작과 다르게 동작할 수 있다는 위험이 있습니다.
'Web' 카테고리의 다른 글
| [HTML] async, defer 스크립트에 대하여 알아보자 (feat. next/script) (0) | 2025.02.11 |
|---|---|
| [Github Action] 공짜로 Github Organization 저장소 vercel 배포하기 (4) | 2024.12.05 |
| [Pattern] Ealry return pattern에 대하여 알아보자 (3) | 2024.12.04 |
| [UX/UI] '마지막으로 로그인한 소셜 계정' 어떻게 관리하는 것일까? (0) | 2024.12.03 |
| [Webview] foreground, background 전환 감지하기 (2) | 2024.12.02 |