Элемент !DOCTYPE

Содержание

Элемент

необходимо ставить самым первым элементом в HTML документе, перед открывающим тегом (документ должен начинаться с DOCTYPE).

Синтаксис

Синтаксис doctype (упрощенно):

Разница в DOCTYPE для HTML 4.01 и HTML5

HTML5 не использует SGML как основу, и указывать DTD при его использовании не нужно.

Примеры DOCTYPE для популярных версий HTML

DOCTYPE HTML 5

DOCTYPE HTML 4.01 Strict

Поддерживает все актуальные для DTD HTML 4.01 элементы и атрибуты, не включая презентационные и устаревшие. Фреймсеты не допускаются.

DOCTYPE HTML 4.01 Transitional

Поддерживает все актуальные для DTD HTML 4.01 элементы и атрибуты, а также презентационные и устаревшие. Фреймсеты не допускаются.

DOCTYPE HTML 4.01 Frameset

Аналогичен HTML 4.01 Transitional. Разрешено использовать фреймсеты.

DOCTYPE XHTML 1.0 Strict

Поддерживает все актуальные для DTD HTML 4.01 элементы и атрибуты, не включая презентационные и устаревшие. Фреймсеты не допускаются. Необходимо, чтобы документ соответствовал стандартам XML.

DOCTYPE XHTML 1.0 Transitional

Поддерживает все актуальные для DTD HTML 4.01 элементы и атрибуты, а также презентационные и устаревшие. Фреймсеты не допускаются. Необходимо, чтобы документ соответствовал стандартам XML.

DOCTYPE XHTML 1.0 Frameset

Аналогичен XHTML 1.0 Transitional. Разрешено использовать фреймсеты.

DOCTYPE XHTML 1.1

Аналогичен XHTML 1.0 Strict. Есть возможность добавлять собственные модули.

Элемент

Определение должно быть самой первой вещью в вашем HTML документ, до Тега.

Определение не является HTML-тегом; Это инструкция для веб-браузера о том, что версия HTML страница написана на.

В HTML 4,01, определение относится к DTD, потому что HTML 4,01 был основан на SGML. DTD определяет правила для языка разметки, так что браузеры отображают содержимое правильно.

HTML5 не основан на SGML и поэтому не требует ссылки на DTD.

Совет: Всегда добавляйте объявление в HTML-документы, чтобы Браузер знал, какого типа документ ожидать.

Поддержка браузера

Элемент
Да Да Да Да Да

Различия между HTML 4,01 и HTML5

Существует три различных объявления в HTML 4,01. В HTML5 есть только один:

HTML тег DOCTYPE

С декларации должен начинаться любой HTML документ. Эта декларация должна располагаться перед тегом .

В действительности декларация не является тегом HTML. Это специальная инструкция для браузера, информирующая его о том, какая версия HTML используется на данной странице.

В HTML 4.01 декларация ссылается на DTD (определение типа документа, которое задает синтаксис конструкций разметки), так как HTML 4.01 базируется на SGML (стандартный обобщённый язык разметки). DTD определяет правила для языка разметки, благодаря этому браузер корректно отображает контент страницы.

HTML5 не базируется на SGML и поэтому ему не нужно ссылаться на DTD.

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

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

Декларация должна быть в точности такая, как в примере (включая написание заглавными буквами слова ‘DOCTYPE’). В отличие от других тегов этот тег не закрывается.

Разница между HTML 4.01 и HTML5

В HTML 4.01 существует три разновидности декларации . В HTML5 есть только один вид декларации.

HTML 5

HTML 4.01 Strict

Эта DTD содержит все HTML элементы и атрибуты, ИСКЛЮЧАЯ запрещенные элементы и элементы представления (вроде элемента font). Использование фреймов не допускается.

HTML 4.01 Transitional

Эта DTD содержит все HTML элементы и атрибуты, ВКЛЮЧАЯ запрещенные элементы и элементы представления (вроде элемента font). Использование фреймов не допускается.

HTML 4.01 Frameset

Эта DTD аналогична HTML 4.01 Transitional, при этом допускается использование фреймового контента.

XHTML 1.0 Strict

Эта DTD содержит все HTML элементы и атрибуты, ИСКЛЮЧАЯ запрещенные элементы и элементы представления (вроде элемента font). Использование фреймов не допускается. При этом разметка должна соответствовать правилам XML.

XHTML 1.0 Transitional

Эта DTD содержит все HTML элементы и атрибуты, ВКЛЮЧАЯ запрещенные элементы и элементы представления (вроде элемента font). Использование фреймов не допускается. При этом разметка должна соответствовать правилам XML.

XHTML 1.0 Frameset

