Существует множество причин, по которым веб-страница может отображаться некорректно: отсутствие необходимых закрывающих тэгов, неверно отформатированные таблицы, ошибки JavaScript, ошибки в CSS, некорректные запросы к серверу и т.д. Зачастую такие ошибки — следствие того, что разработчик просто не проверяет свою работу, не проводит валидацию кода. В других случаях ошибки — следствие недостатка знаний и опыта при разработке веб-страниц.

Существует множество причин, по которым веб-страница может отображаться некорректно: отсутствие необходимых закрывающих тэгов, неверно отформатированные таблицы, ошибки JavaScript, ошибки в CSS, некорректные запросы к серверу и т.д. Зачастую такие ошибки — следствие того, что разработчик просто не проверяет свою работу, не проводит валидацию кода. В других случаях ошибки — следствие недостатка знаний и опыта при разработке веб-страниц.

Даже если вы сможете избежать все вышеперечисленные типы ошибок, есть еще кое-что, способное нарушить правильность отображения ваших страниц — это игнорирование использования тэга DOCTYPE или неправильное его использование.

Значительное число веб-страниц не используют тэг DOCTYPE (забавно, что многие из таких сайтов — сайты веб-разработчиков или тех, кто обучает веб-разработке). Но это не важно. Важно то, что если вы хотите добиться корректного отображения во всех браузерах, использовать данный тэг совершенно необходимо. Кроме того, данный тэг обязателен, если вы хотите произвести валидацию (т.е. проверку корректности кода) вашей страницы.

Режимы работы браузеров

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

В стандартном режиме работы браузер пытается следовать рекомендациям W3C (Консорциума Всемирной Паутины — организации, разрабатывающей и внедряющей технологические стандарты для сети Internet). Когда браузер переходит в режим «quirks» («причудливый режим»), он пытается сымитировать работу старых версий браузеров. Это может привести к тому, что браузер будет игнорировать таблицы стилей и отображать страницу в непригодном для нормального восприятия виде.

Что это такое?

Объявление DOCTYPE — это специальная конструкция, которая сообщает браузеру, какая версия (X)HTML используется на данной странице, чтобы тот знал, как правильно отобразить документ. Объявление типа документа может также содержать ссылку на специальный текстовый файл (например, loose DTD) который используется браузером для получения необходимой ему информации для следования стандарту.

Это можно сравнить с тем, как вы сдаете машину на доводку двигателя. Чтобы выполнить ее правильно, механику нужно знать производителя автомобиля, год выпуска, модель, объем двигателя, количество цилиндров, мощность и т.п. Зная эту информацию, можно начинать работу по доводке двигателя.

Спецификации

Спецификации W3C HTML 4.01 и XHTML 1.0 утверждают о необходимости присутствия объявления типа документа DOCTYPE для каждой веб-страницы.

Консорциум Всемирной Паутины устанавливает спецификации для протоколов обмена информации в сети. Это помогает добиться того, чтобы любой веб-сайт корректно отображался в программах со стороны пользователя — браузерах, просмотрщиках и других подобных программах. Технически нет никаких определенных правил, стандартов, в соответствии с которым и должна разрабатываться любая веб-страница. Есть только так называемые «спецификации», или, как их называет W3C — «рекомендации». Этих спецификаций, однако придерживаются все больше веб-разработчиков и создателей браузеров.

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

Если вы не следуете спецификациям, то вы постоянно будете вынуждены проверять, как выглядит ваш «нестандартный» сайт в каждом браузере, проверять это повторно при выходе каждой новой версии, надеясь, что все будет отображаться так, как вам того хотелось бы. Гораздо лучше действовать по стандартам, так как в конечном счете те редкие случаи, когда браузеры неправильно обрабатывают правильный код навсегда уйдут в прошлое, и вам не придется столь сильно волноваться за внешний вид вашего творения.

Применение

Объявление типа документа должно идти на странице в самом начале, еще до открытия тэга <html>. В этом случае, когда браузер доходит непосредственно до кода страницы, он уже знает, как правильно его обрабатывать.

Есть три типа документов для HTML 4.01: Strict (Строгий), Transitional (Переходный), и Frameset (Если документ содержит фреймы). Тип Strict используется совместно с Каскадными Таблицами Стилей и помогает добиться «чистого» кодирования.

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

Тип Transitional используется когда элементы форматирования HTML могут включаться в сам HTML-документ, а не только в таблицу стилей.

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

Тип Frameset используется в документах, содержащих фреймы (редкость в наши дни).

<!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">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Источник:  loco.ru