Каким тегом указывается режим документа согласно которому браузер отобразит его

Обновлено: 04.07.2024

Только представьте: вы создаете страницу сайта, все делаете по правилам, однако ваш браузер некорректно отображает всю ту информацию, которую вы разместили на вашей странице. С чем это может быть связано?

Некорректное отображение данных, представленных на веб-странице, обуславливается в первую очередь тем, что браузер неправильно определяет тип документа, размещенного на странице – DTD .

В свою очередь это может быть вызвано только тем, что вы использовали неверный заголовок для кода. Для правильного определения типа DTD сегодня существует специальный тег под названием Doctype .

Не лишним будет упомянуть о том, что данный тег имеет достаточно долгую историю. Он был разработан в то время, когда создали Internet Explorer 5 для MacOS и столкнулись с определенными трудностями чтения некоторых страниц.

Дело в том, что новая (по тем временам) версия браузера превзошла все ожидания и просто перестала отображать старые страницы сайтов надлежащим образом. И поэтому, старые страницы, не имевшие в коде на тот момент данного тега, были оснащены Doctype , стоящим перед элементом html .

Почему необходимо указывать именно Doctype?

Как уже было сказано выше, данный тег вставляют в код любого веб-документа для правильного определения его типа. Указание типа документа требуется в первую очередь потому, что сегодня существует сразу несколько версий HTML документов, написанных на разных языках. В том числе существует и расширенная версия – XHTML.

Пример тега Doctype:

Разновидности тега Doctype

Сегодня существует несколько вариантов данного тега, которые используется для разных версий веб-документов:

Переходные версии Doctype HTML 4.01.
HTML5 Doctype выглядит таким образом . Этот тег подходит для любых документов.

Что произойдет, если использовать старые версии тега Doctype?

Значение тега Doctype очень важно, так как именно он позволяет работать всем веб-страницам в соответствии с указанным стандартом.

В том случае, если вы будете использовать неполную версию тега, некорректно его вставите или же не будете использовать его в коде и вовсе, то ваш браузер автоматически перейдет в « загадочный » режим.

Отображение документа в данном случае будет происходить таким образом, будто вы вольно отступали от стандартов.

На сегодняшний день только браузер Opera старается отображать страницы таким образом, как если бы они соответствовали всем стандартам, независимо от того, был ли использован тег Doctype или же нет.

Однако, стоит отметить, что данный браузер пока не полностью поддерживает все стандарты W3C DOM , но работы над этим уже ведутся.

Где можно взять качественный тег Doctype?

Здесь вы можете взять DOCTYPE HTML PUBLIC , который потребуется для определения веб-документов типа HTML 4.01 , а также Doctype HTML 5 и многие другие типы тегов, необходимые для создания страниц, соответствующих стандартам.

Решил проводить регулярные лекции и практические занятия со своими сотрудниками по программированию на PHP, MySQL, Javascript. А также другим технологиям необходимым для выпуска качественных сайтов. Начать решил с самого «верха», с HTML тэгов. Буду рад, любым комментариям :)
Сразу оговорюсь, что бОльшая часть информации я нашел в интернете, внизу статьи будут приведены ссылки на источники. Часть информации была переведена совместно с google translate.
Итак:

Почему так важен DOCTYPE

Вроде бы вы сделали все правильно, но ваш сайт почему-то не выглядит или не работает, как ожидалось, в последних версиях броузеров.
Вы написали правильный стандартный XHTML код и стандартный CSS. Вы воспользовались стандартной спецификацией для работы с DOM (Document Object Model), чтобы управлять динамическими элементами на странице. И все-таки, в броузерах, которые казалось бы сделаны с соблюдением именно этих стандартов, ваш сайт не работает. Скорей всего, ошибка кроется в неправильном заголовке DOCTYPE.
Эта небольшая статья расскажет вам о заголовках DOCTYPE, которые работают, а также объяснит практическое и теоретическое значение этого, казалось бы отвлеченного от реальности, тега.

Что такое DOCTYPE?