Эта DTD аналогична XHTML 1.0 Transitional, при этом допускается использование фреймового контента.

XHTML 1.1

Эта DTD аналогична XHTML 1.0 Strict, при этом можно добавлять различные модули (например, для предоставления поддержки восточно-азиатских языков).

HTML пример

Декларация HTML документа по стандарту HTML5:

Doctype HTML — что это? Что нужно знать об элементе

Что бы ни говорили скептики, прогресс по-прежнему остается явлением, остановить которое невозможно. Однако, в то время как одни возмущаются затянувшимся переездом на лунные дачи, другие буквально погружаются в панику, ибо поспеть за изменениями становится все сложнее и сложнее. Примером подобные «догоняющих» являются представители профессий, связанных с высокими технологиями.

В то время как большинство веб-дизайнеров, программистов и верстальщиков гораздо лучше соответствуют духу времени, нежели какая-нибудь «баба Нюра», которая получает информацию с недельным запозданием, да еще и со значительными искажениями, реальное положение вещей оказывается несколько иным. Соответствовать уровню прогресса в сфере новых технологий довольно сложно. Рассмотрим простой пример: еще каких-то 5-10 лет назад разработчик онлайн-игр на Adobe Flash мог бы достичь ощутимого успеха, многочисленные «Веселые фермеры» являются тому подтверждением. Однако уже сегодня данная технология постепенно отмирает, уступая место более современному, но менее изученному основным большинством HTML5. К слову, именно HTML5 и является одним из «персонажей» нашей сегодняшней истории, посвященной будням HTML-верстальщиков.

Doctype HTML — что это такое?

Это высокотехнологичный памятник жертвам прогресса технологий. Лихие 90-е, которые отличились не только «боевой» обстановкой в нашей стране, но и вполне себе настоящей войной браузеров, принесли в мир сразу несколько продуктов, которые позволяли пользователям компьютеров бороздить просторы всемирной сети. Вот только есть одна загвоздка – популярные тогда Netscape Navigator и Internet Explorer смотрели на одни и те же страницы совершенно по-разному, соответственно, и создатели сайтов создавали абсолютно разные страницы для данных программ.

Стандарты? В те годы о них говорить было бессмысленно – W3C существовала в зачаточном состоянии, а продвигавшая свой IE Microsoft вообще славилась тем, что предпочитала изобретать свои собственные, не совместимые ни с чем велосипеды. Тем не менее к концу того жуткого (для веб-разработчиков) десятилетия ситуация все-таки нормализовалась: появилось некое подобие стандартов, которые пусть и не полностью, но все-таки соблюдались всеми популярными браузерами.

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

Тем не менее время шло, разработчики все-таки наконец решили задуматься не только о конкурентной борьбе, но и о веб-мастерах, и появился он – Doctype HTML. Это специальный тэг, рассказывающий браузеру о том, как именно следует рассматривать ту или иную страницу.

Для чего нужен Doctype в HTML-коде?

До появления адекватных стандартов, которым начали следовать повсеместно, многие разработчики браузеров старались перетянуть одеяло на себя, создавая собственные методы подхода к той или иной технологии. В результате одна и та же страница выглядела в разных браузерах по-разному. Впрочем, об этом мы уже рассказывали, вот только не упомянули о том, что, когда производители программ для веб-серфинга опомнились, возникла другая, не менее занятная проблема.

Представьте ситуацию: вы – типичный веб-разработчик конца 90-х годов. Так уж вышло, что большую часть времени вы проводите в браузере Internet Explorer 4. Внезапно Microsoft решает одуматься и делает свой новый браузер более «правильным», в результате чего становится не совсем ясно, как теперь писать сайты и что делать с теми, которые уже созданы. Естественно, если у вас есть достаточное количество времени, вы могли бы переписать свой HTML-код таким образом, чтобы он соответствовал новым стандартам, но ведь люди – ленивые существа.

Именно в этот момент Doctype HTML оказывается наиболее уместным «изобретением». В зависимости от того, какой именно тип документа указан в начале страницы, браузер будет выбирать наиболее подходящий для данного случая механизм отрисовки. Если же Doctype в HTML-коде отсутствует, браузер уйдет в режим совместимости (как правило, но вовсе не обязательно). В результате тот же Internet Explorer 6 (пусть архив ему будет пухом) при отсутствии тега Doctype ведет себя так, словно вы работаете в его четвертой версии.

Виды Doctype

