Форум eBanners.Ru: Реклама в интернете и раскрутка сайтов - форум по интернет-рекламе
DOCTYPE - правильный doctype, что такое DOCTYPE - Веб-дизайн, разработка сайтов и создание баннеров - интернет-реклама
У вас есть вопрос по рекламе в интернете и раскрутке сайтов? Задайте его здесь и вам ответят. Вы уже всё знаете? Помогите тем, кто знает пока не всё. Правила форума|
Сделать стартовой|Добавить в избранное.
Почему так важен DOCTYPE - правильный doctype
Fixing your site with the right 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, устаревшим его видом, или вообще забудете про него, броузер перейдет в "загадочный" режим и будет исходить из предположения, что вы писали код страницы с ошибками и вольно отступали от стандартов, т.е. так, как писали в конце 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, где в атрибутах отсутствует URI, и теги DOCTYPE, содержащие в атрибутах относительный URI, связанный с документами, находящимися на том же самом сайте W3C. Если вы возьмете этот тег с сайта W3C, перенесете его на свой сайт и вставите в свои страницы, относительный URI будет указывать на несуществующие на вашем сайте документы, следовательно напрасно пропадет ваш труд и усилия броузера.
Например, на многих сайтах можно встретить в страницах следующий вариант тега DOCTYPE, который был без всяких изменений перенесен с сайта w3.org:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
Посмотрите на последнюю часть тега DOCTYPE ("DTD/xhtml1-strict.dtd"). Обратите внимание, что это относительная ссылка на документ, расположенный на сайте W3C. Так как целевой документ находится на сайте W3C, а не на вашем, этот URI для броузера бесполезен.
А выглядеть DOCTYPE должен вот так:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Обратите внимание, что этот вариант DOCTYPE содержит в конце полный вариант URI. А так как тег указывает на правильное расположение документа, броузер знает, где этот документ надо найти в сети, и следовательно выведет вашу страницу в том стандарте, который вы упомянули в DOCTYPE.
Правильные варианты тега DOCTYPE
Итак, каким же вариантом тега DOCTYPE надо пользоваться? Очень хорошо, что вы задали этот вопрос. Ниже перечислены полные варианты тега DOCTYPE для различных нужд:
Стандарт HTML 4.01 Strict (строгий), Transitional (переходный), Frameset (с фреймами)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Стандарт XHTML 1.0 Strict (строгий), Transitional (переходный), Frameset (с фреймами)
<!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">
Стандарт XHTML 1.1 DTD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Что дальше?
Как вы можете внести свой вклад в распространение стандартов в Web? Перво-наперво, поместите в закладки данную страницу (либо просто сохраните ее на своем компьютере), а также проверьте, вставляет ли ваш web-редактор в ваши страницы тег DOCTYPE, а если вставляет, - правильный ли вариант тега он использует?
Многие разработчики ПО просто скопировали неполные варианты тега DOCTYPE с сайта W3C в свои программы. И в результате: вы полагаетесь на программу, которая вставляет неправильный вариант тега, броузер впадает в "загадочный" режим, а вы безуспешно бьетесь над загадкой, почему ваши страницы не работают, как надо.
Стоит также написать тем ребятам, что делают ваш любимый web-редактор, и показать им, как выглядит правильный тег DOCTYPE, после чего, вежливо попросить их внести изменения в новую версию программы. (В некоторых случаях, вы сможете даже внести изменения в программу сами.)
В ближайшем будущем
У нас есть все причины надеяться, что W3C скоро выложит полный, точный и удобный список всех вариантов тега DOCTYPE на своем сайте, а также опубликует другую важную информацию. И эту информацию легко будет найти. Кстати, в эту статью внес свой вклад Карл Дабост (Karl Dubost) - менеджер W3C по обеспечению качества (Conformance Manager of W3C's Quality Assurance team).
Кроме того, проект The Web Standards Project скоро будет переделан (очень скоро), и на нем тоже можно будет найти эту информацию.
Но так как каждый день создаются и выпускаются в сеть все новые и новые сайты, эта информация вам нужна уже сейчас, так вот она - пользуйтесь.
Удачи!
Джеффри Зельдман (Jeffrey Zeldman)
источник
автор: 12 April 2002 Джеффри Зельдман (Jeffrey Zeldman)
перевод: Александр Качанов
DOCTYPE - правильный doctype
Различное отображение 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 <!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 <!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>
DOCTYPE - правильный doctype, что такое DOCTYPE
- на английском
DOCTYPE - правильный doctype, что такое DOCTYPE
Давайте вспомним, почему отказались от SGML? И давайте ещё будем иметь чёткое представление, что такое html,xml-документ.