Доктайп

24.06.2011

Влад Мержевич

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

Строгий доктайп

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

Для HTML 4.01:

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

Для XHTML 1.0:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

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

Осуждается использование следующих тегов: <applet>, <basefont>, <center>, <dir>, <font>, <isindex>, <noframes>, <plaintext>, <s>, <strike>, <u>, <xmp>. Взамен по возможности рекомендуется использовать стили.
Текст, изображения и элементы форм нельзя напрямую добавлять в <body>, эти элементы должны обязательно находиться внутри блочных элементов вроде <p> или <div>.
Осуждается применение атрибутов target, start (тег <ol>), type (теги <li>, <ol>, <ul>) и др.

Естественно, также должен соблюдаться синтаксис языка — правильное вложение тегов, закрытие тегов, должны присутствовать обязательные теги и др. Документ с неявными ошибками приведён в примере 1.9.

Пример 1.9. Невалидный код HTML

HTML 4.01IECrOpSaFx

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>Заголовок</title>
 </head>
 <body>
  <form>
   <input type="text">
  </form>
 </body>
</html>

В данном примере у тега <form> нет обязательного атрибута action, тег <input> располагается напрямую внутри формы, хотя должен быть заключён в блочный тег. Также не указана кодировка через метатег. Это не является ошибкой, но пользователям в некоторых случаях придется самостоятельно указывать её в браузере. Валидный код XHTML с учётом исправленных ошибок при строгом доктайпе продемонстрирован в примере 1.10.

Пример 1.10. Валидный код XHTML

XHTML 1.0IECrOpSaFx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Заголовок</title>
 </head>
 <body>
  <form action="">
   <p><input type="text" /></p>
  </form>
 </body>
</html>

Переходный доктайп

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

Для HTML 4.01:

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

Для XHTML 1.0:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Цель переходного доктайпа заключается в постепенном знакомстве с синтаксисом языка. Сразу использовать строгий синтаксис кому-то покажется слишком сложным, для таких людей и предназначен переходный HTML и XHTML. К тому же некоторые привычные вещи в строгой версии оказались под запретом, поэтому переходный доктайп покажется панацеей для тех, кто не может отказаться от старых привычек. Речь, к примеру, идёт об атрибуте target, который позволяет открывать ссылку в новом окне. Использование target осуждается, в том числе из-за системы вкладок, ставших стандартом де-факто в браузерах. Одному пользователю нравится открывать ссылку в текущем окне, другому в новой вкладке, а третьему в новом окне. Чтобы поведение ссылки не зависело от прихоти разработчика, атрибут target запрещен при строгом доктайпе. При переходном доктайпе добавление target к тегу <a> абсолютно валидно (пример 1.11).

Пример 1.11. Использование переходного доктайпа

XHTML 1.0IECrOpSaFx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Ссылка в новом окне</title>
 </head>
 <body>
  <a href="http://htmlbook.ru" target="_blank">Открыть в новом окне</a>
 </body>
</html>

Фреймы

Применяется во фреймовой структуре в документе, по синтаксису аналогичен переходному доктайпу.

Для HTML 4.01:

<!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 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Данный доктайп применяется только для главного документа, формирующего структуру фреймов с помощью тегов <frameset> и <frame> (пример 1.12).

Пример 1.12. Использование фреймов

XHTML 1.0IECrOpSaFx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Фреймы</title>
 </head>
 <frameset rows="*,80" cols="*">
  <frameset cols="80,*">
   <frame src="left.html" name="leftFrame" scrolling="no" 
     noresize="noresize" />
   <frame src="main.html" name="mainFrame" />
  </frameset>
  <frame src="bottom.html" name="bottomFrame" scrolling="no" 
    noresize="noresize" />
 </frameset>
</html>

Документы, открываемые внутри фреймов (в данном примере это left.html, main.html и bottom.html), используют строгий или переходный доктайп, но никак не с фреймами.

HTML5

В HTML5 существует лишь один тип доктайпа, который переводит браузер в стандартный режим.

<!DOCTYPE html>

доктайп

Доктайп

Строгий доктайп

Переходный доктайп

Фреймы

HTML5

HTML по теме

Статьи по теме