Тег Doctype насчитывает несколько разновидностей, которые можно разделить на определенные категории. Во-первых, он описывает основные типы языка разметки: HTML 4.01, HTML 5, XHTML 1.0 или XHTML 1.1. Во-вторых, каждый из этих языков имеет свои подразделы, указывающие на «коэффициент придирчивости», т. е. на то, как жестко следует HTML-код установленным W3C стандартам. Правда, во втором случае есть два исключения – HTML5 и XHTML 1.1 не имеют каких-либо подвидов и имеют только одну форму Doctype HTML. Но об этом чуть позже…

Строгий подход: Doctype Strict

Если вы предпочитаете создавать HTML-код, соответствующий каждой букве закона валидатора, то дополнительным стимулом (помимо собственной заинтересованности) может стать использование Doctype Strict. Если же вы планируете использовать более продвинутый XHTML 1.0, то строчка, с которой будет начинаться каждый элемент, должна выглядеть так:

Кроме того, целый ряд тегов, позволяющих форматировать текст, также желательно исключить – строгий режим подразумевает использование CSS.

Человечный подход: Doctype Transitional

«Мягкий» Doctype HTML 4 объявляется следующим образом:

Для XHTML строка вновь выглядит несколько иначе, однако общая тенденция сохраняется:

От общего к частному: Doctype Frameset

Подход при проверке страницы на соответствие шаблону Frameset в целом аналогичен таковому у Transitional, однако, помимо перечисленных выше «вольностей», данный шаблон дает вам возможность использовать фреймы. Других отличий Frameset не имеет, поэтому остается лишь перечислить строки для объявлений, для HTML 4.01 и для XHTML 1.0:

На острие прогресса

Прочие разновидности Doctype

На сегодняшний день существует еще несколько разновидностей шаблонов Doctype, большая часть которых касается XHTML. В то время как вторая версия данного языка разметки так и не вышла в свет, став частью вышеупомянутого HTML5, вариации ее первой версии, несмотря на не самую высокую распространенность, живы и здравствуют.

Так ли важен Doctype?

Возможно, некоторые начинающие «писатели» на HTML будут пытаться игнорировать объявление типа страницы. Что ж, если они не вынесли важной информации из вышенаписанного, приведем один простой пример. Вот пример страницы, использующей Transitional-шаблон:

Надеемся, данный пример достаточно доступно объясняет всю важность вышенаписанного, поэтому нам остается лишь сохранять внимательность или, в идеальном случае, учиться писать код, проходящий strict-валидацию. Успехов вам!

Что такое DOCTYPE и зачем он нужен ?

Как вы заметили в исходный код любой страницы из интернета, в первой строчке написан элемент . Он нужен для того что бы указать браузеру тип текущего документа и как следует его интерпретировать. С английского языка сокращенно это будет DTD ( расшифровывается как “ Document type definition “, что в переводе означает описание типа документа ). Как вам известно, существуют разные версии языка HTML: 3.2 , 4.01, 5.

Основная версия это HTML 4.01, для нее существуют 2 элемента DOCTYPE, но в последнее время становится актуальнее версия HTML5, т.к. она более расширена, в ней добавлены новые теги и соответственно больше возможностей, для этой версий есть только один элемент Doctype. Также существует расширенный язык разметки гипертекста, с названием XHTML (EXtensible HyperText Markup Language ), который различается от HTML только по синтаксису, у него более строгий. В остальном они похожи.

Ниже приведены основные элементы DOCTYPE:

Для HTML 4.01

Используется для строгого синтаксиса HTML

В этой версий запрещается использовать старые теги. В случае если вы где то используйте подобные теги, то браузер не поймет как их отобразить.

Переходный синтаксис HTML

В этой версий разрешается использовать как старые так и новые теги, которые появились в HTML 4.01.

Указывает браузеру что в HTML документе используется фреймы

Это версия довольно старая и она уже практически не применяется, так как фреймы давно устарели.

Для HTML 5

Эту версию можно задать для всех типов документов. Основной плюс в ее синтаксисе в том что он очень короткий и легко запоминается.

Для XHTML 1.0

Строгий синтаксис XHTML.

Переходный синтаксис XHTML.

В документе написанный на XHTML содержится фреймы

Для XHTML 1.1

Только один Синтаксис со строгими правилами.

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

Вот и все что я хотел вам рассказать о элементе DOCTYPE.

Похожие статьи:

Видео по теме:

Понравилась статья?

Тогда поделитесь ею с друзьями и подпишитесь на новые интересные статьи.

Поделиться с друзьями:

Подписаться на новые статьи:

Поддержите пожалуйста мой проект!

Если у Вас есть какие-то вопросы или предложения, то можете писать их в комментариях или мне на почту sergiu1607@gmail.com. И если Вы заметили какую-то ошибку в статье, то прошу Вас, сообщите мне об этом, и в ближайшее время я всё исправлю.