Согласно спецификациям HTML и XHTML тег DOCTYPE (что означает «объявление типа документа») сообщает валидатору, какую именно версию (X)HTML вы используете в своей странице. Этот тег должен всегда находиться в первой строке каждой страницы. Тег DOCTYPE — ключевой компонент web-страниц, претендующих на соответствие стандартам: без него ваш код и CSS не пройдут проверку валидатором.
Тег DOCTYPE также важен для правильного отображения и работы страницы в броузерах, соответствующих стандартам (Mozilla, IE5/Mac, и IE6/Win).
Тег DOCTYPE, в атрибутах которого указывается полный URI (полный web-адрес), сообщает броузерам, что страницу нужно вывести с соблюдением определенного стандарта или подвида этого стандарта.
Если вы будете пользоваться неполным тегом DOCTYPE, устаревшим его видом, или вообще забудете про него, броузер перейдет в «загадочный» (quirk) режим и будет исходить из предположения, что вы писали код страницы с ошибками и вольно отступали от стандартов, т.е. так, как писали в конце 90-ых годов.
В этом режиме броузер попытается разобрать вашу страницу по правилам обратной совместимости и выведет на экран, например, CSS так, как его вывел бы Internet Explorer 4-ой версии, а DOM будет работать так, как он работал именно в этом броузере (IE переключается в свой старый DOM, а Mozilla и Netscape 6 переключается вообще в бог знает что).
Понятно, что для вас эти выкрутасы не желательны. Но именно это вы и получите, если будете пользоваться неполным или неправильным тегом DOCTYPE.

Проблема

Когда создавали NN4, IE4 выполняли правила CSS не совсем в соответствии со стандартом. Реализация Netscape была просто ужасной, IE4 подошел к реализации стандарта лучше, но тем не менее, реализовал его не до конца. Хотя IE 5 Windows исправил множество ошибок IE 4, но оставались другие сбои в CSS (в основном в модели окон (window model)).
Поэтому, когда соответствие стандартам стало важным, W3C поставил производителей браузеров перед жестким выбором.
Приблизится к спецификации W3C было одним из решений проблемы, но если бы производители браузеров просто изменили реализацию CSS, чтобы соответствовать стандартам полностью, многие веб-сайты, «поползли» бы в большей или меньшей степени или оказались полностью неработоспособными. Такое сближение с соблюдением стандарта повлекло бы за собой проблемы. С другой стороны, не приведение к соответствию стандартов могло бы внести вечную путаницу в эпоху войны браузеров.

Решение

позволить веб-разработчикам, которые знали о стандартах, выбирать какой режим использовать.
продолжать показывать старые страницы по старым (совместимым) правилам. (quirks mode)

Иными словами, всем браузерам необходимо было работать в двух режимах: режим совместимости для старых правил, и строгого режима для стандарта.
IE Mac был первым браузером использовавшим оба режима, а Windows IE 6, Mozilla, Safari, Opera и последовали его примеру.
IE 5 Windows, а также старые браузеры, как Netscape 4, постоянно заблокированы в режиме совместимости.

Решение о выборе, какой режим отображения требуется вызвать, было найдено в использовании «DOCTYPE» переключения. Согласно стандартам, любой (X) HTML документ должен иметь DOCTYPE который рассказывает всему миру, какой тип (X) HTML документа он использует.

Допустимые DTD

DOCTYPE	Описание
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "www.w3.org/TR/html4/strict.dtd">	Строгий синтаксис HTML.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "www.w3.org/TR/html4/loose.dtd">	Переходный синтаксис HTML.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "www.w3.org/TR/html4/frameset.dtd">	В HTML-документе применяются фреймы.
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">	Строгий синтаксис XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">	Переходный синтаксис XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">	Документ написан на XHTML и содержит фреймы.
XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">	Разработчики XHTML 1.1 предполагают, что он постепенно вытеснит HTML. Никакого деления на виды это определение не имеет, синтаксис один и подчиняется четким правилам.

HTML 4.01 DTDs

HTML 4.01 Strict — Не разрешает презентационной (оформительской) разметки, аргументируя тем, что этоим должен заниматься CSS.
Transitional DTD позволяет некоторые устаревшие аттрибуты и элементы
Если используются фреймы — должен быть использован frameset doctype

XHTML 1.0 DTDs

