Различное отображение HTML документов в браузере зависит от объявленного Doctype

При использовании одних и тех же HTML-тегов в старых кривых браузерах и современных, придерживающихся стандартов (Mozilla и браузеры на его основе, Mac IE 5, Windows IE 6, Safari, Opera 7+ и Konqueror 3.2) можно обнаружить два основных режима отображения web-страницы. В одном случае браузер пытается представить страницу в соответствии с рекомендациям CSS и (X)HTML. В другом случае отображение страницы происходит как в старых, далеких от стандартов браузерах. В Mozilla эти два состояния известны как "the Standards mode" и "the Quirks mode", т.е. как стандартный режим и неопределенный соответственно.

Кривое и нестандартное поведение старых ущербных браузеров, таких как Netscape Navigator 4.x и IE 5 для Windows называется "quirks". Иногда страница бывает написана так, что ее разметка изначально некорректна.

Большинство неприятностей связано с неправильной разметкой и конфликтами в CSS. Интерпретация таких кривых страниц и стилей приводит к тому, что автор, написавший ее скорее всего увидит в браузере совсем не то, что собирался изобразить. Тот же, кто способен грамотно разметить страницу и умело применить таблицу стилей всегда получит ожидаемый результат.

Quirks Mode - Неопределенное состояние

При Quirks Mode в браузерах нарушаются рекомендации W3C для обеспечения нормального отображения страниц. Для разных браузеров существуют различные варианты совместимости с предыдущими версиями. Следовательно, "Quirks mode" не единственная цель. Например, Mozilla берет свое начало с Netscape 4.x, а Windows IE 6 с Windows IE 5.

Собственно цель Quirks mode - корректное отображение страниц, написанных для старых браузеров. При создании новых, современных страниц следует выполнять требования стандартов и рекомендаций (CSS 2.1 в частности) и придерживаться Standards mode.

Standards Mode - Соответствует стандартам

При Standards Mode современные браузеры должны одинаково правильно представлять соответствующую стандартам страницу.

Almost Standards Mode - Почти соответствует стандартам

В браузерах Mozilla, Safari и Opera 7.5 еще существует третий вариант "the Almost Standards mode" (почти соответствующий стандартам), который не достаточно строго следует рекомендациям W3C. У Mac IE 5, Windows IE 6, Opera до 7.5 и Konqueror отсутствует Almost Standards mode, потому что они и так не могут работать в соответствии с CSS2, поэтому они будут находиться в этом случае в Standards modes. Фактически, их Standards modes это Almost Standards mode браузера Mozilla, а не полноценный Standards modes. Важно помнить: браузеры имеют одинаковые основные состояния, но даже при одинаковых состояния они все равно работают по-разному.

Старые браузеры кое как еще обрабатывают нестандартные теги. В современных браузерах некорректный HTML приведет и к неправильной работе таблиц стилей и скриптов.

Формирование логически правильного дерева документа из некорректной разметки потребует немало изворотливости и не факт, что результат будет таким, как задумывалось, в отличие от применения чистого и стандартного HTML. Раньше, применением различных трюков удавалось достичь более-менее схожего отображения страниц в разных браузерах, поэтому со временем, подавляющее большинство документов text/html в интернете оказались синтаксически неправильными, потому что они не следовали единому стандарту.

Некоторые люди ошибочно считают Standards mode режимом строгого анализа, при этом неверно предположение, что браузеры будут вынуждены строго выполнять только правила синтаксиса HTML, которые они будут использовать для оценки корректности разметки. Это не верно. Браузеры продолжают пытаться правильно обрабатывать любой код, даже в случае Standards mode разметки. (В 2000 году, до релиза Netscape 6 анализатор Mozilla действовал только по правилам строго синтаксиса HTML. Но, как оказалось, стало невозможным корректно представлять созданные ранее документы и от этого пришлось отказаться.)

Другое заблуждение связано с XHTML анализом. Некоторые люди думают, что документ XHTML как-то иначе анализируется браузером. Это не так. XHTML документы обслуживаются как text/html и анализируются так же, как и HTML. В браузерах, XHTML обслуживается как text/html, но только с учетом особенностей синтаксиса, А вот документы, которые соответствуют типу контента XML рассматриваются уже иначе, именно как XML.

