Статьи

Рассматривали ли вы разметку полиглота?

В настоящее время многие веб-разработчики перешли на HTML5 поверх XHTML. Но знаете ли вы, что веб-документы могут быть одновременно на HTML и XML? Это то, что известно как разметка полиглота: HTML-документы, которые можно корректно представить в виде text / html или в виде приложения XML-MIME-типа application / xml или application / xhtml + xml. Как и человек полиглота, который говорит на нескольких языках, документ полиглота «говорит» как на HTML, так и на XML.

Тем не менее, обратите внимание, что цель состоит в том, чтобы соответствовать правильности HTML5 и XML; Документы полиглота не должны быть действительными XHTML.

Ограничения движения Полиглота

Создание документов полиглотов усиливает ограничения и структуру, поскольку они должны соответствовать правилам XML для правильной формы. Например, имена элементов HTML и имена атрибутов обычно должны быть в нижнем регистре, а все элементы должны иметь конечный тег или использовать синтаксис свернутого тега (например, <br/> ). Хитрость заключается в том, чтобы убедиться, что документ разбирается на идентичные деревья документов (хотя есть некоторые исключения), независимо от того, обрабатывается ли он анализатором HTML или анализатором XML.

Благодаря этому ваши документы почти наверняка будут лучше структурированы и более высокого качества, но при этом все еще будут рассматриваться как HTML5. Другое преимущество заключается в том, что они могут обрабатываться инструментами XML. Кроме того, если вам нужны версии страниц в HTML и XHTML, вам не нужно поддерживать две разные копии контента (что почти всегда является плохой идеей). С документом полиглот вы можете использовать его как HTML, когда вам нужно, или как XHTML, когда вам нужно, без изменения какого-либо содержимого в документе.

Возвращаясь к идее идентичных DOM (объектных моделей документов), помните, что это очень важно, потому что браузеры не отображают HTML напрямую. Вместо этого они создают DOM из источника документа и отображают его. Кроме того, это DOM, который управляется CSS и JavaScript. Если создаются разные DOM, документы могут отображаться по-разному, особенно если использование CSS или JavaScript вызывает противоречивые изменения в разных DOM. Таким образом, многие рекомендации предназначены для того, чтобы убедиться, что идентичные DOM поддерживаются независимо от того, какой анализатор используется для анализа документа полиглота.

Рекомендации W3C

W3C имеет рабочий проект под названием Разметка полиглота: HTML-совместимые документы XHTML , в котором подробно описываются рекомендации по проектированию документов полиглота. Я суммировал некоторые из этих рекомендаций ниже. Более подробно вы можете просмотреть документ W3C, который на самом деле не такой длинный и не такой сложный для чтения. Вот резюме:

  • Не используйте document.write() или document.writeln() поскольку они не могут использоваться в XML. Вместо этого используйте свойство innerHTML .
  • Не используйте элемент noscript поскольку его нельзя использовать в документах XML.
  • Не используйте инструкции обработки XML или декларации XML.
  • Используйте кодировку UTF-8 и объявите ее одним из способов, перечисленных в документе W3C. Я рекомендую использовать <meta charset="UTF-8"/> .
  • Используйте допустимый DOCTYPE, например <!DOCTYPE html> . Не используйте объявления DOCTYPE для HTML4 или предыдущих версий HTML.
  • Для обеспечения совместимости с XML явно объявите пространства имен по умолчанию для элементов «html», «math» и «svg», например <html xmlns="http://www.w3.org/1999/xhtml"> .
  • Если вы используете какие-либо атрибуты в пространстве имен XLink, объявите пространство имен в элементе html или один раз во внешнем элементе, где он используется.
  • Каждый документ полиглота должен иметь как минимум следующие элементы (их нельзя исключать): html , head , title и body .
  • Каждый элемент tr должен быть явно заключен в элемент tfoot или tfoot чтобы поддерживать согласованность HTML и XML DOM.
  • Каждый элемент col элементе table должен быть явно заключен в элемент colgroup . Опять же, это для поддержания согласованности HTML и XML DOM.
  • Используйте правильный регистр для имен элементов. Только имена строчных букв могут использоваться для имен элементов HTML и MathML, хотя некоторые элементы SVG должны использовать только строчные буквы, а некоторые должны использовать смешанный регистр.
  • Используйте правильный регистр для имен атрибутов. Только имена строчных букв могут использоваться для имен атрибутов HTML и MathML, за исключением DefinitionURL. Некоторые имена атрибутов SVG должны использовать только нижний регистр, а некоторые должны использовать смешанный регистр.
  • Поддерживать согласованность регистра значений атрибутов. Простой способ сделать это — использовать только строчные буквы, но это не обязательно.
  • Только определенные элементы могут быть недействительными. Эти элементы должны использовать минимизированный синтаксис тегов, как <br/> ; (не допускаются конечные теги). Вот некоторые из этих пустых элементов: area , br , embed , hr , img , input , link и meta .
  • Если в заголовке HTTP Content-Language указан ровно один языковой тег, укажите язык, используя атрибуты lang и xml:lang в элементе html .
  • Не начинайте текст внутри textarea или pre элемента с новой строки.
  • Все значения атрибутов должны быть заключены в одинарные или двойные кавычки.
  • Не используйте символы новой строки в значении атрибута.
  • Не используйте атрибуты xml:space или xml:base , за исключением иностранного контента, такого как MathML и SVG. Эти атрибуты недопустимы в документах, представленных как text / html.
  • При указании языка используйте атрибуты lang и xml:lang . Не используйте один атрибут без другого, и оба должны иметь одинаковые значения.
  • Используйте только следующие именованные ссылки на сущности: amp, lt, gt, apos, quot. Для других используйте десятичные или шестнадцатеричные значения вместо именованных сущностей.
  • Всегда используйте символьные ссылки для знака «меньше» и амперсанда, кроме случаев, когда они используются в разделе CDATA.
  • Когда это возможно (хотя и не обязательно), элементы script и style должны ссылаться на внешние файлы, а не на встроенные (это хороший совет даже для документов, не относящихся к полиглоту). Однако, когда используется встроенный контент, это должен быть «безопасный контент», который не содержит проблемных символов «меньше» или «амперсанд» (экранирование их не является вариантом из-за создания разных DOM). Я также рекомендую переносить содержимое встроенного скрипта в раздел CDATA, с закомментированными маркерами CDATA (используйте //<![CDATA[ в качестве первой строки перед сценарием и //]]> в качестве последней строки, используя «//» закомментировать маркеры CDATA). Но опять же, вы можете избежать этих проблем, используя внешние файлы, а не встроенный контент.

В связи со многими указаниями, приведенными выше, настоятельно рекомендуется использовать средство проверки с поддержкой полиглота. Конечно, вы уже проверяете свои текущие документы HTML и / или XHTML, верно? Если нет, то я рекомендую вам начать делать это немедленно, потому что есть много преимуществ для более высокого качества HTML. Для проверки полиглота вы можете попробовать новую проверку полиглота в следующем выпуске v12 версии CSE HTML Validator (для Windows). Загрузите и установите бесплатную общедоступную бета-версию и установите для параметра «Проверять документы HTML как» значение Polyglot на странице параметров элемента управления DOCTYPE в параметрах механизма проверки. Вы можете использовать полнофункциональную общедоступную бета-версию бесплатно до 31 января 2013 года.

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