Новые элементы HTML 5

HTML 4 с нами уже примерно 10 лет. За это время не было серьезных шагов по его усовершенствованию. Конечно, появился XHTML, однако, он просто ужесточает правила и заставляет писать лучший и более качественный код. При этом, вы полностью заботитесь о соответствии стандарту. HTML 5 же призван сделать большее. Он добавляет серию очень важных нововведений.

Работа над HTML5 началась еще в далеком 2004-м, но только сейчас (2009) он начинает вызывать серьезный интерес. Увеличивается поддержка браузеров, а элемент, который мне больше всего нравится (CANVAS), поддерживается 4-мя из 5-ти наиболее распространенных браузеров. Вместе с тем не совсем реально, хотя и возможно, использовать HTML 5, так как новый стандарт не поддерживается в MSIE.

Что же нового в HTML 5?

<canvas>

<canvas> — это поле для рисования двухмерной графики, управляемый с помощью JavaScript. Вы можете использовать его для построения графиков и других динамических изображений.

<video> и <audio>

Тег <video> упрощает добавление видео клипов на HTML-страницы. Он может содержать атрибуты src, autoplay и loop. Тег <video> также допускает задание текстового описания для видео (например, для незрячих людей). В идеале это должна быть полная текстовая интерпретация видео.

Тег <audio> очень похож на <video>, но предназначен для аудио-файлов. Неожиданно, не правда ли?

Контекстные меню

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

Новые структурные элементы

Так как HTML 4 слабо структурирован, в 5-ю версию спецификации были добавлены новые элементы, призванные исправить этот недостаток:

  • <section> — секция, либо параграф.
  • <header> — верхний колонтитул страницы (не путать с <head>)
  • <footer> — нижний колонтитул страницы.
  • <nav> — содержит набор ссылок на другие страницы. Например, вы можете расположить там навигацию по вашему сайту.
  • <article> — в этот тег может быть включена, например, статья блога.
  • <aside> — может быть использован для предоставления дополнительной информации к текстовому блоку.
  • <figure> — может быть использован, например, для создания диаграмм.

Новые inline-элементы

Стандарт HTML5 вводит новые элементы, которые позволяют специальным образом выделять фрагменты текста, содержащие время и числа:

  • <mark> — помечает фрагмент текста. Можно, например, отметить найденные термы в списке результатов поиска.
  • <time> — можете использовать этот тег для вывода времени или даты в текстовом блоке.
  • <meter> — для представления чисел в определенном диапазоне. Он может иметь различные атрибуты: value, min, max, low, high и optimum.
  • <progress> — может быть использован для отображения индикатора состояния процесса. Имеет пару атрибутов: value и max.

Новые типы полей ввода

HTML5 добавляет ряд новых типов для полей ввода данных:

  • datetime
  • datetime-local
  • date
  • month
  • week
  • time
  • number
  • range
  • email
  • url

Некоторые из них широко применяются в пользовательских интерфейсах desktop-приложений. И, вероятнее всего, они будут уже хорошо знакомы всем вашим пользователям.

Устаревшие (deprecated) элементы

Следующие элементы HTML считаются устаревшими:

  • acronym
  • applet
  • basefont
  • big
  • center
  • dir
  • font
  • frame
  • frameset
  • isindex
  • noframes
  • noscript
  • s
  • strike
  • tt
  • u

Синтаксис для задания кодировки

Синтаксис для задания кодировки документа в HTML5 теперь выглядит очень просто: <meta charset=»UTF-8″>

Интерактивные нововведения

Несколько нововведений, которые сделают создание сайтов и web-приложений проще и приятнее:

  • <details> — дополнительная информация о чем либо. Например, данный тег может быть использован в браузерах для реализации подсказки. Тег может иметь атрибут open, указывающий будет ли содержимое тега изначально показано пользователю или нет.
  • <datagrid> — В отличие от традиционных таблиц (которые задуманы как статические), этот тег может быть использован для представления интерактивного набора данных. Например, для таблицы с выбором строк или колонок, inline-редактированием данных, сортировкой и т.п.
  • <menu> — ранее рекомендуемый, тег <menu> вернулся в стандарт HTML5 в новом обличии. Теперь он может содержать, например, элементы <command>, которые вызывают соответствующие команды. Этот элемент можно использовать для представления панели инструментов или контекстного меню (см. выше). Тег может иметь атрибуты label и icon. Они могут быть добавлены для создания многоуровнего меню.

Новое определение типа документа (DTD)

В HTML5 стало гораздо проще объявлять DTD: <!doctype html> Объявление DTD стало более симпатичным и, я полагаю, проще запоминающимся. Скорее всего, это является результатом того, что HTML больше не связан с SGML.

Необязательный href в ссылках

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

Атрибут async

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

Заключение

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

Естественно, не все браузеры будут поддерживать весь стандарт целиком (думаю, читатель сейчас вспомнил о «любимом» MSIE). Но поддержка появится со временем. И новые элементы HTML 5 были разработаны с учетом текущей ситуации. С другой стороны, большинство браузеров уже частично поддерживают спецификацию. Так, например, тег <canvas> поддерживается в Firefox, Opera, Chrome и Safari. Плюс, на сколько мне известно, Firefox 3.6, IE9 будет поддерживать теги <audio> и <video>.

HTML5 язык разметки

HTML — язык, объединяющий всемирную сеть. Всего лишь посредством набора простых тегов, человечеству удалось создать несравнимую ни с чем по своим масштабам систему связанных между собой страниц и веб-узлов: от Amazon, eBay и Википедии, до личных блогов и сайтов, посвященных котам, похожим на Гитлера.

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