Исследование Doctype

Mozilla, Mac IE 5, Windows IE 6, Safari и Opera 7+ используют doctype для того, чтобы оценить как рассматривать разметку документа text/html. Этот метод основан на определении объявления типа документа (или его отсутствия) в начале HTML документа. (Документы, которые используют определение типа контента XML, всегда рассматриваются в Standards mode.)

Объявление типа документа (doctype) включает название (характерное для распознавания) корневого элемента и ссылку на DTD (document type definition - определение типа документа), которое в свою очередь, содержит информацию о синтаксических правилах для документа. (Теоретически, весь DTD может быть вставлен в объявление типа документа, но на практике используется лишь ссылка на него.) В спецификации HTML объявление типа документа содержит информацию о версии HTML. Отсутствие объявления типа документа и информации о его версии не позволяет правильно обрабатывать этот документ.

Ни спецификация HTML 4.01, ни ISO 8879 (SGML) не говорят что-либо об использовании объявления типа документа как о переключателе режимов отображения разметки. Пренебрежение к doctype основано на его несоблюдении, а также на том, что большинство устаревших нестандартных документов не включают объявление типа документа, либо ссылаются на старые DTD.

Типичное объявление типа документа содержит строку (все ее части разделены пробелами): "<!DOCTYPE", общий идентификатор корневого элемента ("HTML"), строку "PUBLIC", общий идентификатор DTD в кавычках, может быть системный идентификатор (URL) того же DTD и символ ">". Объявление типа документа должно размещаться перед начальным тегом корневого элемента.

Трактовка некоторых Doctype

В приведенной таблице Quirks Mode, Standards Mode и Almost Standards Mode обозначены соответственно Q, S и A. Когда у браузера есть только два режима - Standards Mode обозначен как "S" в случае определения высоты строки в ячейке таблицы как в Mozilla's Standards Mode, и как "A" в случае определения высоты строки в ячейке таблицы как в Mozilla's Almost Standards Mode.

В шапке таблицы используются следующие соткращения:

NS6
Mozilla 0.6…0.9.4 и Netscape 6.0…6.2.3
Old Moz
Mozilla 0.9.5 вплоть до 1.1 alpha и Mozilla 1.0
Moz и Safari
Mozilla 1.0.1, Mozilla 1.1 beta и выше, Firefox и Netscape 7, Safari v73 aka. 0.9 вплоть до Safari v125.11 aka. 1.2.4
Opera 7.5
Opera 7.5
Opera 7.10
Opera 7.107.23
IE 6 и Opera 7.0
Windows IE 6 and Opera 7.0…7.03
Mac IE 5
Mac IE 5.0…5.2.3
Konq 3.2
Konqueror 3.2.2…3.3 (вероятно также 3.1…3.2.1; не подтверждено)
Doctype NS6 Old Moz Moz и Safari Opera 7.5 Opera 7.10 IE 6 и Opera 7.0 Mac IE 5 Konq 3.2
Не объявлен Q Q Q Q Q Q Q Q
До HTML 4.0 doctype <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> Q Q Q Q Q Q Q Q
HTML 4.0 Strict doctype без URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> S S S S A A A A
HTML 4.01 Strict doctype без URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> S S S S A A Q A
HTML 4.0 Strict doctype с URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/html4/strict.dtd"> S S S S A A A A
HTML 4.01 Strict doctype с URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> S S S S A A A A
HTML 4.0 Transitional doctype без URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> Q Q Q Q Q Q Q Q
HTML 4.01 Transitional doctype без URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> Q Q Q Q Q Q Q Q
HTML 4.01 Transitional doctype с URL http://www.w3.org/TR/html4/loose.dtd <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> S S A A A A A Q
HTML 4.01 Transitional doctype с URL http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> Q S A A A A A Q
HTML 4.0 Transitional doctype с URL <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Q Q Q A A A A Q
XHTML 1.0 Strict doctype без XML объявления <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> S S S S A A A A
XHTML 1.0 Transitional doctype без XML объявления <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> S S A A A A A Q
XHTML 1.0 Strict doctype вместе с XML объявлением <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
S S S S A Q A Q
XHTML 1.0 Transitional doctype с XML объявлением <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
S S A A A Q A Q
ISO HTML версия 2000 doctype, краткая форма <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN"> Q S S Q Q Q Q Q
ISO HTML версия 2000 doctype, длинная форма <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HyperText Markup Language//EN"> Q S S S A A A Q
ISO HTML версия 1999 doctype, краткая форма <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:1999//DTD HTML//EN"> S S S Q Q Q Q Q
ISO HTML версия 1999 doctype, длинная форма <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:1999//DTD HyperText Markup Language//EN"> S S S S A A A Q