Автор статьи: Мунтян Сергей

Копирование материалов с сайта sozdatisite.ru ЗАПРЕЩЕНО.

Дата добавления: 2014-01-22 00:46:35

Тег Doctype — просто о важном

Только представьте: вы создаете страницу сайта, все делаете по правилам, однако ваш браузер некорректно отображает всю ту информацию, которую вы разместили на вашей странице. С чем это может быть связано?

Некорректное отображение данных, представленных на веб-странице, обуславливается в первую очередь тем, что браузер неправильно определяет тип документа, размещенного на странице – DTD .

В свою очередь это может быть вызвано только тем, что вы использовали неверный заголовок для кода. Для правильного определения типа DTD сегодня существует специальный тег под названием Doctype .

Не лишним будет упомянуть о том, что данный тег имеет достаточно долгую историю. Он был разработан в то время, когда создали Internet Explorer 5 для MacOS и столкнулись с определенными трудностями чтения некоторых страниц.

Дело в том, что новая (по тем временам) версия браузера превзошла все ожидания и просто перестала отображать старые страницы сайтов надлежащим образом. И поэтому, старые страницы, не имевшие в коде на тот момент данного тега, были оснащены Doctype , стоящим перед элементом html .

Почему необходимо указывать именно Doctype?

Как уже было сказано выше, данный тег вставляют в код любого веб-документа для правильного определения его типа. Указание типа документа требуется в первую очередь потому, что сегодня существует сразу несколько версий HTML документов, написанных на разных языках. В том числе существует и расширенная версия – XHTML.

Пример тега Doctype:

Разновидности тега Doctype

Сегодня существует несколько вариантов данного тега, которые используется для разных версий веб-документов:

    Doctype HTML 4.01. Код с использованием данного тега выглядит следующим образом:

В данном случае используется строгий html:

  • Переходные версии Doctype HTML 4.01.
  • HTML5 Doctype выглядит таким образом . Этот тег подходит для любых документов.

Что произойдет, если использовать старые версии тега Doctype?

Значение тега Doctype очень важно, так как именно он позволяет работать всем веб-страницам в соответствии с указанным стандартом.

В том случае, если вы будете использовать неполную версию тега, некорректно его вставите или же не будете использовать его в коде и вовсе, то ваш браузер автоматически перейдет в « загадочный » режим.

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

На сегодняшний день только браузер Opera старается отображать страницы таким образом, как если бы они соответствовали всем стандартам, независимо от того, был ли использован тег Doctype или же нет.

Однако, стоит отметить, что данный браузер пока не полностью поддерживает все стандарты W3C DOM , но работы над этим уже ведутся.

Где можно взять качественный тег Doctype?

Если вы хотите получить и использовать правильный тег Doctype, то вы можете воспользоваться сервисом www.w3.org , что и делают сегодня большинство веб-мастеров.

Здесь вы можете взять DOCTYPE HTML PUBLIC , который потребуется для определения веб-документов типа HTML 4.01 , а также Doctype HTML 5 и многие другие типы тегов, необходимые для создания страниц, соответствующих стандартам.

Пример использования тега для HTML 5 , взятого с www.w3.org :

Надеюсь, что данная статья оказалась для Вас полезной! Удачи!

Элемент !DOCTYPE в HTML

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

Версий гипертекстовой разметки существует несколько, чтобы браузер мог определить, какую именно версию вы использовали в коде страницы, применяется тег . Данный элемент указывает тип текущего документа и помогает браузерам «понять», с использованием какого стандарта следует отображать страничку. Прописывается в самом начале — в первой строчке кода создаваемого документа HTML. Если вы случайно забудете проставить данный тег (или при неправильном использовании) вашу, с таким трудом созданную, веб-страничку браузеры будут игнорировать, отображать неправильно или тратить много времени на то, чтобы «прочитать» написанный код.

История появления элемента

В процессе развития и совершенствования HTML разработчики, пытаясь облегчить себе работу, придумывали различные варианты верстки документов. Создание технологии CSS помогло в значительной мере навести порядок в коде, ведь всю информацию о внешнем виде создаваемого сайта (шрифт, цвет и т.д.) стали выносить в отдельный файл. Данное обстоятельство позволило избежать путаницы и «облегчить» вес будущей странички, так как отпала необходимость постоянно повторять код — достаточно указать CSS-файл, где прописан стиль для одинаковых блоков.

В HTML 4.01 теперь используются CSS-стили для отображения внешнего вида, а использовать HTML для различных манипуляций с отображением запрещено. Но развитие не стоит на месте — разработчики из W3C решили, что необходимо придумать что-то грандиозное и универсальное. Так появился новый XHTML стандарт, представляющий из себя HTML в котором используются принципы XML. В организации W3C подумали — и решили, что если XML, представляющий из себя простой текстовый файл, в котором прописаны структурированные данные, может проанализировать и прочитать любая операционная система, значить будущее за этим стандартом.