Как и всемирная сеть вообще, HTML — язык разметки гипертекста (HyperText Mark-up Language) — является детищем сэра Тима Берненс-Ли (Sir Tim Berners-Lee). В 1991 году он написал работу, озаглавленную «HTML Tags», в которой описал чуть меньше двух дюжин тегов, предложенных им для разметки веб-страниц.

Идея использовать для этого кодовые слова внутри треугольных скобок, впрочем, не принадлежит сэру Тиму. Такая система на тот момент уже существовала и использовалась в SGML (Standard Generalised Markup Language, стандартный обобщённый язык разметки), и вместо того, чтобы изобретать что-то с нуля, сэр Тим посчитал более рациональным взять за основу уже существующие решения. Аналогичный подход применялся и вообще на всем пути к HTML5 в процессах разработки.

От IEFT к W3C: дорога к HTML 4

Версии HTML 1 никогда не существовало. Первой официальной спецификацией был сразу HTML 2.0, и издала его организация IETF (Internet Engineering Task Force, Специальная комиссия интернет-разработок). Многие из возможностей языка, описанных в этой спецификации, были основаны на уже используемых сторонних разработках. Например, тег <img> для вставки картинок на страницы был реализован в лидирующем на тот момент (мы говорим о 1994 году) браузере Mosaic, и потом просто перекочевал в стандарт для HTML 2.0.

Эстафету IEFT позже подхватил W3C (World Wide Web Consortium, Консорциум Всемирной Паутины), который и занимался всеми последующими версиями HTML. Во второй половине девяностых велась активная работа над пересмотром и изменением спецификаций, которые в конце концов (точнее, в 1999 году) дали жизнь HTML 4.01.

После этого в истории HTML наступил первый ключевой поворот.

XHTML 1: HTML в виде XML

Новая версия языка разметки после HTML 4.01 была названа XHTML 1.0. «Икс» в названии означал eXtreme, и веб-разработчики были обязаны скрещивать перед собой руки каждый раз, когда произносили это слово.

Нет, конечно нет. На самом деле «икс» означал eXtensible («расширяемый»), а скрещивание рук было по желанию.

Сама по себе спецификация для XHTML 1.0 ничем не отличалась от HTML 4.01. Не добавилось никаких новых тегов или параметров — разница была лишь в правилах синтаксиса. Если в HTML разработчикам была дана полная свобода относительно стиля написания кода, в XHTML требовалось соблюдать правила языка XML, — куда более жесткого и нетерпимого к вольностям, — на котором основывалось большинство разрабатываемых Консорциумом технологий.

Жесткие правила, впрочем, пришлись как раз кстати. Они побуждали кодеров придерживаться единого стиля, например — писать все теги и параметры исключительно в нижнем регистре, тогда как в HTML можно было делать как придется.

Выход XHTML 1.0 совпал с возросшим уровнем поддержки современными браузерами таблиц стилей — CSS, — и строгий синтаксис XHTML укрепился в сообществе разработчиков с репутацией лучшего способа написания кода разметки.

Потом был XHTML 1.1.

Если версия 1.0 была просто HTML, сделанным под XML, то XHTML 1.1 — это уже настоящий, чистый XML. В том смысле, что к нему уже нельзя было применить mime-type text/html и нужно было обозначить документ как отформатированный в XML. Однако в том случае его никак не смог бы отобразить самый популярный на тот момент браузер — Internet Explorer, — так что применять на практике этот язык было явно не вариантом.

Создавалось впечатление, что W3C в свои разработках начинает терять связь с реальностью, по которой жила всемирная сеть.

XHTML 2: нет, это уже ни в какие ворота не лезет

Если бы герой Дастина Хоффмана из фильма «Выпускник» был веб-дизайнером, W3C сказал был ему только одно слово: XML.

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

Иными словами, это был бред.

Раскол: W(HATWG) TF?

В среде Консорциума назрело восстание. Было очевидно, что он собирается вести разработку стандартов, — пусть новых, чистых и прекрасных, — но совершенно не отвечающих нуждам современного сообщества веб-дизайнеров и разработчиков. Opera, Apple и Mozilla были явно от этого не в восторге, так как ожидали совершенно другого — больше упора на форматы, позволяющие расширить возможности для создания веб-приложений.

Начало переменам было положено в 2004 году на одном из собраний. Ян Хиксон (Ian Hickson), который на тот момент был сотрудником Opera Software, выдвинул предложение заняться развитием HTML до уровня, позволяющего использовать этот язык для веб-приложений. Предложение было отклонено.

Разочарованные бунтари вынуждены были отколоться от Консорциума и организовать собственную группу: Web Hypertext Application Technology Working Group, сокращенно WHATWG.

От Web Apps 1.0 к HTML5

Принцип работы WHATWG несколько отличался от того, что был в W3C. В W3C вопросы поднимаются, обсуждается, и конечное решение выносится всеобщим голосованием. В WHATWG вопросы так же поднимаются, обсуждается, но окончательные решения относительно того, что включается в спецификацию, а что нет, остаются за главным редактором — Яном Хиксоном.

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

Первоначально, WHATWG было занято двумя спецификациями — Web Forms 2.0 и Web Apps 1.0, — обе из которых должны были стать расширениями для HTML. Но со временем они были объединены в одну общую, названную просто HTML5.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML -теги и атрибуты: <a href= http://pixelcom.crimea.ua/"" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>