XHTML Strict DTD самый строгий существующий DTD: устаревшие (см ниже) теги не поддерживаются, и код должен быть написан правильно
XHTML Transitional DTD такой же как XHTML Strict DTD, но старые теги разрешены. Это НАИБОЛЕЕ ПОПУЛЯРНЫЙ в настоящий момент DTD.
XHTML Frameset DTD единственный XHTML DTD который поддерживает фреймы.

XHTML 1.1 DTD

Это новый DTD, который имеет строгость как у XHTML 1.0 Strict, и основан на фреймворке и модулях описанных в Modularization of XHTML (не стал искать что это такое :).

Статистика использования различных DTD

Получается что Более 50% сайтов работают в режиме quirk mode — то есть в режиме IE4!

Устаревшие тэги и аттрибуты

Устаревшие тэги в алфавитном порядке

Устаревшие HTML / XHTML аттрибуты тегов. Все они могут быть заменены CSS стилями.

Разница между HTML и XHTML (указаны правила для XHTML)

Тэги должны быть написаны в нижнем регистре, вместо <IMG SRC="resource/frankisboat.jpg" WIDTH="389" HEIGHT="227" BORDER="0" ALT="boat">, как это было в HTML, нужно писать: <img src="resource/frankisboat.jpg" width="389" height="227" border="0" alt="boat" />
Все теги должны закрываться, или с использованием тэга со слешем в паре, как параграф ( ) например, или самозакрывающиеся тэги, как например ( ).
Все теги должны быть правильно вложены друг в друга, без перекрытий
Не должны использоваться устаревшие теги
Все аттрибуты должны быть набраны в нижем регистре
Все значение аттрибутов должны быть заключены в одинарные или двойные кавычки
Все аттрибуты должны использоваться в длинной форме, а не в короткой: disabled="disabled" в XHTML против DISABLED в HTML
Структура должна быть отделена от контента. Например тег - это часть контента (параграф) и вы не можете поместить в него например таблицу, потому что таблица это часть структуры (форматирования).

Совместимость и IE8

Чтобы работать как с современными страницами, написанными в соответствии с веб-стандартами, так и с тем, что осталось в наследство еще с конца 90-х, движки современных браузеров могут работать в разных режимах. Давайте еще раз посмотрим, что это за режимы и чем они переключаются.

О чем эта статья

Здесь описывается переключение режимов применительно к Firefox и другим браузерам на движке Gecko, Safari и другим браузерам на движке WebKit, Opera, Konqueror, Internet Explorer для Mac, Internet Explorer для Windows и браузерам-надстройкам над IE. Вместо названий движков будем пользоваться названиями самого известного браузера на каждом движке.

Назвыания движков браузеров

Browser	Engine	ECMAScript Engine
Firefox, Mozilla	Gecko	SpiderMonkey
Internet Explorer 4…7	Trident	jscript
Mac IE 5	Tasman	jscript
Opera 7…9.2	Presto	linear_b
Opera 9.5	Presto Core 2	futhark
Konqueror	KHTML	KJS
Safari	WebKit	JavaScriptCore

Статья посвящена механизму переключения режимов и не описывает поведение каждого режима в деталях.

Режимы

Ниже перечислены различные режимы современных браузеров:

Для страниц с типом контента text/html

Выбор режима для контента с типом text/html зависит от декларации doctype (подробности ниже). В IE8 режим зависит также от других факторов. Но по умолчанию даже в IE8 режим зависит от доктайпа (для не-интранет-сайтов, не внесенных в «черный список» Microsoft).

Внимание: поведение одноименных режимов у разных браузеров может отличаться (хотя в статье они описываются единообразно)!

Quirks Mode (режим обратной совместимости)

В Quirks mode браузеры намеренно нарушают современные спецификации веб-языков, чтобы страницы, написанные в манере конца 90-х, не разваливались. Разные браузеры воспроизводят разные причуды. IE6, 7 и 8 в Quirks mode фактически воспроизводят IE 5.5. У других браузеров Quirks mode — набор отклонений от «почти стандартного» режима.
Если вы пишете новые страницы, то от вас ждут соблюдения соотв. спецификаций (в частности, CSS2.1) и использования стандартного режима.

