Фрэйн . - HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств. 2-е изд.

О предшествующих версиях и путях развития HTML можно узнать в «Википедии» по адресу http://en.wikipedia.org/wiki/HTML#HTML_versions_timeline.

совет

В настоящее время HTML5 является рекомендацией консорциума W3C. Соответствующую спецификацию можно найти по адресу http://www.w3.org/TR/html5/.

В этой главе будут рассмотрены следующие вопросы:

• насколько широка поддержка HTML5;

• как правильно написать начало страницы на HTML5;

• покладистость HTML5;

• новые семантические элементы;

• семантика на уровне текста;

• устаревшие функции;

• внедрение новых элементов;

• соответствие уровня доступности требованиям Руководства по обеспечению доступности веб-контента (Web Content Accessibility Guidelines (WCAG)) и Стандарта предоставления возможности полноценного использования Интер нета людьми с физическими ограничениями (Web Accessibility Initiative-Accessible Rich Internet Applications (WAI-ARIA)) для повышения общей доступности веб-приложений;

• встраиваемое медиасодержимое;

• адаптивное видео и iFrames;

• замечание по поводу приоритета автономности.

примечание

В HTML5 также предоставляются конкретные инструменты для работы с формами и пользовательским вводом. Набор соответствующих функций существенно разгружает более ресурсоемкие технологии вроде JavaScript в вопросах проверки правильности заполнения форм. Хотя формы HTML5 будут рассмотрены отдельно в главе 9.

Разметку на HTML5 понимают все современные браузеры

Сегодня основная масса просматриваемых мною сайтов (и все сайты, созданные моими руками) написаны с использованием HTML5, без применения старого стандарта HTML 4.01.

Новые семантические элементы HTML5 (новые элементы структуры, видео- и аудиотеги) понятны всем современным браузерам, и даже старые версии Internet Explorer (предшествующие Internet Explorer 9) могут пользоваться небольшими дополнениями (полифиллами), позволяющими выводить эти новые элементы.

Что такое полифиллы?

Термин «полифилл» придуман Реми Шарпом (Remy Sharp) как намек на заполнение трещин в старых браузерах с помощью Polyfilla (известной в США шпатлевки). То есть полифилл является своеобразной прокладкой, написанной на JavaScript и предназначенной для эффективного воспроизводства новейших функций в устаревших браузерах. Но при этом важно понимать, что полифиллы утяжеляют код. Поэтому даже возможность добавления 15 полифилльных сценариев, способных заставить Internet Explorer 6 выводить сайт на экран не хуже любых других браузеров, не означает необходимости подобного добавления.

Если нужно включить в работу структурные элементы HTML5, то я бы посоветовал обратить внимание на исходный сценарий Реми Шарпа (http://remysharp.com/2009/01/07/html5-enabling-script/) или создание заказной сборки Modernizr (http://modernizr.com). Если инструментальное средство Modernizr вам еще не попадалось или не использовалось вами, то в следующей главе ему посвящен целый раздел.

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

Как правильно написать начало страницы на HTML5

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

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

doctype

Объявление doctype предназначено для того, чтобы сообщить браузеру о типе имеющегося документа. Иначе он не получит необходимые ему сведения о том, как нужно распорядиться содержимым этого документа.

Наш документ открывается HTML5-объявлением doctype:

Если вам нравится использовать нижний регистр, можете записать объявление в виде . Разницы никакой.

По сравнению с HTML 4.01, где в начале страницы использовалось что-то вроде

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

А вот в HTML5 объявление doctype радует своей краткостью, ограничиваясь лишь формой . Интересный факт (во всяком случае, для меня): все закончилось тем, что был избран самый короткий способ сообщения браузеру о необходимости вывода страницы в стандартном режиме.