Что такое DOCTYPE и зачем он нужен
DOCTYPE (Document Type Declaration) — это инструкция для браузера, указывающая, по какому стандарту разметки следует интерпретировать HTML-документ.
Без DOCTYPE браузер переключается в режим совместимости (quirks mode), в котором рендеринг может отличаться от ожидаемого: иначе работают box model, CSS-свойства и JavaScript API.
Виды DOCTYPE
HTML5 (рекомендуется):
Пример
<!DOCTYPE html>
DOCTYPE для устаревших стандартов
HTML 4.01:
<!-- Строгий -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!-- Переходный -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!-- С фреймами -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0:
<!-- Строгий -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- Переходный -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Режимы рендеринга браузера
| Режим | Условие | Поведение |
|---|---|---|
| Standards mode | Корректный DOCTYPE | Рендеринг по спецификации W3C |
| Quirks mode | Нет DOCTYPE или устаревший | Эмуляция поведения старых браузеров |
| Almost standards | Некоторые переходные DOCTYPE | Почти стандартный, но с отличиями в таблицах |
Практический совет
Всегда используйте <!DOCTYPE html> в первой строке документа. Это самый короткий DOCTYPE, и он включает стандартный режим рендеринга во всех современных браузерах.
На собеседовании: скажите, что DOCTYPE нужен для переключения браузера в стандартный режим рендеринга. Для HTML5 это просто
<!DOCTYPE html>. Без него браузер может перейти в quirks mode с непредсказуемым рендерингом.