Синтаксические различия HTML и XHTML

Дневник админа

HTML (HyperText Markup Language) и его расширение XHTML (eXtensible HyperText Markup Language) являються основными языками разметки веб-страниц․ Хотя оба формата представляют собой набор элементов и атрибутов‚ имеются существенные синтаксические различия между ними․ Давайте рассмотрим основные отличия между HTML и XHTML․

 Синтаксические различия⁚

 1․ Объявление документа⁚

В XHTML документ должен быть объявлен как валидный XML-документ с помощью декларации `<?​xml version="1․0" encoding="UTF-8"?​>`․ В HTML объявление документа не обязательно․

Пример⁚

<html xmlns="http://www․w3․org/1999/xhtml" xml⁚lang="en" lang="en">  
  

 2․ Регистр тегов и атрибутов⁚

XHTML требует строгого соблюдения регистра элементов и атрибутов ― все теги и атрибуты должны быть написаны строчными буквами․

Пример⁚

<html xmlns="http://www․w3․org/1999/xhtml" xml⁚lang="en" lang="en">
  
  <p>Этот текст будет корректным для XHTML</p>
  <P>Но этот текст может вызвать проблемы</P>

 3․ Атрибуты⁚

XHTML требует закрытия всех атрибутов в тегах‚ даже если они пустые․ В HTML некоторые атрибуты можно оставить без закрывающего слэша․

Пример⁚

<img src="image․jpg" alt="Изображение" />

<img src="image․jpg" alt="Изображение">

 4․ Обработка ошибок⁚

XHTML требует более строгой структуры и обработки ошибок‚ так как является расширением XML․ HTML более терпим к ошибкам разметки․
Эти синтаксические различия между HTML и XHTML важны при создании веб-страниц и влияют на способы разработки и валидации кода․

Теперь вы знаете основные синтаксические различия между HTML и XHTML․ Различия в объявлении документа‚ регистре тегов и атрибутов‚ использовании закрывающих слешей и обработке ошибок делают XHTML более строгим языком разметки по сравнению с HTML․

Необходимо помнить об этих различиях при разработке веб-страниц и выборе между HTML и XHTML форматами разметки․

Синтаксические различия HTML и XHTML

Наименьший возможный документ, согласно HTML 4, должен состоять из двух обязательных элементов: ссылки на определение типа документа (DTD) и элемента & # 8230; & lt;/title & gt; содержащий заголовок документа. К сожалению, есть жалкие разработчики, которые на каждом шагу игнорируют обе эти вещи. В дополнение к вышесказанному, документ как минимум HTML 4 должен содержать все используемые единицы разметки контента.

Вот возможный пример одного из самых кратких HTML-документов, показывающий HTML 4.01 Strict DTD:

 & lt ;! DOCTYPE HTML PUBLIC & quot; -//W3C//DTD HTML 4.01//& quot; & quot; http://www.w3.org/TR/html4/strict.dtd" & gt
& lt; title & gt; & lt;/title & gt;
& lt; p & gt; & lt;/p & gt; 

Убедитесь, что документ соответствует стандарту, с помощью онлайн-валидатора, доступного на веб-сайте W3C по адресу http://validator.w3.org/.

Если вы откроете документ, созданный в веб-браузере, вы увидите … пустое окно. Это неудивительно, ведь наш документ не содержит никакой полезной информации. И заголовок & gt; & lt;/title & gt; с указанием заголовка документа и контейнера & lt; p & gt; & lt;/p & gt; которые определяют текст абзаца, в этом примере полностью пусты.

Давайте заполним их значимой информацией:

 & lt ;! DOCTYPE HTML PUBLIC & quot; -//W3C//DTD HTML 4.01///EN & quot; & quot; http://www.w3.org/TR/html4/strict.dtd" & gt;
& lt; title & gt; Минимальный размер документа & lt;/title & gt;
& lt; p & gt; Этот веб-сайт имеет максимально простую структуру. & lt;/p & gt; 

С очень ощутимым результатом. Текст Минимальный документ, который является заголовком нашей страницы, появится в заголовке окна браузера, а содержимое & lt; p & gt; & # 8230; & lt;/p & gt; контейнер — текст абзаца.

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

Документы XHTML могут иметь только один корневой тег, а у нас их два: & # lt; title & gt; & # 8230; & lt;/title & gt; i & lt; p & gt; & # 8230; & lt;/p & gt;. Кроме того, в XHTML 1.0 Strict элементы & lt; head & gt; & # 8230; & lt;/head & gt; и & lt; body & gt; & # 8230; & lt;/body & gt; являются обязательными, определяя заголовок и тело документа соответственно. Однако также считается хорошей практикой иметь эти элементы в «простых» документах HTML 4.

Заголовок — это часть документа, которая содержит связанные с работой, вспомогательные и управляющие элементы, которые не являются частью содержимого страницы. Эти элементы не отображаются в окне браузера. Эти элементы включают, среди прочего, элемент заголовка & gt; & # 8230; & lt;/title & gt;, содержание которого, как известно, не влияет на внешний вид страницы и появляется только в заголовке окна браузера. Он отображается в окне браузера и обрабатывается другими пользовательскими агентами в соответствии с их собственными правилами.

