Для чего нужен doctype
!DOCTYPE. Стандарты HTML. Валидная верстка
указывает, в соответствии с каким стандартом HTML написана ваша Web-страница.
DOCTYPE | Описание |
---|---|
HTML5 | |
Для всех документов. | |
HTML 4.01 | |
Строгий синтаксис HTML. | |
Переходный синтаксис HTML. | |
В HTML-документе применяются фреймы. | |
XHTML 1.0 | |
Строгий синтаксис XHTML. | |
Переходный синтаксис XHTML. | |
Документ написан на XHTML и содержит фреймы. | |
XHTML мобильного профиля, добавляет специфические элементы для мобильных телефонов. | |
XHTML 1.1 | |
Никакого деления на виды это определение не имеет, синтаксис один и подчиняется четким правилам. |
Стандарты HTML и XHTML
В HTML 4.01 и HTML5 внешний вид страницы отделен от ее содержания. Содержание и структура (заголовки, абзацы, ссылки) задаются в HTML. Оформление (выравнивание, шрифты, цвета) задаются CSS-стилями.
Например, тег и атрибут align объявлены устаревшими.
Требования XHTML | Нельзя | Нужно |
---|---|---|
Все теги должны быть закрыты. | ||
Все теги, атрибуты и CSS-свойства должны быть набраны в нижнем регистре. | ||
Все значения атрибутов тегов должны быть заключены в кавычки. | ||
Должна строго выполняться иерархия: первый тег закрывается последним. | . | . |
Блочный тег не может быть вложен в строчный. (После блочного элемента дальнейший вывод на странице осуществляется с новой строки. Строчный элемент перевода строки не делает.) | ||
Булевы атрибуты записываются в развёрнутой форме. | ||
У изображений обязательно должно быть указано описание |
Однако, 2 июля 2009 года Консорциум Всемирной паутины (W3C) сообщил о прекращении работ над XHTML 2.0, посчитав концепцию XHTML неверной. Группа программистов переключилась на работу над стандартом HTML5. В 2014 году стандарт HTML5 был завершён.
Кому интересно, могут ознакомиться с первоисточником:
Официальная версия стандарта HTML5 находится по адресу: www.w3.org/TR/html5/
Определимся с выбором. Сделать его несложно: использовать XHTML-стандарт не стоит, если вы не собираетесь расширять язык HTML.
Строгий и переходный синтаксис HTML 4.01
Переходные синтаксисы существуют для того, чтобы облегчить переход на новый стандарт. Они пропустят многое из того, что строгий синтаксис посчитает ошибками.
Понять, что тут к чему, проще на примере. Сначала зададим строгий синтаксис.
Строгий синтаксис
Чтобы отслеживать ошибки верстки, установим дополнение к FireFox Html Validator.
Откроем нашу страницу в браузере FireFox, наведем мышку на знак валидатора:
Двойной щелчок на знаке валидатора даст развернутый список ошибок:
Переходный синтаксис
Запускаем FireFox. Ошибок нет:
Вроде все прекрасно. Может, на этом и остановиться?
Мой совет: делать валидную верстку на последней версии стандарта HTML5. HTML надо использовать по его прямому назначению, а оформление оставить CSS. Кроме того, если у сайта валидная верстка, а он неправильно отображается в каком-либо браузере, то это однозначно проблема браузера. Новые версии браузера будут лучше соответствовать стандарту и не ошибаться в интерпретации валидного кода. Если же сложная верстка реализована невалидным способом, то нет гарантий, что новые версии браузеров не рассыпят ее на кусочки.
Не соблазняйтесь лояльностью переходного синтаксиса, только строгое соответствие стандартам!
Зачем нужна валидная верстка
Казалось бы, зачем мучиться? Ведь маленькие недочеты верстки браузеры часто исправляют автоматически, и сайт работает абсолютно нормально. Но эти мелкие, практические незаметные ошибки тем не менее замечают поисковые системы. Даже один отсутствующий тег
— это минус на оценке качества сайта.
Именно из-за способности поисковых систем замечать любые недочеты HТML-кода и рекомендуется соблюдать валидность верстки. Кроме того, проверяя код на валидность, можно обнаружить наряду с мелкими недочетами еще и серьезные ошибки, которые были не замечаны ранее.
Только представьте: вы создаете страницу сайта, все делаете по правилам, однако ваш браузер некорректно отображает всю ту информацию, которую вы разместили на вашей странице. С чем это может быть связано?
Не лишним будет упомянуть о том, что данный тег имеет достаточно долгую историю. Он был разработан в то время, когда создали Internet Explorer 5 для MacOS и столкнулись с определенными трудностями чтения некоторых страниц.
Почему необходимо указывать именно Doctype?
Как уже было сказано выше, данный тег вставляют в код любого веб-документа для правильного определения его типа. Указание типа документа требуется в первую очередь потому, что сегодня существует сразу несколько версий HTML документов, написанных на разных языках. В том числе существует и расширенная версия – XHTML.
Пример тега Doctype:
Разновидности тега Doctype
Сегодня существует несколько вариантов данного тега, которые используется для разных версий веб-документов:
В данном случае используется строгий html:
Что произойдет, если использовать старые версии тега Doctype?
Значение тега Doctype очень важно, так как именно он позволяет работать всем веб-страницам в соответствии с указанным стандартом.
В том случае, если вы будете использовать неполную версию тега, некорректно его вставите или же не будете использовать его в коде и вовсе, то ваш браузер автоматически перейдет в « загадочный » режим.
Отображение документа в данном случае будет происходить таким образом, будто вы вольно отступали от стандартов.
На сегодняшний день только браузер Opera старается отображать страницы таким образом, как если бы они соответствовали всем стандартам, независимо от того, был ли использован тег Doctype или же нет.
Где можно взять качественный тег Doctype?
Надеюсь, что данная статья оказалась для Вас полезной! Удачи!
Зачем нужен DOCTYPE?
Все, кто знаком с более-менее серьёзным языком программирования, знают, что такой вольности в написании кода, как в HTML, нет. Я знаком (с некоторыми очень даже серьёзно) с целой кучей языков программирования, и смело заявляю: нигде такой свободы, как в HTML, не существует! Однако, из-за этой свободы возникает большое количество противоречий для браузеров. Ведь им же нужно как-то отображать этот «вольный» код, и желательно, чтобы каждый браузер отобразил этот код одинаково. И тут им на помощь приходит DOCTYPE.
Прежде чем переходить к различным вариантам DOCTYPE, я всё-таки отвечу на вопрос: «Зачем нужен DOCTYPE?«. А нужен он для того, чтобы браузеры правильно отображали разметку Вашего документа. Если Вы не укажите DOCTYPE, то браузер будет добавлять «отсебятину«, причём каждые браузеры будут добавлять свою «отсебятину«. В результате, ни о какой кроссбраузерности и речи идти не может.
Существует несколько вариантов DOCTYPE, однако, в реальности я Вам советую использовать один из двух вариантов:
Данный DOCTYPE означает, что документ соответствует стандарту HTML 4.01. Это самый частоиспользуемый вариант.
Однако, для любителей чистого кода (к коим отношусь я) советую использовать такой DOCTYPE:
Этот DOCTYPE сообщает браузеру о том, что документ соответствует стандарту XHTML 1.1. Именно этот DOCTYPE стоит на этом сайте.
И, напоследок, небольшое примечание, просто ради справедливости. Дело в том, что современные браузеры прекрасно отображают сайты и без использования DOCTYPE, причём выглядит сайт примерно везде одинаково, за исключением совсем мелких вещей. Поэтому Вы, конечно, обязательно пишите DOCTYPE, но не забывайте, что с каждым годом это требуется всё меньше и меньше.
Пока я писал эту статью, у меня в голове возникла мысль, что многие из Вас не знают разницу между HTML и XHTML. И почему, на мой взгляд, XHTML лучше? На эти вопросы я отвечу в следующей статье, так что не переключайтесь.
Если Вы хотите узнать больше по HTML, то посмотрите мой бесплатный курс с примером создания сайта на HTML: http://srs.myrusakov.ru/html
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
Комментарии ( 31 ):
а DOCTYPE в каждый html ставить надо?
Здравствуйте, я заметил, что когда пишешь код в самом начале. То перейдя на сайт видно, что таблицы, которые я писал ранее сократились, уменьшились в высоту, а в ширину остались такими же какими были. Как можно устранить эту проблему??
Это только в IE или в других браузерах тоже? Если только в IE, то насколько всё серьёзно? Если не очень, то лучше так и оставить, потому что решение будет очень кривое. А решение такое: Это в CSS: * < margin: 0; padding: 0; >table < border-collapse: collapse; height: 100%; >Также в style для
У меня firefox 4.0.1 я пока что не умею с CSS работать скоро перейду. Спасибо!
У вас ошибка «и смело завляю: нигде такой свободы» не завляю а заявляю.
Элемент DOCTYPE. Что это такое и зачем он нужен
Приветствую Вас, уважаемые читатели! Сегодня короткий материал о специальном теге doctype. В статье вы узнаете что такое doctype, зачем он нужен и какие бывают версии html-документов.
Что такое DOCTYPE и зачем он нужен
Элемент — DTD (document type definition, описание типа документа) указывает тип документа, который используется при написании html кода. Это непарный тег, который должен стоять самым первым в коде каждой страницы вашего сайта.
Директива doctype необходима, чтобы браузер понимал как обрабатывать текущую веб-страничку, так как существует несколько версий языка HTML, а еще имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), который похож на HTML, но различается с ним по синтаксису.
Поэтому если вы хотите, чтобы ваш сайт отображался одинаково красиво и ровно во всех популярных браузерах, то обязательно указывайте эту директиву с версией языка html, которую вы используете. Причем doctype следует указывать с общепринятыми правилами.
Основные типы документов
Ниже приведены основные типы документов:
DOCTYPE | Описание |
HTML 4.01 | |
Строгий синтаксис HTML | |
Переходный синтаксис HTML | |
В HTML-документе применяются фреймы | |
HTML 5 | |
XHTML 1.0 | |
Строгий синтаксис XHTML | |
Переходный синтаксис XHTML | |
XHTML-документе применяются фреймы | |
XHTML 1.1 |
Пример использования doctype для HTML5:
Что такое DOCTYPE и зачем он нужен?
Каждый, кто имеет дело с кодом, верстает или пока еще только учится верстать сайты, просто обязан знать о том, что в начале каждой HTML страницы перед тегом HTML должен стоять DOCTYPE.
Что такое DOCTYPE и зачем он нужен?
Строчка с DOCTYPE (Document Type Definition) в начале HTML страницы указывает на тип документа, который вы будете использовать при написании HTML кода для вашего сайта. Это непарный тег, то есть у него нет закрывающего тега.
Главным преимуществом использования DOCTYPE является то, что ваш сайт будет правильно работать и одинаково ровно и красиво смотреться во всех браузерах.
Какие существуют виды DOCTYPE?
Cуществует несколько видов DOCTYPE. Есть строгие виды (strict), которые работают на основе только определенных тегов, есть переходные (transitional), которые допускают возможность включения дополнительных тегов, есть такие, которые работают с фреймами (frameset).
Подробно в этой статье я не буду рассматривать каждый из них, так как это не является моей целью, просто перечислю:
Подробную информацию по каждому виду DOCTYPE вы можете найти в интернете, просто введя в поиск нужную фразу, поэтому останавливаться на этом мы не будем.
Итак, поехали дальше.
Что касается использования разных видов DOCTYPE, следует иметь ввиду, что если вы изначально писали свой сайт в одном DOCTYPE, то не рекомендуется его менять в будущем на какой-то другой, потому что могут возникнуть проблемы с правильным отображением сайта из-за того, что вместе со сменой DOCTYPE вы автоматически поменяете правила обработки тегов браузерами.
Когда вы выбираете тот или иной DOCTYPE, вы автоматически выбираете определенные правила, по которым должен анализироваться код в браузерах.
Поэтому DOCTYPE нужно выбирать для сайта, изначально хорошенько подумав, в соответствии с тем, какой вам будет нужен вид обработки HTML кода браузерами, и впоследствии уже его не менять.
Только представьте, сколько проблем раньше (почему раньше, объясню ниже в статье) несло верстальщику наличие нескольких видов DOCTYPE, между которыми приходилось постоянно выбирать, какой лучше использовать, и думать, не ошибся ли ты в своем выборе.
Можно ли вообще обойтись без DOCTYPE?
У тех, кто не любит заострять свое внимание на разных мелочах, может возникнуть вполне естественный вопрос: «А зачем мне все это нужно? Может, мне вообще не использовать DOCTYPE?»
Конечно, теоретически можно его и не указывать, но тогда вы сидите на пороховой бочке замедленного действия, не зная точно когда она рванет (а рванет она 100%).
Короче говоря, если вы не используете DOCTYPE совсем, то рискуете лицезреть созданный вами сайт не в самом приглядном виде в браузере, причем, в каждом браузере будут возникать разные проблемы с правильностью отображения, а решить все их вам будет, мягко говоря, сложновато.
Так что же делать, если не хочется во все это вникать в подробностях?
Преимущества использования DOCTYPE HTML5.
Хорошая новость состоит в том, что с выходом последней версии HTML5 (которая, кстати, все еще находится в процессе разработки, по некоторым данным окончательный стандартный вариант обещают предоставить в 2014 году) стало намного удобней выбирать DOCTYPE для своих сайтов.
Дело в том, что правила DOCTYPE HTML5 являются универсальными, включают в себя правила предыдущей версии, а также возможность работы с HTML 4 тегами и в какой-то степени с XHTML, и, насколько я понимаю, объединяют в себе возможности всех своих предшественников, адаптируя их для работы в новых браузерах.
Согласитесь, что намного проще запомнить такую короткую строчку, чем каждый раз напрягаться , пытаясь вспомнить или найти где-то длинный код, который должен быть написан при использовании других версий.
Что касается браузеров: как старые браузеры относятся к DOCTYPE HTML5? Не возникнут ли проблемы с этим?
По этому поводу хочу сказать, что:
Это значит, что если вы сегодня начнете создавать свои страницы на основе DOCTYPE HTML5, то можете быть уверены в том, что им обеспечена долгая жизнь.
Выводы.
Какой из всего вышесказанного мы можем сделать вывод?
Использовать DOCTYPE необходимо, если не хотите впоследствии решать всяческие проблемы, связанные с его отсутствием (нужны они вам? ).
И использовать лучше всего последнюю версию DOCTYPE HTML5.
Очевидно, что многое изменилось и продолжает меняться к лучшему в этом направлении. Все это делается для того, чтобы облегчить нам с вами жизнь и сделать нашу работу максимально удобной, что рисует довольно яркие картины в перспективе!
А потому желаю вам успехов!
ЗЫ: Комментировать статью никто не запрещал !