В своих планах разработчики представляли, что создадут язык разметки, в который можно будет добавлять новые теги и который сможет «прочитать» практически любое устройство. После XHTML 1.0, выпустили стандарт XHTML 2.0, который также забросили, посчитав неперспективным направлением. Теперь W3C переключилась на HTML 5, который должен наконец-то оправдать надежды, благодаря семантическим тегам, и в значительной мере улучшить веб-разработку.

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

Именно для этого и предназначен тег«показывать» всем браузерам, с помощью какого стандарта следует открывать определенную страницу. Наиболее часто используются строгая(Strict) и переходная(Transitional) гипертекстовая разметка, но существует также Frameset(фреймовая).

Директивы комментариев и Doctype в Html коде, а так же понятие блочных и строчных элементов (тэгов)

Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Я хочу продолжить рассказывать об основах работы с Html с самого начала, последовательно и ничего не опуская. Сегодня мы поговорим о специальном теге (декларации) Doctype, узнаем как правильно оформлять комментарии в ХТМЛ коде, как прописывать заголовок веб документа Title и постараемся разобраться в отличиях блочных и строчных элементах.

В предыдущей статье из рубрики Html для чайников (в которой в основном рассказывалось про то, что такое язык ХТМЛ, тэги и валидатор W3C) мы закончили на том, что любой документ в интернете должен иметь определенную структуру.

Директива Doctype для Html, Xhtml и ХТМЛ 5

Первым элементом языка разметки, который вы встретите в любом правильном Web документе (странице сайта), будет специальная директива Doctype. Она начинается с угловой скобки и проставленного сразу же за ней восклицательного знака . В этой статье кроме нее мы еще рассмотрим декларацию, которая называется комментарий.

Сам по себе элемент Doctype служит для объявления типа данного документа и помогает браузеру понять, на какую версию Html или XHTML (по классификации валидатора W3C) ему следует опираться при разборе кода загружаемой веб страницы.

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

Но давайте на этом остановимся чуть поподробнее. Сейчас мы с вами наблюдаем некий дуализм или же два типа документов в сети — как делали раньше до выделения CSS из лона языка ХТМЛ и как делают сейчас по принятым современным стандартам.

Естественно, что после принятия новых стандартов в сети интернет оставалось все равно огромное множество документов, созданных по старым принципам чистого ХТМЛ (без CSS) и браузеры должны были с ними как то работать. Корпорация Майкрософт в свое время предложила использовать эту самую директиву Doctype из нового языка разметки XML.

Выглядеть она может по разному (читайте об этом ниже), но проще всего использовать такой вариант (чуть ниже по тексту объясню почему):

Таким образом браузер будет понимать, по каким именно стандартам ему разбирать код документа. Если данная декларация имеет место быть, то браузер переходит в режим работы по стандартам (standarts mode). Если же ее браузер не найдет в самом начале документа (или она будет не соответствовать правильному варианту написания), то тогда браузер включит хитрый режим уловок (quirks mode).

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

Правда, понятие старого браузера очень уж расплывчатое. Все тот же лидер по скорости работы и скорости западания в сердца пользователей Google Chrome появился-то только в 2008 году.

У IE (тут можно скачать последнюю версию Эксплорера и не пожалеть) история гораздо более долгая, именно поэтому все браузеры в режиме quirks mode (уловок, т.е. когда декларация не была прописана) будут отображать вебстраницу точно так же, как это бы делал старинный IE версии 5.5 (она считается базовой).

Более подробно и на конкретном примере узнать о том, почему обязательно нужно прописывать Doctype в начале любого веб документа, вы сможете из этой статьи про CSS свойства height, width и overflow. На самом деле поучительно.

Хотя, если вы создаете свой проект на базе какого-либо движка или другими словами CMS, то за правильность формирования этой декларации будет отвечать используемый вами движок, но знать назначение Doctype и варианты его написания все равно лишним, на мой взгляд, не будет.

Выглядеть это дело может, например, так:

Если вы читали мою предыдущую статью, то, наверное, поняли, что данная директива в этом случае указывает браузеру на то, что код данного документа нужно будет разбирать, опираясь на стандарты языка HTML 4.01. Для поиска нужного вам варианта вы можете обратиться к описанному в предыдущей статье валидатору W3C, но чтобы там найти что нибудь, нужно точно знать где это лежит, иначе.