Приведенный выше листинг переводит страницу в XHTML следующим образом:

 & lt ;! DOCTYPE html PUBLIC & quot; -//W3C//DTD XHTML 1.0 Strict//& quot; & quot; http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" & gt; html & gt;
& lt; html & gt;
& lt; head & gt;
& lt; title & gt; Минимальный размер документа & lt;/title & gt;
& lt;/head & gt;
& lt; body & gt; & lt; body & gt;
& lt; p & gt; Этот веб-сайт имеет максимально простую структуру;
& lt;/body & gt ;;
& lt;/html & gt; 

Как видите, первая строка изменилась, так что это ссылка на определение типа документа XHTML 1.0 Strict.

Как мы уже сделали по теме стоит проверить URL-адреса в этих объявлениях и посмотреть, как выглядят файлы DTD. См. Http://www.w3.org/TR/html4/strict.dtd для определения типа документа HTML 4.01 Strict и http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict. dtd для DTD для XHTML 1.0 Strict. Анализ файлов DTD выходит за рамки этого поста — но в них нет ничего шокирующего, и заинтересованные читателипосле небольшого обучения они смогут сами понять их.

Остерегайтесь других синтаксических различий. Это важно для всех Теги в документе XHTML всегда пишутся строчными буквами, поскольку с точки зрения правил синтаксиса XML & lt; html & gt; и & lt; HTML & gt; совершенно разные. Элементы контейнера должны быть окружены закрывающим тегом, а пустые элементы должны быть окружены косой чертой (например, & lt; br/& gt ;; пробел здесь необязателен, но рекомендуется оставить его для совместимости со старыми браузерами. ).

Атрибут имени для элементов & lt; a & gt;, & lt; applet & gt;, & lt; form & gt;, & lt; frame & gt;, & lt; iframe & gt;, & lt; img & gt; i & lt; map & gt; устарел, используйте вместо него атрибут id.

В XML минимизация атрибутов не поддерживается, поэтому логические атрибуты должны быть записаны полностью. Например, конструкция & lt; option selected & gt; неверно с точки зрения XHTML — правильное написание — & lt; option selected = "selected" & gt ;, что является своего рода тавтологией. К сожалению, очень старые браузеры, несовместимые с HTML 4, могут не понимать эти конструкции, но сегодня их очень мало.

Доказательство на будущее

Минимальный шаблон, описанный в Предыдущий раздел XHTML 1.0 Strict document достаточно для создания высококачественных веб-страниц.

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

В соответствии с нашей пропагандой, чтобы сделать веб-контент доступным как можно большему количеству людей и поддержать интернационализацию World Wide Web, он предлагает указать язык веб-содержимого с помощью атрибута lang тега & lt; html & gt ;. Это относится как к документам, созданным как HTML 4, так и XHTML.

Следующий фрагмент XHTML указывает, что документ на русском языке:

Последний минимальный шаблон документа в XHTML 1.0 Strict, описанный в Предыдущий раздел достаточно хорош для создания качественных веб-страниц.

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

W3C в соответствии с принципами доступности всемирной паутины и интернационализации всемирной паутины (см. WAI — Инициатива обеспечения доступности Интернета ), рекомендует сделать атрибут lang тега & tl; html & gt; был видимым языком содержания веб-сайта. Это относится к документам, написанным как в HTML 4, так и в XHTML.

Следующий фрагмент XHTML указывает, что документ на русском языке:

 & lt; html lang = & quot; ru & quot ; & gt ..;
...
& lt;/html & gt; 

Алфавитный код определенного языка в атрибуте lang задается в соответствии с ISO 639. Например, английский соответствует en, французский — fr, немецкий — de, украинский — uk, белорусский — be и т. д.

Остальная часть этого раздела предназначена только для документов XHTML. Каждая страница XHTML известна как XML-документ.

Хороший стиль — начинать ваши XML-документы с объявления XML. Он содержит номер версии языка и (иногда) некоторые дополнительные параметры, такие как кодировка документа. Это не обязательно для XML-документов, но рекомендуется включать XML-форму, поскольку в будущем вполне вероятно, что документы без XML-формы будут считаться имеющими последнюю версию, и это может привести к ошибкам и несоответствиям. В настоящее время существует две официальных рекомендуемых версии XML: 1.0 и 1.1. Напомним, что XHTML 1.0 основан на XML 1.0 и является его подмножеством.

В XML, который, как мы уже упоминали, является универсальным стандартом для всех структурированных данных, атрибут xml: lang определяется с той же целью, что и атрибут lang в HTML, за исключением того, что xml: lang относится к в любой XML-документ, а не только на XHTML-страницы. Можно сказать, что xml: lang более глобален, чем lang. Использование атрибута xml: lang предпочтительнее для современных, ориентированныхНа XML пользовательские агенты, поисковые системы и т. Д., Но, к сожалению, более старые браузеры, которые не совместимы с XML, не понимают И просто игнорируйте этот атрибут. Следовательно, рекомендуется использовать оба XML: lang и lang как "все-in-one", чтобы быть на безопасной стороне …