Standards Mode (стандартный режим)

В стандартном режиме браузеры пытаются обращаться с правильно составленными документами в полном соответствии со спецификацией — настолько, насколько данный браузер поддерживает стандарты.
Поскольку уровень поддержки стандартов разными браузерами различается, то даже стандартный режим, увы, пока не может гарантировать полностью одинакового отображения и поведения страниц.
HTML 5 называет этот режим «режимом без причуд» (no quirks mode).

Almost Standards Mode («почти стандартный», полустандартный режим)

У Firefox, Safari и Opera (начиная с 7.5) и IE8 есть и третий режим — «почти стандартный», при котором рисунки в ячейках таблицы выравниваются по вертикали традиционно (т.е. без текстовых отступов под ними — прим. перев.), а не в строгом соответствии со спецификацией CSS2. IE 6 и 7 для Windows, Opera ниже 7.5 и Konqueror не нуждаются в таком режиме, поскольку даже в своих стандартных режимах не соблюдают спецификации относительно выравнивания картинок в ячйках таблиц. Фактически, их стандартные режимы ближе к «почти стандартному» режиму Мозиллы, чем к ее стандартному режиму.
HTML 5 называет этот режим «режимом с ограниченными причудами» (limited quirks mode).

Режим IE7

У IE8 есть режим, в основном воспроизводящий стандартный режим IE7. У других браузеров подобных режимов нет, нет его и в спецификации HTML5.

Для страниц с типом контента application/xhtml+xml (XML-режим)

IE6, 7 и 8, равно как Mac IE5, не поддерживают application/xhtml+xml в принципе.

В браузере Nokia S60, основанном на движке WebKit, application/xhtml+xml не включает XML-режим, ради совместимости с синтаксически некорректным мобильным контентом (старые мобильные браузеры не использовали настоящего XML-парсера, поэтому на специальных сайтах для мобильников может встречаться некорректный XML).

Что происходит с такими страницами в Konqueror, автор пока не выяснил.

Режимы, не относящиеся к вебу

У некоторых движков также имеются режимы, не предназначенные для веб-контента. Здесь они упомянуты лишь «для коллекции». У Оперы есть режим WML 2.0. У WebKit на OS Leopard есть специальный режим для старых виджетов Dashboard.

Где и как это проявляется

Различие режимов проявляется в следующем:

Отображение

Режимы для text/html влияют главным образом на отображение CSS. Например, стили в таблице не наследуются — это «причуда», проявляющаяся только в Quirks mode. В некоторых браузерах в Quirks mode используется боксовая модель IE 5.5. Всех «причуд» отображения в одной статье не перечислить (наиболее удачная попытка, которую я смог найти, здесь — прим. перев.).

В «почти стандартном» режиме (в тех браузерах, у которых он есть) высота ячеек таблиц, содержащих одни рисунки, вычисляется иначе, чем в стандартном режиме.

В XML-режиме к HTML-элементу body не применяется ряд специальных правил (напр., его фон не распространяется на корневой элемент — прим. перев.) и CSS-селекторы становятся чувствительны к регистру.

Парсинг

Есть несколько «причуд», которые влияют на парсинг HTML и CSS, и могли бы помешать правильному парсингу корректных страниц. Такие причуды включаются и выключаются вместе с «причудами» отображения, т.е. с Quirks mode (насколько я знаю, их две основных, это комментарии с двойным дефисом и таблицы внутри — прим. перев.). Однако, важно понимать, что противопоставление Quirks mode и Standards mode относится главным образом к парсингу и отображению CSS, а не к парсингу HTML.

Многие ошибочно считают стандартный режим «режимом строго парсинга», думая, что он заставляет браузеры считаться с правилами синтаксиса HTML и что браузеры в нем способны оценивать правильность разметки. Ничего подобного. Браузеры пытаются исправлять «теговый суп» даже тогда, когда действует стандартный режим отображения (в 2000-м, до выхода Netscape 6, у Мозиллы действительно были режимы парсера с принудительной проверкой синтаксиса, но они оказались несовместимы с суровой действительностью и от них пришлось отказаться).

