DOCTYPE чем-то похож на заголовок для статьи. Он пишется в начале HTML-документа. Если его не будет, то браузер может отобразить вашу страницу в неожиданном виде. Читайте о том, из чего состоит DOCTYPE, и как его использовать правильно.

🚀 Сегодня вам бесплатно доступен тренажёр по HTML и CSS.

Определение и значение

Если вы хоть раз работали с HTML-файлом, то наверняка видели в начале страницы ключевое слово DOCTYPE. Если разобрать его по частям, то получается DOC (сокращение от слова document) + TYPE (с английского «тип»). Ключевое слово DOCTYPE в файле HTML — это декларация типа документа. Так браузер узнает, на каком языке и с какими технологиями он был создан. Если не укажете DOCTYPE, то ваша страница может отображаться некорректно.

История

Из истории HTML мы знаем, что спецификация менялась с момента первой публикации в 1992-м году и до наших дней. Вместе с ней, соответственно, менялись и типы документов. Актуальная версия HTML сейчас — это HTML Living Standard. Начиная с версии 4.0 многие элементы стали устаревшими (их рекомендовали не использовать на страницах) — стандарт очистился.

Типы синтаксиса в DOCTYPE

Синтаксис HTML-документа бывает:

  • свободным — переходный (transitional);
  • строгим — strict. По его правилам парные теги обязательно надо закрывать, атрибуты «заворачивать» в кавычки, нельзя пользоваться устаревшими тегами;
  • «рамочным» — frameset. Когда используются фреймы.

Сравниваем DOCTYPE для HTML 1.0 и HTML 4.01 на примерах

Переходный синтаксис

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

Есть все элементы и атрибуты HTML. С устаревшими и презентационными. Фреймов нет. А разметка должна быть сделана как качественно созданный XML.

4.01:

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

Тут есть все элементы и атрибуты HTML, в том числе устаревший тег шрифта. А также новые. Фреймов нет.

Строгий синтаксис

1.0:

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

В этом уже нет устаревших и презентационных элементов. Всё ещё нет фреймов. От разметки ждут вида хорошо сформированного XML.

4.01:

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

Есть все элементы и атрибуты без устаревших. Фреймов нет.

Фреймы

  • 1.0:

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

    Здесь определение типа документа как у переходного с XHTML 1.0, но можно пользоваться содержимым фреймов.

  • 4.01:

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

    Тут DTD как у переходного HTML 4.01 переходный, но тоже есть фреймы. Сейчас применяется редко, потому что фреймы устарели.

Формула с расшифровкой параметров (элементов)

<!DOCTYPE [Элемент верхнего уровня][Публичность]"[Регистрация]//[Организация]//[Тип] [Имя]//[Язык]" «[URL]» >, где

  • [Элемент верхнего уровня] — корневой элемент на веб-странице, часто html/HTML;
  • [Публичность] — этот параметр для файла может принимать два значения: PUBLIC (публичный) и SYSTEM (локальный);
  • [Регистрация] — указывает на наличие регистрации у разработчика DTD внутри ISO (международная организация). Может быть + или .
  • [Организация] — название организации стандартизации (W3C);
  • [Тип] — определение типа страницы, например DTD;
  • [Имя] — имя документа;
  • [Язык] — язык описания объектов (по умолчанию английский EN);
  • [URL] — адрес страницы, на которой находится описание для указанного типа документа. Из этой спецификации браузер узнает, как отображать страницу с допустимыми тегами.

И что теперь?

Время проходит, мы во многом стараемся двигаться к упрощению и унификации. В HTML5 декларация типа документа выглядит очень просто:

<!DOCTYPE html>

DOCTYPE для него самый простой из существовавших.

Что происходит, если указать DOCTYPE неправильно или не указывать его вообще

Браузеры покажут страницу по совместимости со своими старыми версиями.

Формально регистр тут значения не имеет. Но корректнее всё же писать заглавными буквами. Потому что в XHTML5 есть разница между именами элементов, написанными в нижнем регистре и ключевыми словами, которые пишут в верхнем регистре.

<!DOCTYPE html> — запомнить слишком просто.

Напоминалка на дорожку

  • DOCTYPE — инструкция, которая ассоциирует веб-страницу с типом документа (DTD).
  • Document Type Definition — это близко к DOCTYPE, но не путайте.
  • Пример: формальное определение частной версии HTML 2.0 — 4.0.

Простыми словами, прописывая DOCTYPE, мы говорим браузерам/валидаторам, каким языком разметки мы писали свой документ. Вы помните, что кроме простого HTML бывает XHTML и XML. Кроме этого мы можем указать и степень строгости синтаксиса.