Сайт валидатора W3C не обладает дружественным интерфейсом и интуитивно понятной навигацией. Там вы запросто можете найти вариант директивы с относительной ссылкой на страницу с описанием нужного вам стандарта ХТМЛ или XHTML и, вставив такой вариант к себе на сайт, ничего хорошего не получите:

При таком варианте Doctype браузер будет искать документ с описанием стандарта на вашем собственном сайте, добавив к относительной ссылке «TR/html4/strict.dtd» доменное имя вашего ресурса: «https://ktonanovenkogo.ru/TR/html4/strict.dtd».

В общем, такая директива работать не будет и в будущем следует обращать особое внимание на наличие «http://www.w3.org/» в ее коде, чтобы не наступить на подобные грабли.

В общем-то существует всего лишь несколько вариантов DOCTYPE для Html и еще несколько для XHTML. Все эти варианты вы сможете посмотреть на соответствующей странице валидатора W3C.

Давайте начнем со стандарта языка гипертекстовой разметки 4.01 (ХТМЛ 5 пока что еще только разрабатывается). Для этого случая существует три варианта Doctype: строгий, переходный и с поддержкой фреймов:

Чаще всего используют второй вариант (Transitional), т.к. он допускает больше вольностей в написании кода документа, ну, а вариант с фреймами вам вряд ли пригодится, в силу неактуальности их использования на сегодняшний день.

Собственно, имеются такие же три варианта Doctype для XHTML — строгий, переходный и с поддержкой фреймов:

Но давайте посмотрим откуда берутся эти варианты правильного написания декларации. Помните, мы в первой статье рассматривали таблицу допустимых Html тэгов:

И отдельную таблицу возможных Html атрибутов:

Как вы можете видеть, в обеих этих таблицах присутствует столбец «Depr», в котором буквой «D» помечены устаревшие и не рекомендуемые к применению теги и атрибуты языка ХТМЛ. Это мы с вами уже рассмотрели. Но обратите внимание, что напротив каждой буквы «D» в соседнем справа столбце «DTD» стоит либо буква «L» (Loose DTD), либо буква «F» (Frameset DTD).

Т.о. все теги и атрибуты, которые не помечены буквами «D» (не рекомендуемые) входят в строгую декорацию Doctype (только рекомендованные элементы и ничего более). Если же вы все-таки будете допускать использование не рекомендованных тегов и атрибутов языка Html (они помечены литерой «D»), то нужно будет объявлять для таких документов декларацию переходную.

Некоторые элементы и атрибуты, помеченные в столбце «DTD» буквой «F» (например, FRAME, FRAMESET), будут входить в декларацию Doctype для фреймовых структур. Она базируется на основе переходной, к которой добавляются теги и атрибуты для создания фреймов, о которых вы можете почитать по приведенной ссылке.

А теперь давайте попробуем разобраться, а из каких частей состоит декларация Doctype?

Сначала идет название — «Doctype». Тут, думаю, все понятно. Дальше идет «Html» — корневой элемент данного языка разметки. Затем идет указание — публичная данная декларация или же системная. Все варианты Doctype являются публичными, что обозначается словом «PUBLIC».