Другое распространенное заблуждение связано с парсингом XHTML. Многие считают, что само указание XHTML-ного Doctype меняет тип парсинга. Это не так. XHTML-документы, отданные сервером как text/html , разбираются тем же парсером «тегового супа», что и HTML. С точки зрения браузеров, такой XHTML — всего лишь «суп из тегов с гренками» (лишними слешами там и сям).

Лишь документы, отданные с XML-ным Content-type (напр., «application/xhtml+xml» или «application/xml») включают XML-режим парсинга, правила которого полностью отличаются от HTML-ного.

Скрипты

Хотя «причуды» Quirks mode касаются главным образом CSS, у скриптов бывают свои «причуды». Например, у Firefox в Quirk mode можно обращаться к элементам по id, как к глобальным переменным (как это сделано в IE). Влияние смены режимов в скриптах в IE8 заметнее, чем в других браузерах.

В XML-режиме некоторые интерфейсы DOM ведут себя в корне по-другому, потому что поведение DOM API для XML). было задумано как несовместимое с таковым для HTML.

Doctype как переключатель режимов, или «вынюхивание Doctype» (в оригинале «Doctype Sniffing» — прим. перев.)

Все современные браузеры ориентируются на Doctype (или его отсутствие) в начале страницы, выбирая режим отображения для документов типа text/html . К документам, отданным сервером с XML-ным Content-type, это не относится.

Объявление типа документа (Doctype) — это синтаксический пережиток SGML, исторического фреймворка для описания языков разметки, на котором был основан HTML до появления HTML5 (который лишь похож на SGML, но не основан на нем). В спецификации HTML 4.01 сказано, что объявление типа документа нужно для получения информации о версии HTML. Но несмотря на название «объявление типа документа» и несмотря на то, что говорит спецификация HTML 4.01, объявление типа документа — не самое подходящее средство для проверки принадлежности SGML- или XML-документа к определенному типу, хотя, казалось бы, именно для этого оно и придумано (судя по названию). Более подробно об этом — в конце статьи.

Ни спецификация HTML 4.01, ни стандарт ISO 8879 (SGML) ничего не говорят об использовании Doctype в качестве переключателя режимов отображения. «Вынюхивание Doctype» основано на наблюдении, что подавляющее большинство документов с «причудами» на тот момент либо не имели Doctype, либо содержали в нем ссылки на устаревшие DTD. HTML5 признает эту реальность и определяет doctype только для страниц типа text/html , и исключительно для переключения режима.

Статья по теме: В Вордпресс не работает кнопка добавить файл и многое другое

Типичное объявление типа документа (до появления HTML5) состояло из строки «<!DOCTYPE», имени корневого элемента («HTML»), строки «PUBLIC», публичного идентификатора DTD в кавычках, возможно — системного идентификатора (URL) этого же DTD и символа «>». Doctype размещается в документе до открывающего тега корневого элемента.

Выбор Doctype

text/html

Простые советы по выбору Doctype для новых документов, отдаваемых сервером как text/html
Cтандартный режим, валидация по «последнему слову техники»

<!DOCTYPE html>

Это лучший вариант, если вам нужна валидность новшеств типа <video>, <canvas> и ARIA. Учтите, что определение валидности HTML5 еще не устоялось. И обязательно проверяйте выравнивание рисунков в таблицах в Firefox, Safari, Chrome, Opera 9 или 10. Тестирование его в IE не даст адекватного результата (хотя в IE8 проверить тоже надо)!

Cтандартный режим, валидация по устоявшейся схеме

Вы в целом готовы использовать стандартный режим, но при этом хотите, чтобы устаревшая разметка проходила валидацию, либо ваша верстка строится на разрезанных картинках в таблице и вам лень исправлять их все:

Вы осознанно хотите получить Quirks mode

Не ставить Doctype.
Пожалуйста, не делайте этого. Верстка для Quirks mode начнет преследовать вас, ваших коллег или будущих сменщиков — когда никто больше не будет думать о совместимости с IE 5 (как уже никому нет дела до Netscape 4.x). Верстка для Quirks mode — плохая идея, искренне убеждает автор статьи.
Если вам еще нужна поддержка Windows IE 6, лучше воспользоваться условными комментариями, чем отбрасывать остальные браузеры назад, в режим обратной совместимости.

