Разница между HTML и XHTML. Что такое XHTML? Ошибки в XHTML и отличия XHTML от HTML

При выборе DOCTYPE необходимо чётко определиться, какой из двух стандартов выбрать: HTML или XHTML . И для облегчения Вашего выбора я решил разобрать разницу между HTML и XHTML .

Главное отличие между HTML и XHTML в том, что XHTML основан на синтаксисе XML . А, следовательно, он более строгий, и в нём нельзя допускать тех вольностей, которые можно допустить в HTML .

А теперь по пунктам разберём особенности синтаксиса XHTML :

1. Каждый тег должен закрываться

Парные теги должны закрываться и в HTML тоже, но все мы знаем, что в HTML существует множество одиночных тегов (например, <img >), и мы смело могли написать таким образом:

Однако, в XHTML все теги должны закрываться, даже одиночные, причём закрываются они следующим образом:

Разница только в слеше перед второй угловой скобкой.

2. Все спецсимволы должны быть заменены на сущности

То есть нельзя писать вот так: "& ", нужно писать этот символ только сущностью, то есть "& ". В HTML подобного правила не существует.

3. Все значения атрибутов должны быть в кавычках.

Все мы с Вами знаем, что в HTML можно написать вот так:

То есть у нас значение атрибута "width " находится без кавычек. В XHTML это недопустимо, и там надо писать вот так:

4. Все теги и атрибуты должны писаться в нижнем регистре.

Скажу честно, я никогда не понимал, зачем люди пишут теги в верхнем регистре. На мой взгляд, это уродует код, и возникает ощущение, что его писали не отжимая "CAPSLOCK ". Но если в HTML - это дело вкуса, то в XHTML - это правило: писать только в нижнем регистре.

Как видите, разница только в синтаксисе. Есть также и другие мелкие различия, но мы о них говорить не будем. Другими словами, единственное преимущество XHTML - это более лёгкий парсинг документа . А также XHTML очень подходит любителям "чистого" кода. Больше никаких преимуществ нет. Все браузеры корректно отображают и HTML , и XHTML . Причём зачастую браузеры XHTML обрабатывают как HTML , поэтому для внешнего вида серьёзных различий в HTML и XHTML точно не будет.

Я для себя выбрал XHTML , потому что я очень люблю, когда код "чистый" и когда он легко разбирается на составные части (парсинг ). Да, и вообще я привык к строгому синтаксису других языков, например, Java, поэтому всё равно я буду писать максимально валидно. А что выберите Вы - решать только Вам, а об отличиях HTML и XHTML Вы уже знаете.

XHTML Расшифровывается как ExtensibleHypertext Markup Language и на русском — Расширяемый язык разметки гипертекста. Обратите внимание не расширенный, а расширяемый. Это значит, что данный язык

Пополняется (расширяется) до сих пор. Так что такое XHTML ? Основным отличием XHTML от того же HTML является способ обработки документа (интернет-странички). Стоит ввести еще одно определение. Парсер - программа или часть программы, которая выполняет синтаксический анализ. Также его еще называют синтаксический анализатор. Если еще проще, то данная программа выполняет анализ всего строения страницы, всего кода страницы. В HTML при нахождении ошибки, во время анализа она исправлялась, что требовало дополнительного времени - браузеру нужно было понять, что автор (разработчик) хотел написать. Например, при ошибке в каком-либо теге, он просто выводился с остальным текстом.

Еще одно отличие заключается в том, что все элементы должны быть закрыты, а одиночные теги должны после символов иметь знак /, например:
. Про тэги я напишу отдельную большую статью, также напишу про каждый тэг отдельно. Кодировка в XHTML - UTF-8 (наиболее распространенная сейчас), в HTML же использовалась ISO 8859-1.

первая распространенная ошибка — указание в теге относительного пути к DTD-файлу, скопированного с сайта www.w3.org, "DTD/xhtml11.dtd". В место этого нужно писать полный путь "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" .
нарушение принципа закрытия всех без исключения элементов. Язык XHTML, в отличие от того же HTML, обязывает закрывать все элементы, в том числе не имеющих тега закрытия, как, например,
.
Недопустимо отсутствие кавычек при описании значений атрибутов. Например конструкция

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

В XHTML нет атрибута alt для изображений. Вот нету, и все тут.

Что такое Модуляризация XHTML?

Модуляризация XHTML это разделение XHTML 1.0, относительно HTML 4, на коллекцию абстрактных модулей, которые предоставляют специфические типы функциональности. Эти абстрактные модули реализованы в данной спецификации с использованием языка XML Document Type Definition/Определения Типа Документа, но ожидается появление реализации с использованием Схемы XML.
Правила определения абстрактных модулей и реализации их с использованием ОТД также определены в данном документе.

xhtml

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

Для чего нужна Модуляризация XHTML?

Модель форматирования

Предыдущие версии HTML пытались определить части такой модели, которые требовались от пользовательского агента (ПА) для использования при форматировании документа. С появлением , W3C начал процесс отделения представления от структуры. XHTML 1.0 поддерживает это разделение, и данный документ продолжает движение от HTML и его потомков в этом направлении. Соответственно, данный документ не выдвигает никаких требований к модели форматирования, ассоциированной с представлением документов, размеченных с помощью типов документов Семейства XHTML.