Кроме того, рекомендуется отображать элемент & lt; HTML & GT; & # 8230; & TL//HTML & GT; Для пространств имен XHTML.

Объяснение. XML, Metatyzyk, позволяет программистам придумать свои собственные, совершенно любые маркеры. Поскольку имена тегов обычно являются значительными словами натурального языка, которые, честно говоря, не слишком частыми в человеческой речи, XML-документ любого типа может содержать идентичные маркеры, которые означают совершенно разные вещи. Об этом ничего преступно. (Вы могли бы сделать аналогию: скажем, что на английском и французском языках — это слова, которые написаны таким же образом, но они звучат по-разному, а иногда они имеют разные значения). Однако, если в том же документе есть общие элементы с различными значениями, но, определенные теми же маркерами, возникают конфликты имен, и определение типа данных о том, что каждый элемент приносит, будет очень проблематичным при обработке документа. Механизм пространства имен был разработан для решения таких конфликтов. Однако я не хочу углубиться в строительство пространства имен XML и более тонкие детали — просто наличие или отсутствие ссылки на пространство имен XHTML не влияет на сохранение браузеров, известных нам; Это можно рассматривать как своего рода светлое будущее и дополнительный фактор мира для программистов и уверенности, что все сделано «как следствие». То же самое само по себе ничего не так.

Это делает «минимальный» документ XHTML выглядит следующим образом:

 

 & lt ;? XML версия = & quot; 1.0 & quot; Кодировка = & quot; Windows-1251 & quot ;? & gt;
& lt;! otetype html public & quot; -//w3c//dtd xhtml 1.0 строгое//"quot; & quot; http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd" & gt;
Синтаксические различия HTML и XHTML

& lt; html xmlns = & quot; http://www.w3.org/1999/xhtml" Lang = & quot; ru & quot; XML: Lang = & quot; ru & quot; & gt; & lt; head & gt; & lt; title & gt; Минимальный документ & lt;/title & gt; & lt;/head & gt; & lt; body & gt; & lt; body & gt; & lt; P & GT; этот веб-сайт имеет простейшую возможную структуру; & lt;/body & gt ;; & lt;/html & gt;

Первая строка — это правильная декларация XHTML; Кодированное кодирование должно соответствовать тому, которое возвращает сервер, конечно. Тег & lt; html & gt; Был «обновлен» с новыми атрибутами — то есть атрибут XMLNS имеет значение идентификатора пространства XHTML, а атрибут XML был добавлен в атрибут lang: lang с тем же значением, что и lang.

ограничения.

Истина состоит в том, что использование вышеуказанного «прогрессивного» шаблона XHTML-документа теперь возможно только с ограничениями.

Большинство современных браузеров позволяют использовать два режима: режим соблюдения и соответствия (то есть совместимость со страницами, разработанными в соответствии с принципами дикой природы со второй половины 90-х годов прошлого века).

Как правило, браузеры работают только тогда, когда документ, который вы пытаетесь рендер, имеет правильный элемент & lt; dotype & # 8230; & gt ;. Если ему не хватает или неверно, браузер переходит в режим соответствия.
Один из вещей, связанных с режимом соответствия в Internet Explorer 6.0, заключается в том, что если элемент отсутствует и # 8230; & gt; & lt; dotype или неверно, браузер ведет себя как Internet Explorer 5.0 — например, неправильно интерпретирует свойства ширины CSS и высоты. (Значения этих свойств, в соответствии с спецификацией CSS, относятся только к размеру содержания блока-элемента — не к полям, границам и отступам. Однако Internet Explorer 5.x, кроме версии 5.5 для Macintosh, Изливают из стандарта, обрабатывая значение свойства и высоты ширины как ширину и высоту блочного элемента вместе с краем и шириной границы, но без отступа.)

Ницца "Сюрприз, подготовленный для нас Microsoft следующим образом: IE6 работает назад, совместимый с IE5 в любом случае, если только правый и LT;! DOCTYPE & # 8230; & GT; Элемент возникает в самой первой значительной линии кода для этого замечательного браузера.
И что мы в первой строке кода? Это XML-объявление! Следующий элемент & lt;! DOCTYPE & # 8230; Firefox, Opera и даже IE7 прочитайте его правильно, но для IE6 эта строка кажется Это совсем не.

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

На практике ситуация выглядит так, чтобы лучше избегать помещения XML в первом ряду документов XHTML, потому что «популярный браузер» IE6 (из которого, согласно SpyLOG — http://gs. SPYLOG.RU/, использует более 57% посетителей Party Party RuneT, отмеченные в период с 17 по 4 мая 2007 года) Не видите и # LT;! DOCTYPE & # 8230; & GT; Элемент, влияющий на правильное отображение компонентов страницы, за текстом XML. Кстати, почти нет причин для нервозности — мы уже подчеркнули, что объявление XML является необязательным, необязательным …

6 урок. HTML & CSS. Разница между технологиями HTML и XHTML

Оцените статью