XHTML Basic (с объявлением XML) и XHTML 1.1 (с объявлением XML) отсутствуют в таблице, т.к. такое поведение doctype влияет только на отображение страниц документов представленных как text/html но, в случае text/html, не может быть использовано XHTML Basic и XHTML 1.1. Однако, если эти документы обрабатываются как text/html, то поведение браузера в зависимости от doctype будет подобно XHTML 1.0 Strict. То есть, Windows IE 6 применяет этот quirks mode даже при наличии XML объявления.

Выбор Doctype

Приведем несколько простых рекомендаций по выбору doctype для документа типа text/html.

Документ будет содержать нестандартные теги и/или в разметке будут применяться различные нестандартные ситуации. (Создание подобных страниц - редкостная гадость.)
Doctype можно не указывать
Документ действителен как HTML 4.01 Transitional (может содержать нерекомендуемые(deprecated) элементы разметки) и работает с CSS2 блочной моделью (для совместимости с основанными на Mozilla браузерами это сделает "the full standards mode").
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Документ действителен как HTML 4.01 Strict и работает с CSS2 блочной моделью.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

При использовании XHTML doctype следует помнить, что наличие XML объявления переводит Windows IE 6 в Quirks mode. В чем легко можно убедиться кликнув по тексту ниже.

Клик сюда для проверки состояния браузера

Проверить свой HTML документ можете добавив в него следующий код:
<script type="text/javascript">//<![CDATA[
alert('Этот документ браузер будет анализировать как:\n'+document.compatMode);
//]]></script>

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



Много комментариев (12) к “Различное отображение HTML документов в браузере зависит от объявленного Doctype”

  1. Rezook :

    Вот уж действительно! Без объявления DOCTYPE браузеры ведут себя как бог на душу положит. Эххх…жалко, что нельзя в каменты “насрать” спецам студии преподобного Артемия, утверждающими, что DOCTYPE не нужны.


  2. Гость :

    А может спецы одумались?
    http://adresa.yandex.ru/


  3. Neodim :

    а это что получится?


  4. Neodim :

    к предыдущему
    DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”


  5. Баранов Андрей :

    XHTML™ 1.1 – Module-based XHTML


  6. Tb :

    По поводу adresa.yandex.ru.
    А вы валидацию не смотрели?
    На этот сайт выдается 8 тупых ошибок :)
    Я не наезжаю, мне яндекс очень нравится, просто прикольно :)


  7. Tb :

    P.S. Забыл сцылку дать: http://validator.w3.org/check?uri=http%3A%2F%2Fadresa.yandex.ru%2F


  8. VINT :

    А никто не пробовал проверять на http://validator.w3.org сайт Артемия Лебедева?
    http://www.artlebedev.ru

    Рекомендую! он хитрюга нашёл как увернуться)))


  9. KamaZee :

    Нашел. Клоакер, блин ):


  10. SelenIT :

    XHTML Basic (с объявлением XML) и XHTML 1.1 (с объявлением XML) отсутствуют в таблице, т.к. такое поведение doctype влияет только на отображение страниц документов представленных как text/html но, в случае text/html, не может быть использовано XHTML Basic и XHTML 1.1.

    Забавно читать это на странице, объявленной как XHTML 1.1 и отданной как text/html :)

    Или я заблуждаюсь?


  11. Григорий :

    Классная статья и табличка. А можно эти данные актуализировать как то? Добавить в сравнительную таблицу боле свежие версии браузеров.


  12. SelenIT :

    2 Григорий:

    Henry Sivonen, переводом чьей статьи является этот материал, обновил ее пару месяцев назад. Могу несколько нескромно предложить перевод более нового варианта (с примечаниями переводчика насчет поведения IE8:).



22 queries 0.175 seconds.