Автор не рекомендует XHTML-доктайпы, потому что отдача XHTML как text/html признана вредной. Если вы все-таки выберете XHTML-доктайп, не забывайте, что XML-декларация заставляет IE 6 (но не IE 7!) переключиться в Quirks mode.

application/xhtml+xml

Сложности с IE8

У IE8 четыре режима: режим причуд IE5.5, стандартный режим IE7, «почти стандартный» режим IE8 и стандартный режим IE8.

Хорошая новость в том, что IE8 определяет режим «вынюхиванием доктайпа», как другие браузеры, если:

Админ интранета не внес сайт в «черный список».Пользователь не нажал кнопку Compatibility View (или иным путем не внес домен в свой пользовательский«черный список»).Сайт не в интранете.Пользователь не включил опцию «отображать все сайты как IE7».
В перечисленных случаях (кроме двух пунктов с X-UA-Compatible ) IE8 реагирует на доктайп как IE7. Эмуляция IE7 называется Compatibility View.

Ваш домен попал в «черный список» Microsoft, на вашем домене (как на iki.fi!) есть сайты других авторов, из-за которых пользователи могут включать Compatibility View для всего домена или вы хотите гарантии, что пользователь не включит Compatibility View для вашего сайта

Ваш сайт работал в IE7, но ломается в IE8

Ссылки по теме

Эрик Мейер пишет о режимах Mac IE 5 в статье Use the Right Doctype (статья Дэвида Бэрона)
В статье CSS Enhancements in Internet Explorer 6 Лэнса Сильвера обсуждаются режимы и «вынюхивание Doctype» в Windows IE 6
Фарук Эйтс пишет про IE8 в статье IE8 and the X-UA-Compatible situation

Дополнение: обращение к разработчикам реализаций и авторам спецификаций, работающим с XML

Пожалуйста, не переносите «вынюхивание Doctype» в XML.

«Вынюхивание Doctype» — это решение проблемы «тегового супа», на уровне этого же «супа». Оно было придумано уже после спецификаций HTML 4 и CSS2, как эвристический способ разграничить «наследия дикого веба» от документов, чьи авторы рассчитывают на стандартное поведение.

Иногда возникают предложения, что «вынюхивание Doctype» может применяться и в XML-среде для выбора различных обработчиков, распознавания используемого словаря или включения/выключения каких-то «фич». Это плохая идея. Раздача обработчикам и активация словаря должны основываться на пространствах имен, а активация «фич» — на явных инструкциях обработки или элементах.

Вся концепция «well-formedness» была введена, чтобы сделать возможными парсинг XML без участия DTD и, более того, документы без Doctype. C формальной точки зрения, если два XML-документа имеют одну каноническую форму и приложение обрабатывает их по-разному (причем различие не вызвано намеренным отключением обработки внешних сущностей), то, вероятно, это приложение «глючит». С практической точки зрения, если ContentHandler из SAX2 «видит» два XML-документа как одинаковый контент, а приложение воспринимает их по-разному, то оно тоже скорее всего «глючит». Поскольку вы, как автор веб-страницы, не можете гарантировать, что каждый, кто парсит вашу страницу, использует XML-процессор с распознаванием внешних сущностей (даже если в некоторых браузерах это и так), вставка Doctype в XML для веба практически бессмысленна, и делается зачастую просто по привычке или «священному ритуалу». И без Doctype можно провалидировать страницу по DTD, используя функцию перекрытия DTD у валидатора от W3C, а еще лучше воспользоваться валидацией на базе RELAX NG, которая не засоряет документ ссылками на схемы. Требование наличия доктайпа только для различения чего-либо нелепо, хотя именно таково положение дел с HTML.

Для HTML и SGML такой спор не имеет смысла, т.к. браузеры не используют настоящих SGML-парсеров.

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

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

Если вы хоть раз работали с 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 на примерах

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

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

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

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

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

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

Фреймы

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

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

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

И что теперь?

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

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

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

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

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

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

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

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

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

Доктайп нужен на каждой странице

Но не только он. Узнайте всё о структуре HTML-документов в интерактивных тренажёрах.

Читайте также: