Почему так важен 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, в атрибутах которого указывается полный URL (полный web-адрес), сообщает броузерам, что страницу нужно вывести с соблюдением определенного стандарта или подвида этого стандарта.

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

В этом режиме броузер попытается разобрать вашу страницу по правилам обратной совместимости и выведет на экран, например, CSS так, как его вывел бы Internet Explorer 4-ой версии, а DOM будет работать так, как он работал именно в этом броузере (IE переключается в свой старый DOM, а Mozilla и Netscape 6 переключается вообще в бог знает что).

Понятно, что для вас эти выкрутасы не желательны. Но именно это вы и получите, если будете пользоваться неполным или неправильным тегом DOCTYPE. Данная статья попробует исправить эту вашу ошибку.

(Внимание: броузер Opera не играет по таким правилам; он всегда пытается отобразить страницу так, как если бы она соответствовала стандартам. Слава Опере! С другой стороны, Opera пока не полностью поддерживает стандарт W3C DOM, но работа над этим уже ведется.)

Где же взять правильный DOCTYPE?

Так как теги DOCTYPE чрезвычайно важны для работы Web-а по стандартам, и так как консорциум W3C является ведущей организацией, создающей стандарты для Web-а, следовало бы ожидать, что на сайте W3C будет представлен список всех вариантов тега DOCTYPE, и казалось бы эту информацию на сайте W3C можно найти быстро и просто в каком-то определенном разделе. Но это не так, по крайней мере на момент написания этой статьи.

W3.org - это не сайт со статьями как A List Apart, WebReference или Webmonkey. Он не создан в помощь web-дизайнерам, разработчикам и авторам сайтов, и он не занимается распространением новейшей информации и полезных советов. Это не его задача.

Да, иногда W3C публикует серии учебных статей, хотя большинство web-разработчиков об этом даже и не знает. Но в основном, сайт W3C содержит собрание предложений, проектов и Рекомендаций, которые написаны инженерами для инженеров. И когда я говорю об инженерах, я не имею в виду простых специалистов в области web-разработок, таких спецов, как вы и я. Я имею в виду инженеров, по сравнению с которыми мы выглядим полными болванами.

Я могу потратить весь день в поисках правильных тегов DOCTYPE на сайте w3.org, но не найду ни одной страницы, где они перечислены все вместе. Если же вам все-таки удастся найти какой-нибудь тег DOCTYPE (например, упоминаемый в какой-нибудь Рекомендации или Рабочем проекте), скорей всего окажется, что на вашем сайте он работать не будет.

По всему сайту W3C разбросаны теги DOCTYPE, где в атрибутах отсутствует URL, и теги DOCTYPE, содержащие в атрибутах относительный URL, связанный с документами, находящимися на том же самом сайте W3C. Если вы возьмете этот тег с сайта W3C, перенесете его на свой сайт и вставите в свои страницы, относительный URL будет указывать на несуществующие на вашем сайте документы, следовательно напрасно пропадет ваш труд и усилия броузера.

Например, на многих сайтах можно встретить в страницах следующий вариант тега DOCTYPE, который был без всяких изменений перенесен с сайта w3.org:

Посмотрите на последнюю часть тега DOCTYPE ("DTD/xhtml1-strict.dtd"). Обратите внимание, что это относительная ссылка на документ, расположенный на сайте W3C. Так как целевой документ находится на сайте W3C, а не на вашем, этот URL для броузера бесполезен.

А выглядеть DOCTYPE должен вот так:

Обратите внимание, что этот вариант DOCTYPE содержит в конце полный вариант URL. А так как тег указывает на правильное расположение документа, броузер знает, где этот документ надо найти в сети, и следовательно выведет вашу страницу в том стандарте, который вы упомянули в DOCTYPE.

Правильные варианты тега DOCTYPE

Итак, каким же вариантом тега DOCTYPE надо пользоваться? Очень хорошо, что вы задали этот вопрос. Ниже перечислены полные варианты тега DOCTYPE для различных нужд:

Стандарт HTML 4.01 Strict (строгий), Transitional (переходный), Frameset (с фреймами)

Стандарт XHTML 1.0 Strict (строгий), Transitional (переходный), Frameset (с фреймами)

Стандарт XHTML 1.1 DTD

Что дальше?

Как вы можете внести свой вклад в распространение стандартов в Web? Перво-наперво, поместите в закладки данную страницу (либо просто сохраните ее на своем компьютере), а также проверьте, вставляет ли ваш web-редакторв в ваши страницы тег DOCTYPE, а если вставляет, - правильный ли вариант тега он использует?

Многие разработчики ПО просто скопировали неполные варианты тега DOCTYPE с сайта W3C в свои программы. И в результате: вы полагаетесь на программу, которая вставляет неправильный вариант тега, броузер впадает в "загадочный" режим, а вы безуспешно бьетесь над загадкой, почему ваши страницы не работают, как надо.

Стоит также написать тем ребятам, что делают ваш любимый web-редактор, и показать им, как выглядит правильный тег DOCTYPE , после чего, вежливо попросить их внести изменения в новую версию программы. В некоторых случаях, вы сможете даже внести изменения в программу сами.