Тема 5. HTML5
1.1. Свойства HTML5
Язык HTML5 содержит много новых свойств, что делает HTML значительно более мощным и удобным для
создания приложений Web. В приведенном ниже списке суммируются основные свойства, о которых
действительно необходимо знать.
Некоторые из перечисленных ниже свойств не являются на самом деле частью самой спецификации HTML5,
но определены в тесно связанных спецификациях, поэтому они все еще являются допустимыми частями
нового движения в направлении современных Web-приложений, и о них полезно знать.
Новые семантические элементы: Семантика является очень важной в HTML —всегда необходимо
использовать для работы подходящий элемент. В HTML 4.01 существует много элементов для определения
специальных средств, таких как таблицы, списки, заголовки, и т.д., но существует также много общих
свойств web-страницы, которые не имеют элемента для их определения. Представьте верхние и нижние
колонтитулы сайта, навигационные меню, и т.д. — они определяются с помощью
,
которые человек может понять, но машины не могут, кроме того, различные разработчики web будут
использовать различные ID и классы. HTML5 содержит новые семантические элементы, такие как
,
, и .
Новые свойства форм: HTML 4.01 уже позволяет создавать удобные, доступные web-формы, но некоторые
общие свойства форм являются не слишком удобными и требуют специальных усилий для реализации. HTML5
предоставляет стандартизованный, простой способ реализации таких свойств, как выбор даты, ползунки и
клиентская проверка.
Собственная поддержка видео и аудио: В течение многих лет видео и аудио в Web делалось, вообще
говоря, с помощью Flash. Фактическая причина, почему технология Flash стала так популярна на заре 21 века,
состояла в том, что открытые стандарты не смогли предоставить для различных браузеров совместимый
механизм реализации таких вещей, поэтому различные браузеры реализовали различные конкурирующие
способы выполнения одних и тех же вещей (например, и ), делая тем самым весь процесс
действительно сложным. Flash предоставлял высококачественный, легкий способ реализации работы видео в
различных браузерах.
HTML5 содержит элементы и для простой реализации собственных видео и аудио плееров
с помощью только открытых стандартов, и также содержит API, позволяющий легко реализовать
индивидуальные элементы управления плеером.
API рисования на холсте: Элемент и соответствующий API позволяют определить на странице
область для рисования, и использовать команды JavaScript для рисования линий, фигур и текста, импорта и
манипуляций с изображениями и видео, экспорта в различные форматы изображений, и многих других вещей.
Сокеты Web: Этот API (определенный в спецификации Сокеты Web -http://www.w3.org/TR/websockets/,
отдельно от спецификации HTML5) позволяет открывать постоянное соединение между сервером и клиентом
на определенном порте, и посылать данные в обоих направлениях, пока порт не будет закрыт. Это
существенно улучшает эффективность приложений web, так как данные могут непрерывно и аккуратно
передаваться между клиентом и сервером без постоянной перезагрузки страницы, и без постоянного опроса
сервера, чтобы проверить, нет ли доступных обновлений.
Автономные приложения web: HTML5 предоставляет ряд свойств, позволяющих
приложениям web выполняться в автономном режиме. Кэши приложений позволяют сохранить копию всех
ресурсов и других файлов, необходимых для локального выполнения приложения web, и базы
данных Web SQL позволяют сохранить локальную копию данных приложения web. Совместно они позволяют
продолжать использовать приложение, когда отсутствует соединение с сетью, и затем синхронизируют
изменения с основной версией на сервере, когда сеть снова становится доступной.
Хранилище Web: Cookies предоставляют в какой-то степени локальное хранилище данных, но их
использование довольно ограничено. Web хранилище HTML5 позволяет хранить значительно больше данных,
и делать с ними значительно больше.
Web workers: Общая проблема, встающая перед приложениями web, состоит в том, что
их производительность страдает, когда требуется обработать много данных, в связи с тем, что все происходит
в одной нити/процессе (только одна последовательность обработки может выполняться в текущий
момент). Web Workers смягчают эту проблему, позволяя создавать фоновые процессы для выполнения
значительного объема вычислений, позволяя основному процессу продолжить выполнение других задач.
Геолокация: Спецификация геолокации (http://dev.w3.org/geo/api/spec-source.html) (также не являющаяся
частью спецификации HTML5) определяет API, который позволяет приложению web легко получить доступ к
данным в любом местоположении, которое стало доступным, например, с помощью средств GPS-устройства.
Это позволяет добавлять в приложения различные полезные свойства, связанные с местоположением,
например, выделить контент, который больше подходит для местоположения.
1.2. Новые структурные элементы в HTML5
HTML5 содержит две новые вещи: новые API, которые добавляют существенно важные новые свойства к
открытым стандартам модели разработки web, и новые структурные элементы, которые определяют
специальные свойства страницы Web со значительно более точной семантикой, чем это было доступно
в HTML 4.
Введение в структурные элементы HTML5
HTML4 имеет множество семантических элементов, позволяющих четко определять различные свойства
страницы Web, такие как формы, списки, параграфы, таблицы и т.д. Однако он имеет и свои недостатки.
Существенно используются элементы и с различными атрибутами id и class для
определения различных других свойств, таких как навигационные меню, верхние и нижние колонтитулы,
основной контент, окна предупреждения, боковые панели, и т.д. Что-нибудь типа