xhtml

Наоборот, данный документ рекомендует, чтобы авторы содержимого полагались на механизмы определения стилей, такие как CSS, при определении модели форматирования для своего содержимого.
Если ПА поддерживают механизмы стилей, то документы будут сформатированы так, как ожидается.
Если ПА не поддерживают механизмы стилей, то документы будут сформатированы так, как определяет сам ПА. Это позволяет ПАгентам Семейства XHTML поддерживать сложные (так и просится — навороченные; А.Р.) модели форматирования на тех устройствах, где это возможно, и изменять модели форматирования на тех устройствах, где это допустимо

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

Правила XHTML следующие.

Все теги и их атрибуты должны быть набраны в нижнем регистре (строчными символами).
Значения любых атрибутов необходимо заключать в кавычки.
Требуется закрывать все теги, даже такие, которым не сопоставлен закрывающий тег.
Должна соблюдаться правильная вложенность тегов.
Нельзя использовать сокращенные атрибуты тегов.
Вместо атрибута name следует указывать id .
Следует определять DTD (document type definition, описание типа документа) с помощью элемента .

Теги должны быть набраны в нижнем регистре

Это правило возникло из-за того, что XHTML чувствителен к регистру символов, поэтому для него теги

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

Пример 3.1. Ошибочное написание тегов

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Lorem ipsum dolor sit amet...

В данном примере теги и

Набраны прописными символами, что является ошибкой. В примере 3.2 показан корректный код.

Пример 3.2. Правильное написание тегов

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Lorem ipsum dolor sit amet...

Значения любых атрибутов необходимо заключать в кавычки

Хотя в HTML также требуется заключать значения в кавычки, но их отсутствие никак не влияет на корректность кода. Так что можно сказать, что в HTML применение кавычек это лишь рекомендация. В XHTML же использование кавычек возведено в правило и любые значения атрибутов требуется указывать только в них (пример 3.3).

Пример 3.3. Использование кавычек

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Чебурашка	Шапокляк
1	5
4	13

В данном примере все атрибуты тега

, а также

задаются в кавычках.

Требуется закрывать все теги

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

Пример 3.4. Нет закрывающего тега

XHTML 1.0 IE Cr Op Sa Fx

XHTML

и лезет, крадучись, в самолёт,

и бомбу в брюхо ему кладёт,

Некоторые разработчики игнорируют закрывающие теги ,

, , но в XHTML их отсутствие считается ошибкой. В примере 3.5 показано корректное использование списков.

Пример 3.5. Добавление списка

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Восток
Запад
Юг
Север

В данном примере каждому открывающему тегу соответствует его закрывающий тег.

Элемент не является частью XHTML-документа, поэтому для него закрывающего тега не требуется.

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

Пример 3.6. Добавление изображения

XHTML 1.0 IE Cr Op Sa Fx

XHTML

В данном примере обратите внимание на обязательный пробел, который предшествует конструкции /> .

В табл. 3.1 приведены некоторые теги HTML и их запись в XHTML-документе.

Должна соблюдаться правильная вложенность тегов

XHTML критично относится к ошибкам следующего типа: некорректная вложенность одного тега в другой и расположение тега в несоответствующем контейнере.

Правильная вложенность тегов

Каждый тег должен располагаться внутри другого тега, при этом недопустимо их «пересечение», как это показано в примере 3.7.

Пример 3.7. Ошибка с положением тегов

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Lorem ipsum dolor sit amet...

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

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

Иерархия тегов

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

Необходимо знать систему подчиненности тегов и следовать ей при написании кода XHTML. В примере 3.8 показана базовая структура документа.

Пример 3.8. Структура документа

XHTML 1.0 IE Cr Op Sa Fx

Новый документ

В данном примере вначале приводится тег , внутри которого располагаются теги и . Внутри раздела хранится заголовок документа ( ) и кодировка страницы (<meta> ).</p> <h2>Нельзя использовать сокращенные атрибуты тегов</h2> <p>Сокращенным называется атрибут без присвоенного значения. В примере 3.9 приведена форма с использованием таких атрибутов.</p> <p>Пример 3.9. Ошибка при использовании атрибутов</p> <p>XHTML 1.0 IE Cr Op Sa Fx </p><p> <!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>XHTML

«Пустое значение», как еще называется подобная ошибка, легко исправляется, если присвоить атрибуту значение, совпадающее с названием. В табл. 3.2 приведены некоторые атрибуты и как они записываются в HTML и XHTML.

Табл 3.2. Сопоставление атрибутов в HTML и XHTML

HTML	XHTML
checked	checked="checked"
compact	compact="compact"
disabled	disabled="disabled"
ismap	ismap="ismap"
multiple	multiple="multiple"
nohref	nohref="nohref"
noresize	noresize="noresize"
noshade	noshade="noshade"
nowrap	nowrap="nowrap"
readonly	readonly="readonly"
selected	selected="selected"

В примере 3.10 показано корректное использование вышеприведенной формы.

Пример 3.10. Правильное использование атрибутов

XHTML 1.0 IE Cr Op Sa Fx

XHTML

Вместо атрибута name необходимо указывать id