А дальше идут два идентификатора документа. Первый из них называется публичным идентификатором («-//W3C//DTD HTML 4.01//EN»). Минус означает то, что данная декларация не зарегистрирована в стандарте ИСО. Затем следует название консорциума, ее название и язык, на котором она написана. Во втором идентификаторе указывается путь до файла строгого варианта.

Ну, а теперь давайте раскрою вам всю правду про Doctype. Браузерам важно только формально правильное ее написание, но они ни в коем разе не полезут на сайт консорциума, чтобы скачать указанный в ней файл.

Даже если вы выберите вариант строгой декларации и при этом будете использовать не рекомендуемые в современной версии Html теги и атрибуты, то любой браузер все равно вас правильно поймет — это факт проверенный и подтвержденный.

Поэтому, чтобы не мудрствовать лукаво, в Html 5 написание Doctype будет выглядеть уже вот так:

И все. Оставили только «Html». И несмотря на то, что ХТМЛ 5 еще не полностью внедрен, данный вариант поддерживается всеми современными браузерами и вы можете смело им пользоваться. О как, а вы говорите.

Html комментарии в исходном коде страницы и тег Title

В служебной области Web документа (между тэгами Head) обязательно должен быть прописан заголовок этого самого документа (веб страницы), заключенный в элементы Title (см. на приведенном рисунке).

Переоценить значимость заключенной в нем информации очень трудно (я не преувеличиваю). Когда вы будет подбирать ключевые слова в Яндекс Wordstat (используя для этого статистику поисковых запросов Яндекса), то после составления семантического ядра вам обязательно нужно будет упомянуть выбранные ключевые слова в заголовке Title.

Про то, насколько важны слова заключенные в Тайтле для будущего успешного продвижения проекта, вы можете узнать из статьи Как раскрутить сайт самому, а про то, как прописать нужные вам слова в Title для Joomla и WordPress, вы узнаете из статьи Самостоятельное продвижение, оптимизация и раскрутка сайта.

Содержимое метатега Title будет отображаться вверху окна браузера пользователя и в поисковой выдаче Google и Яндекса, поэтому, помимо содержания в нем ключевых слов, он должен стимулировать пользователей перейти именно на ваш сайт из поисковой выдачи. Для каждой страницы вашего ресурса заголовок тайтл должен быть уникальным, иначе будет ухудшение в ранжировании вашего проекта.

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

Особенно актуальны комментарии в Html были во времена господства табличной верстки (читайте про ХТМЛ таблицы), ибо тогда, по сравнению с современной блочной версткой (тут описана Div верстка на примере), очень просто было запутаться, что и в какой ячейке таблицы выводится:

Наверное, из приведенного выше примера вы уже поняли, что все комментарии в языке Html начинаются точно так же, как и любые другие элементы — с угловой скобки, но сразу же после нее, при формировании комментария, нужно будет поставить восклицательный знак (при описании Doctype я упоминал, что комментарии тоже являются декларациями, которые обязательно начинаются с ) и два дефиса, а перед закрывающей угловой скобкой комментария нужно будет поставить еще пару дефисов:

Весь текст комментария, который будет находиться между этими двойными дефисами, будет рассматриваться браузерами как служебная информация и никак обрабатываться не будет. Корректность его написания можно наглядно оценить при использовании описанного тут Html редактора notepad с подсветкой кода:

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

Все довольно просто и думаю, что с ними у вас проблем не возникнет. Хотя есть одна тонкость в работе с многострочными комментариями в ХТМЛ. Внутрь одного комментария нельзя помещать другой, иначе часть закомментированной информации может быть отображена браузером на веб странице. Давайте для примера рассмотрим такую конструкцию:

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

В принципе, если вы пользуетесь при написании Html кода редактором с подсветкой, то сразу же заметите неладное по изменению цвета вашего комментария:

Понятие блочных и строчных элементов (тегов) в Html

Все теги, которые возможно использовать внутри элементов Body (то, что отображается на веб странице и список которых вы можете найти в валидаторе W3C), можно разделить на две группы: строчные и блочные теги.

Блочные элементы используются для построения структуры Web документа, а строчные используются для оформления кусков текста (строк). Причем, всегда нужно соблюдать одно незыблемое правило — не заключать внутрь строчных блочные теги.

Самыми яркими и показательными представителями строчных и блочных тэгов являются, соответственно, Div (блочный элемент — отсюда и пошло название блочной верстки) и Span (строчный). Эти теги языка гипертекстовой разметки являются парными, т.е. у них есть открывающий и закрывающий тэг.

Вообще, теги Div и Span не имеют абсолютно никакого предназначения и смысла в чистом Html без использования таблиц каскадных стилей CSS. Они являются контейнерами, позволяющими изменять свойства заключенных в нем элементов через CSS.

Если вы пропишите в исходном коде страницы подряд несколько элементов Div, то на веб странице каждый из них, скорее всего, попытается занять все доступное ему пространство по ширине, и поэтому расположены такие контейнеры будут друг под другом. Контейнеры Div при нормальных условиях рядом друг с другом стоять не будут, если принудительно не заставить их делать это.

Например, такой вот Html код будет отображаться в трех блоках расположенных друг под другом:

В браузере Firefox наряду с очень полезным плагином Firebug я еще использую плагин Web developer, который очень помогает при верстке. Среди всего прочего он может показывать блочные элементы, обводя их рамочкой. Именно этот плагин developer создал синие рамочки вокруг контейнеров Div на приведенном скриншоте.

В теги же Span можно заключать куски текста (строки) Html кода для придания им определенных свойств через CSS, и такие элементы могут размещаться в одной строке рядом друг с другом. Например, такой вот код в браузере будет иметь следующий вид:

Содержимое Span здесь тоже было подсвечено с помощью плагина Web developer. Т.к. элементы Span являются строчными, то не следует внутрь них заключать блочные теги, например, все те же Div контейнеры.

Доктайп в html. Тег DOCTYPE.

Каждая html-страница в идеале должна начинатся с определения доктайпа документа (doctype — document type declaration или dtd). Очень часто встречаются сайты без определения этого самого доктайпа. И это очень плохо, так как он имеет важную роль.

При создании нового сайта лучше сразу определять doctype и в будущем его не трогать.

Доктайп сообщает браузеру данные о языке, на котором написан документ: тип языка(html/xhml), версию(html 4.1/xhtml 1.0), направление(strict, transitional, frameset). Каждый браузер по своим правилам строит страницу и для разных браузеров страница может выглядеть по разному. Опередяя доктайп вначале страницы мы указываем браузеру, чтобы он строил страницу по определенным стандартам, которые описаны W3C на их официальном сайте. W3C — это специальная организация, которая определяет стандарты для структуры кода сайтов и считается хорошим тоном для разработчиков следовать этим стандартам. На их сайте есть специальные валидаторы, вписав в которые адрес страницы, можно узнать какие ошибки и отклонения от стандартов на ней есть (Это касается, как HTML, так и CSS).

Доктайп (DOCTYPE) — указывает браузеру на основании каких стандартов разрабатывалась страница, чтобы он правильно ее отображал.

Для его определения в html есть специальный тег , который имеет свою структуру.

Теперь подробнее о каждом из параметров этого тэга:

Элемент верхнего уровня — указывает элемент верхнего уровня в документе, для HTML это тег .

Публичность — объект является публичным (значениеPUBLIC) или системным ресурсом (значениеSYSTEM), например, таким как локальный файл. Для HTML/XHTML указывается значениеPUBLIC.

Регистрация — сообщает, что разработчик DTD зарегистрирован в международной организации по стандартизации (International Organization for Standardization, ISO). Принимает одно из двух значений: плюс (+) — разработчик зарегистрирован в ISO и — (минус) — разработчик не зарегистрирован. Для W3C значение ставится «-».

Организация — уникальное название организации, разработавшей DTD. Официально HTML/XHTML публикуетW3C, это название и пишется в .

Тип — тип описываемого документа. Для HTML/XHTML значение указываетсяDTD.

Имя — уникальное имя документа для описания DTD.

Язык — язык, на котором написан текст для описания объекта. Содержит две буквы, пишется в верхнем регистре. Для документа HTML/XHTML указывается английский язык (EN).

DOCTYPE. Для чего и как он устроен?

-это элемент предназначенный, для типа будущего документа ( в частности HTML и XHTML). Абвиотура DTD-что в переводе означает (document type definition) описание е типа документа. Этот элемент необходим для того, что бы браузеры могли понимать, как им следует видеть и отображать будущий документ, веб страницу.
На данном этапе веб разработок существует несколько видов элемента . Ниже в таблице №1, предоставлены несколько основных типов этого элемента и их краткое описание.

Таблица №1

Вид элемента
Краткое описание
Тип строгий синтаксис HTML.
Тип переходный синтаксис HTML.
Указывает на то, что в HTML-документе применяются фреймы.
Для всех документов.
Тип строгий синтаксис XHTML.
Тип переходный синтаксис XHTML.
Указывает на то, что документ написан на XHTML и содержит фреймы.
Разработчики XHTML 1.1 предполагают, что он постепенно вытеснит HTML. Никакого деления на виды это определение не имеет, синтаксис один и подчиняется четким правилам.

Разберём по порядку устройство строки с элементом .

Элементверхнегоуровня ][ Публичность ]»[ Регистрация] //[ Организация ]//[ Тип ][ Имя ]//[ Язык ]» «[ URL ]»>

