Изучаем HTML 5-Б. Лоусон, Р. Шарп - 2011

Печать

Хотя большинство возможностей HTML5 направлено на создание интерактивных приложений, многие из них будут интересны как тем, кто занимается версткой, так и тем, кто отвечает за написание скриптов. В HTML5 добавлены 28 элементов с новой семантикой, которые можно использовать при создании традиционных «статических» веб-страниц, а также ряд элементов управления формами, позволяющих полностью отказаться от необходимости валидации форм с помощью JavaScript.

Давайте сразу обратимся к коду и начнем с разметки самой обычной страницы с помощью HTML5. Мы попытаемся превратить текущую разметку, использующую элементы <div>> в семантически организованную систему с помощью новых структурных элементов HTML5: <nav>, <header>, <f ooter>, <aside>, <article> и др. Далее мы посмотрим, как эти элементы работают, и поговорим об однозначности структуры НТМЬ5-документа и его «семантичности».

Но в первую очередь самое важное. Сначала откроем редактор кода и зададим тип документа и предварительные сведения.

<head>

Итак, тип документа:

cldoctype html>

Готово. И никаких URL, которые даже самым опытным веб-разработчикам приходится вырезать и вставлять. Обратите внимание на то, что здесь не указан номер версии. Такое объявление типа скорее напоминает не правило, а заклинание:оно предназначено для тех браузеров, которым для перехода в стандартный режим требуется указание типа документа, а такой код является одновременно и кратким, и надежным.

Далее определим кодировку символов документа. Если этого не сделать, появляется неясная, но реальная угроза безопасности (см.http://c0de.g00gle.c0m/p/d0ctype/wiki/ArticleUtf7). Кодировка должна быть указана в первых 512 байтах документа; лучше всего использовать UTF-8 (если нет серьезных оснований для выбора другой кодировки).

<!doctype html> <meta charset=utf-8>

Посмотрите внимательно на тег <meta>. Если вы привыкли к XHTML, вы заметите несколько странностей. Во-первых, этот тег гораздо короче (раньше он бы выглядел так: <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">). Старый вариант остается допустимым,