тип будущего документа.

Элемент верхнего уровня — указывает элемент верхнего уровня в документе, для HTML это тег .

Публичность — объект является публичным (значение PUBLIC) или системным ресурсом (значение SYSTEM), например, таким как локальный файл. Для HTML/XHTML указывается значение PUBLIC.

Регистрация — сообщает, что разработчик DTD зарегистрирован в международной организации по стандартизации (International Organization for Standardization, ISO). Принимает одно из двух значений: плюс (+) — разработчик зарегистрирован в ISO и — (минус) — разработчик не зарегистрирован. Для W3C значение ставится «-».

Организация — уникальное название организации, разработавшей DTD. Официально HTML/XHTML публикует W3C, это название и пишется в .

Тип — тип описываемого документа. Для HTML/XHTML значение указывается DTD.

Имя — уникальное имя документа для описания DTD.

Язык — язык, на котором написан текст для описания объекта. Содержит две буквы, пишется в верхнем регистре. Для документа HTML/XHTML указывается английский язык (EN).

URL — адрес документа с DTD.

Вот, пожалуй, основной принцип, устройства и действия данного элемента ..
Закрывающий тег для данного элемента не требуется.
В качестве примера приведён HTML 4.01:

Илон Маск рекомендует:  Использование rtti в приложениях на базе vcl
Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL