Html5 что это

HTML5: что это и в чем преимущества

Почти 85% сайтов используют технологию HTML. Последняя версия — HTML5. На ней работает около 90% HTML-сайтов.

Рассказываем все, что нужно знать об HTML5.

HTML5: что это и для чего нужно

HTML — язык разметки, который используют для создания веб-страниц. Один из его основных элементов — теги. Между начальным и конечным тегом находится текст, который показывает свое значение, функции, вид или размер. Например, и отображается с большим размером, чем основной текст.

Теги формируют текстовую структуру с помощью элементов, обозначенных символами «».

В старом HTML для работы других языков требовалось дополнительное ПО. Код HTML по-прежнему обеспечивает базовую структуру, но теперь он также включает каскадные таблицы стилей (CSS) и Javascript. HTML5 объединяет все основные языки интернет-дизайна. В последней версии HTML разработчики также могут интегрировать аудио и видео.

HTML и HTML5: в чем разница

Одно из главных различий — размещение мультимедиа (аудио и видео на страницах). Раньше это было возможно только с помощью большого HTML-кода и дополнительных программ. В HTML5 для этого нужен только один тег.

Также в HTML5 можно использовать Canvas, SVG и другую виртуальную векторную графику. Раньше для этого требовались дополнения — VML, Silverlight и Flash.

В старом HTML только кэши браузера могли использовать базы данных SQL. Последняя версия HTML позволяет всем страницам временно хранить данные в кэше приложения через онлайн-базу данных. Благодаря этому Javascript может работать в фоновом режиме браузера.

В новой структуре HTML5 также отсутствует стандартный обобщенный язык разметки (SGML). Это обеспечивает улучшенную совместимость. HTML5 избавился от устаревших элементов — noframes, acronym, font, big, strike, center и frame. Он вводит новые типы элементов — электронная почта, дата и время, диапазон, номер, URL-адрес, поиск. А также сводку основных тегов, аудио, метку, навигацию, источник, видео, дорожку, дату, время.

Преимущества HTML5 для разработчиков

• Лучше поддерживаются функции веб-приложений

Раньше для использования веб-приложений нужны были расширения браузера и серверные технологии. HTML5 объединяет все важные элементы (например, Flash и Javascript).

• Стандартизированная обработка ошибок

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

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

• Персонализированные атрибуты данных

Разработчики и раньше могли добавлять собственные атрибуты, но часто они вызывали недействительные и неверные документы или останавливали работу страницы. Атрибут «data- *» в HTML5 решает эти проблемы. Его функция — хранить дополнительную информацию об элементах. Например, нужно определить тип блока DOM (section, footer) и присвоить ему идентификатор, чтобы позже добавить CSS-стили. Для этого в HTML 5 добавили атрибуты данных.

Код HTML5 стал лучше поддерживаться смартфонами и планшетами.

HTML5 использует веб-хранилище или локальное хранилище для замены файлов cookie, которые могут содержать лишь небольшой объем данных.

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

С другой стороны, веб-хранилище позволяет держать данные на компьютере клиента постоянно (если пользователь не стирает их), оно также имеет больший объем данных (5 МБ вместо 4КБ).

курсы по теме:

Python для разработки и анализа данных

HTML5

HTML5 — последняя и наиболее мощная редакция языка разметки HTML, включающая новые компоненты, атрибуты и функциональность. Под термином также понимается набор технологий для создания сайтов и веб-приложений. Термин включает более десяти отдельных стандартов, некоторые из которых до сих пор находятся в процессе утверждения. Не все веб-браузеры полностью поддерживают HTML5 (или каждый браузер по-разному).

Что такое HTML

HTML (HyperText Markup Language), или язык разметки гипертекста (не путать с языком программирования), представляет собой формат документов, включающий в себя следующие компоненты:

• сам текст;
• теги (элементы) для выделения и структурирования текста.

Словарь HTML включает множество различных тегов, все они описаны в стандарте, поддерживаемом международной организацией World Wide Web Consortium (W3C). Последняя актуальная версия языка HTML имеет номер 5.3. В документе перечислены все элементы, которые могут быть использованы при написании кода веб-страниц. Словарь представляет собой обширный набор, к которому может потребоваться частое обращение.

Освойте профессию «Frontend-разработчик»

Frontend-разработчик

Научитесь создавать удобные и эффектные сайты, сервисы и приложения, которые нужны всем. Сегодня профессия на пике актуальности: в России 9000+ вакансий, где требуется знание JavaScript.

Профессия / 9 месяцев
Frontend-разработчик

Создавайте интерфейсы сервисов, которыми пользуются все

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

Набор технологий HTML5

HTML5 предлагает программные интерфейсы (API) для обработки видео и аудио, реализации чатов, включая видеочаты через браузер, а также множество других увлекательных интерактивных возможностей. Даже браузерные игры разрабатываются с использованием HTML5. Известный всем сервис YouTube перешел на HTML5, отказавшись от обязательной зависимости от Flash.

Когда речь заходит о создании интерактивных веб-сайтов и использовании AJAX, практически всегда подразумевается применение технологий HTML5.

Преимущества и отличия HTML5 от предыдущих версий

Формально, процедура перехода с обычного HTML (HTML4) на HTML5 предельно проста: нужно включить тег в начало кода веб-страницы для определения типа документа.

  
Заголовок
 пример текста 
НАЖМИ СЮДА

Таким образом, ваш документ будет соответствовать стандарту HTML5.

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

Однако в HTML5 добавлено множество новых технологий и возможностей.

• Мультимедийный контент: HTML5 audio и video.
• Улучшенные формы: API валидации, новые атрибуты, значения для атрибута type тега и новый элемент .
• Новые семантические элементы:, , , , , , и .
• MathML для математических формул.
• Веб-сокеты: постоянное соединение между страницей и сервером для обмена данными без перезагрузки страницы.
• WebRTC: возможность общения в реальном времени и видеоконференции в браузере без дополнительных плагинов.
• Server-sent события: сервер отправляет события клиенту, обеспечивая интерактивные обновления страницы.
• Офлайн-работа: кеширование приложения и офлайн-события.
• Хранилище и работа с файлами: структурированные данные на стороне клиента и HTML5 File API для работы с файлами.
• Camera API: взаимодействие с камерой устройства.
• WebGL и SVG: трехмерная графика () и формат векторных изображений на основе XML и другие возможности.

В целом, HTML5 предоставляет более широкий набор инструментов для создания интерактивных и богатых визуальных веб-приложений. Вот некоторые основные различия между HTML5 и предыдущими версиями (например, HTML 4):

Характеристика	HTML5	Старые версии HTML (например, HTML 4)
Структура	Введены новые семантические элементы, такие как , , , и другие, что улучшает структурирование контента	Отсутствие четко определенных семантических элементов
Мультимедиа	Поддержка нативных элементов для аудио и видео с возможностью воспроизведения без сторонних плагинов	Зависимость от плагинов, таких как Flash, для воспроизведения мультимедийного контента
Хранение данных	Поддержка локального хранилища (LocalStorage и SessionStorage) для сохранения данных на стороне клиента	Отсутствие таких механизмов; использование куки и других методов хранения данных
Графика	Введение элемента для создания графики и рендеринга с помощью JavaScript	Отсутствие нативного способа создания графики на веб-странице
Валидация форм	Встроенная поддержка валидации форм с использованием атрибутов required, pattern и других	Отсутствие встроенной валидации, требование к JavaScript для проверки данных формы
Семантика	Большее внимание к семантике элементов, что способствует лучшей индексации поисковыми системами и доступности	Меньшее внимание к семантике, что могло приводить к сложностям в индексации и доступности
Обработка ошибок	Поддержка более строгой обработки ошибок, что помогает избежать некорректного отображения страницы	Меньшая строгость в обработке ошибок, что иногда могло приводить к непредсказуемому поведению
Геолокация	Возможность определения географического положения пользователя через API геолокации	Отсутствие нативного механизма для определения геолокации
Оффлайн-режим	Встроенная поддержка оффлайн-режима с помощью Application Cache и Service Workers	Отсутствие нативной поддержки оффлайн-режима

Отличие HTML от HTML5

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

Самое значимое различие между старыми версиями HTML и HTML5 заключается в интеграции видео и аудио в спецификации языка.

Станьте Frontend-разработчиком
и создавайте интерфейсы сервисов, которыми пользуются все

Как редактировать HTML5

Создание разметки HTML5 осуществляется с использованием тех же инструментов, что и разметка обычного HTML. Можно начать с простого «Блокнота» в операционной системе Windows и продвигаться к современным инструментам разработки, предоставляющим встроенные шаблоны для быстрого создания документов с расширением .html, таких как Notepad++ и Sublime Text.

Для более углубленной работы с HTML5 и обучения существует ряд полезных ресурсов в открытом доступе.

• Справочник по HTML5 на портале Mozilla Developers Network: ресурс предоставляет обширное руководство и справочник по HTML5 от Mozilla, который может быть полезным для понимания особенностей и функциональности HTML5.
• Руководства freeCodeCamp по HTML: предоставляет образовательные материалы для программирования, включая подробные руководства по HTML5, которые могут помочь в освоении языка разметки.
• Справочник по элементам HTML от W3Schools: предлагает понятный и наглядный справочник по элементам HTML, который может быть полезным для изучения и практического применения различных тегов и атрибутов.
• Справочник DevDocs по HTML: онлайн-сервис, который предоставляет справочные материалы по различным технологиям, включая HTML5.

Ресурсы помогут углубить знания о HTML5, освоить функционал и научиться создавать более интерактивные и современные веб-страницы.

Как научиться писать на HTML5

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

Читайте также С чего начать изучать HTML и CSS

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

Перенятие и адаптация чужого кода являются стандартной практикой в программировании и часто считаются проявлением Open Source, популярного и прогрессивного движения.

Для создания интерактивных веб-сайтов с более сложной функциональностью и современным привлекательным дизайном, желательно дополнительно погрузиться в темы CSS, JavaScript, веб-дизайна и пр. Такое обучение требует более фундаментальной подготовки и понимания.

По мере обучения вы постепенно научитесь создавать собственные веб-проекты и будете готовы заявить о своей компетентности, претендуя на роль junior-разработчика.

Зачем нам нужен HTML5: пять простых ответов

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

1. HTML5 — новый подход к разметке: мультимедиа внутри

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

Однако действующий стандарт не предусматривал описания мультимедийного контента средствами самого языка: для этого использовалась функция вставки некоего объекта («object»), возможность воспроизведения которого зависела от того, установлены ли в браузере клиента совместимые с таким контентом дополнительные плагины третьих разработчиков.

Говоря о подобных плагинах, мы прежде всего имеем в виду Adobe Flash, QuickTime или менее распространённые Real Player и Silverlight. Всё это — «надстройки», дополнения к браузерам, не являющиеся их составной частью и выполняющие роль неких посредников, которые преобразуют загружаемый цифровой контент в видео и звук.

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

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

Для интеграции аудио или видео в HTML5 достаточно использовать простой набор тэгов, описывающих, какой тип контента вы намерены поместить («video» или «audio»), и обычные ссылки на соответствующие медиафайлы.

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

2. Проблема обратной совместимости: сначала HTML, потом плагины

К сожалению, в мире остаётся значительная часть пользователей, у которых установлены устаревшие браузеры, вполне их устраивающие, но не поддерживающие все возможности HTML5. Прежде всего, речь идёт об Internet Explorer версии 8, до сих пор считающейся самой популярной для этого браузера. Последующие версии — IE 9 и 10 — уже практически полностью поддерживают HTML5. Что касается Chrome, Opera и Safari, то они уже в течение нескольких лет способны обрабатывать теги «video» и «audio».

Тем не менее для обеспечения обратной совместимость в HTML5 сохраняется поддержка использования плагинов (тега «object»), но по схеме «сначала HTML, а потом уже плагины». Это означает, что браузер должен сначала осуществлять рендеринг страницы с использованием тегов «video» и «audio» — и лишь при невозможности сделать это применять код плагинов.

Для обеспечения правильного функционирования такого подхода можно использовать одну из множества доступных библиотек JavaScript, часть из которых предоставляет полностью интегрированный программный интерфейс (API) для управления как HTML-контентом, так и встроенными объектами. Среди них, в частности, можно назвать Projekktor или программный видеоплеер Video.js, обеспечивающие полную совместимость как с HTML5, так и со старыми браузерами, в которых применяются плагины.

3. Единый подход к десктопным и мобильным платформам

Поддержка нового стандарта HTML5 обеспечивается и практически на всех современных мобильных устройствах, включая iOS, Android и Windows Phone, в чём заключается ещё одно его важное достоинство. Веб-мастеру уже не нужно размещать несколько версий медиаконтента для «полноценных» компьютеров и мобильных устройств. Известно, что iOS полностью несовместима с Flash, а ОС Android совместима лишь частично. В случае с HTML5 эта проблема полностью снимается.

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

4. Поддержка разных форматов видео и звука

Несмотря на то что HTML5 позволяет размещать на веб-страницах медиафайлы простыми стандартными тэгами, такие файлы могут быть закодированы в самые разные форматы и самыми разными кодеками. Между тем пока не существует какого-то стандартного сочетания формата (контейнера) и кодека, которое с равным успехом работало бы во всех браузерах и мобильных системах.

Самые популярные контейнеры для интернет-видео — это AVI, MP4, FLV и WebM, а основных «сетевых» видеокодеков всего три: H.264, Ogg Theora и VP8. При этом каждому кодеку обычно (но далеко не всегда) лучше всего соответствует свой формат контейнера: H.264 — MP4, Theora — OGG, VP8 — WebV.

Кодек H.264 сжимает видео с потерями, чтобы получить файл высокого качества, но небольшого размера. При этом спецификация предусматривает несколько профилей с разным качеством и степенью сжатия, чтобы на маломощные мобильные устройства можно было транслировать «лёгкие» файлы, а на десктопы с широкополосными доступом — более качественное видео.

Хотя H.264 — коммерческий кодек, то есть предполагает лицензионные отчисления, он наиболее универсален: его встроенная поддержка есть в Internet Explorer, Chrome, Firefox, Safari, iOS и Android, а отсутствует лишь в Opera, где такое видео декодируется только через внешний плагин.

Кодек Ogg Theora, изначально рассчитанный на системы под Linux, вначале тоже был коммерческим, но теперь лицензируется бесплатно. Встроенная поддержка имеется в браузерах Chrome, Firefox и Opera, в Internet Explorer и Safari доступен только через плагины.

Кодек VP8, ориентированный на мобильные устройства, распространяется Google на условиях Open Source и обеспечивает качество, сходное с H.264, при меньшей сложности декодирования. Встроенная поддержка есть в Chrome, Firefox и Opera, а также в мобильных устройствах под управлением Android.

Таким образом, чтобы обеспечить воспроизведение видеоконтента практически на всех существующих системах, достаточно выкладывать файлы в контейнерах MP4 в стандарте кодирования H.264 и в формате WebM с кодеком VP8. Поскольку изо всех современных десктопных браузеров встроенная поддержка H.264 отсутствует только в Opera, такие сочетания будут самыми универсальными.

5. Существует обширная общедоступная документация

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

Прежде всего речь об официальной последней рабочей версии консорциума W3C, в рамках которого ведётся непосредственная разработка HTML5.

На сайте разработчиков Mozilla приводится справочник тэгов, причём элементы, которые были добавлены в HTML5, выделены особо.

Подробные описания подхода к интеграции видео в HTML5 можно найти здесь и здесь (тоже на английском языке).

На русском языке краткий справочник HTML5 с примерами применения новых элементов имеется на сайте Puzzleweb.ru.

Кроме того, на русский язык переведено уже довольно много книг по HTML5, среди которых, например, «HTML5 для профессионалов», «Погружение в HTML5» или «Самоучитель HTML5».

HTML5

HTML 5 (англ. HyperText Markup Language 5) — пятая версия одного из главных языков разметки веб-страниц, HTML. Версия языка, полностью соответствующая стандарту XML называется XHTML 5.

HTML5 включает в себя элементы как HTML4, так и xHTML (версия языка разметки веб-страниц, соответствующая спецификациям XML), а также интерфейс для доступа к HTML и XML-объектам Document Object Model.

Многие идеи HTML 5 были изначально предложены WHATWG в стандарте Web Applications 1.0. HTML 5 включает другой стандарт WHATWG, Web Forms 2.0.

Главной альтернативой HTML5 в браузерах является использование JavaScript, SVG, Adobe Flash, Silverlight, а для интерактивных веб-приложений — AJAX.

2007-2008: Старт разработки стандарта

Разработка HTML 5 началась в новой рабочей группе W3C в 2007 году.

Первый черновик спецификации стал доступен широкой общественности 22 января 2008.

Изначально HTML создавался как платформенно независимый язык для разметки технической документации с использованием гиперссылок, при этом вся мультимедийная составляющая была привнесена туда много позднее. Задача HTML5 достаточно тривиальна – обеспечить поддержку распространенной мультимедийной информации исключительно при помощи ресурсов самого браузера. Российский рынок мобильных приложений для бизнеса и госсектора: крупнейшие игроки, тенденции и перспективы. Обзор TAdviser

Также отличия HTML5 от новой версии включают более удобную разметку, новые семантические теги, коррекцию значений тегов, поддержку canvas и svg. Речь также идет о новых API для разработки веб-приложений, правда, с точки зрения спецификации, это отдельные стандарты (например, Web Storage), прорабатываемые в WebApps WG внутри W3C. Наиболее ожидаемые элементы разметки, которые предполагалось ввести в новой версии HTML, — это audio (звук), video (видео), а также множество новых семантических тегов, таких как тег nav (навигация).

2010: Microsoft запускает альтернативу W3C — HTML5 Labs

Корпорация Microsoft анонсировала в декабре 2010 года запуск нового проекта под названием HTML5 Labs, который должен собрать различные разработки прототипов или неутвержденных версий спецификаций веб-стандартов. Проект является альтернативным по отношению к деятельности консорциума W3C и ориентирован на поддержку HTML5 в веб-браузере Microsoft Internet Explorer 9. В нем уже описаны два прототипа – разработки IndexedDB (реализация системы хранения больших объемов структурированных данных (закладок, писем и т.п.) в виде базы данных с возможностью быстрого поиска) и WebSockets (замена системы обмена данными по протоколам в виде единого транспортного сокета TCP-протокола). Тем не менее пока Microsoft не считает их готовыми настолько, чтобы применить в IE9. Однако корпорация не говорит о «мертворожденности» этих стандартов и предлагает разработчикам улучшить их или создать другие решения в контексте развития HTML5.

Консорциум World Wide Web Consortium объявил в октябре 2012 года о планах, согласно которым окончательная версия стандарта HTML5 будет утверждена к 2014 году, а HTML 5.1 — к 2016-му.

Чтобы избежать проблем прошлого, теперь HTML решено развивать более модульно, этим и обусловлено решение сразу приступить к созданию версии 5.1. Изначально в HTML5 хотели включить ряд элементов, сейчас ставших отдельными спецификациями, — Web Storage, Web Workers и WebSocket Protocol. Но теперь все нестабильные компоненты решено вынести в отдельную версию HTML 5.1. Это позволит W3C сосредоточиться на повышении стабильности и межбраузерной интероперабельности остальных компонентов HTML 5.

W3C будет непросто достичь намеченных целей: в это время согласно сайту коонсорциума, в HTML5 десять нерешенных проблем, 300 ошибок и 11 особенностей, получивших формальные возражения разработчиков.

2012: W3C представил окончательные спецификации HTML5

Глобальный консорциум по веб-стандартизации W3C объявил в декабре 2012 года о завершении процесса формирования спецификаций HTML5. Новые спецификации признаны целостными и стабильными, благодаря чему разработчики и представители бизнеса теперь официально могут рассматривать их как стандарт для «реализации и планирования» своих веб-проектов.

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

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

Консорциум планирует разработать тесты на корректность реализации стандартов в существующем ПО и наладить работу с сообществом по проведению данных тестов. Тестирование позволит W3C убедиться, что все десктопные, мобильные и веб-приложения, применяющие HTML5 — браузеры, системы создания и управления контентом, почтовые клиенты, серверные приложения — одинаково корректно внедрили предложенные спецификации.

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

Согласно списку на сайте W3C, в стандарт HTML5 войдут следующие документы: описание базового API; описание языка разметки HTML (синтаксис, атрибуты, типы данных); список отличий HTML5 от HTML4; описание средств обеспечения доступности для людей с ограниченными возможностями, а также ряд документов, охватывающих специфические аспекты HTML. Так, отдельные документы будут посвящены механизму Microdata, позволяющему авторам добавлять на свои веб-страницы элементы, для которых нет соответствующих HTML-тэгов или атрибутов, а также XML-совместимой разметке XHTML и возможностям тэга alt.

Кроме того, консорциум выпускает документ, содержащий отдельную спецификацию для Canvas 2D — элемента HTML5, позволяющего создавать внутри HTML-документа векторные изображения при помощи JavaScript.

Одновременно с завершением работы по стандартизации HTML5 началась подготовка будущей серии стандартов HTML, сообщает W3C. В частности, уже готовы первые черновики HTML 5.1 и HTML Canvas 2D Context, Level 2. В новейшей версии HTML5 будет введен принципиально новый элемент «main», предназначенный для выделения основного значимого контента страницы. Черновые спецификации для этого крупного нововведения уже опубликованы на сайте W3C.

Всего за несколько дней до выпуска HTML5 консорциум наконец-то представил еще один открытый веб-стандарт — стандарт веб-шрифтов WOFF (Web Open Font Format). WOFF представляет собой открытую спецификацию контейнера для структуры SFNT, использующейся в шрифтах TrueType и OpenType, предназначенную для реализации в Web.

Первый черновик WOFF был представлен в 2010 году, и реализации стандарта уже существуют во всех крупных десктопных браузерах, включая Chrome, Firefox, Safari и Internet Explorer. Мобильные браузеры в этом плане отстают — новый стандарт не успели внедрить ни в предустановленный браузер Android, ни в Opera Mini.

2013: Быстрое распространение HTML5

Эксперты аналитической компании ABI Research (данные апреля 2013 года) предполагают, что к концу 2013 года общее количество смартфонов и планшетов, чьи интернет-браузеры будут поддерживать технологию HTML5, превысит 1,4 млрд. единиц. Таким образом, количество мобильных устройств с поддержкой этой технологии в сравнении с 2012 годом вырастет на 87%. Несмотря на то, что в это время разработчики приложений предпочитают создавать так называемое нативное программное обеспечение, созданное с привязкой под определённую платформу, программисты более не смогут игнорировать появление громадного числа гаджетов на базе HTML5, и поэтому следует ожидать развития рынка веб-приложений.

По словам аналитика ABI Research Aaпo Маркканена, HTML5 развивается в основном благодаря разработчикам, использующим кросс-платформенные средства разработки софта. Пока такие приложения уступают нативным, в том числе по скорости работы. Ситуация может измениться по мере более глубокого внедрения HTML5 в среду операционной системы. В первую очередь, это касается Firefox OS, Sailfish, Tizen и Ubuntu. Поддержка HTML5 на аппаратном уровне также благоприятно скажется на популярности технологии, считает Маркканен.

Интерес разработчиков к HTML 5 может быть вызван и растущими проблемами Google и её ОС Android c европейскими антимонопольными органами, что может сделать эту платформу более рискованной с точки зрения инвестиций. В то же время популярности HTML может поспособствовать недавно заявленное между Samsung и Mozilla сотрудничество по созданию открытого движка Servo для веб-браузеров.

2014: W3C утвердил стандарт HTML5

28 октября 2014 года консорциум W3C утвердил стандарт HTML5. Таким образом, завершена работа над спецификациями этой технологии разметки веб-страниц. Опубликованный финальный документ с рекомендациями разработчиков занял более 1,3 тыс. страниц. [1]

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

«Сейчас мы не думаем о том, как посмотреть видеоролик или послушать музыку прямо в браузере, и не задумываемся о работе браузера в мобильном телефоне. Мы лишь хотим делиться фотографиями, совершать покупки, читать новости и искать информацию везде и всюду, на любом устройстве. Большинство пользователей не видят, как стандарт HTML5 и среда Open Web Platform позволяют воплотить их мечты в реальность», — сказал Тим Бернерс-Ли (Tim Berners-Lee), директор W3C и один из изобретателей Всемирной паутины.

Финализация HTML5 является лишь формальной процедурой, поскольку этот стандарт давно поддерживается многими современными браузерами, включая мобильные. По данным исследования Vision Mobile, около 42% разработчиков ПО для смартфонов и планшетов пользуются HTML5 наравне с CSS и JavaScript.

Завершена работа над спецификациями стандарта разметки веб-страниц HTML5

Главный исполнительный директор W3C Джефф Джаффе (Jeff Jaffe) заявил, что после завершения процесса стандартизации HTML5 консорциум сосредоточится на развитии комплексной среды разработки кроссплатформенных приложений Open Web Platform. Для этого планируется уделять внимание таким ключевым областям, как безопасность и конфиденциальность данных, взаимодействие устройств, продолжительность жизненного цикла приложений, социальные сервисы и коммуникации в реальном времени, производительность и юзабилити, отметил Джаффе.

Ранее сообщалось, что фактическое утверждение HTML5 может состояться не раньше 2020 года, однако в W3C решили ускорить этот процесс, создав специальную рабочую группу, которая независимо от основных разработчиков стандарта занималась созданием своих спецификаций. [2]

Версия стандарта HTML — с индексом 5.1 — уже разрабатывается. Её окончательный вариант планируется утвердить в конце 2016 года.

HTML5 предлагает способ создания мультимедийного контента и требуемой функциональности приложений без использования нестандартных настроек над браузерами. Он позволяет решать в Web и множество других задач, например отображать масштабируемую векторную графику (SVG) и математические символы и конструкции (MathML).

В настоящее время HTML5 предлагает многоплатформенную альтернативу написанию приложений для каждой конкретной мобильной платформы: Android, iOS и т. д. По оценкам аналитиков Vision Mobile, около 42% разработчиков мобильных приложений используют при создании своих программ, наряду с JavaScript и каскадными таблицами стилей (Cascading Style Sheets, CSS), и язык HTML.

7 причин перейти на HTML5

HTML5 – новый этап стандартизации веба

Распространено заблуждение, что HTML5 – это новый язык разметки, который не будет понятен старым версиям браузеров, которые сейчас в основном установлены у пользователей. Многие думают, что все те возможности, которые активно афишируют сторонники HTML5, будут доступны только тем, кто имеет самые последние версии браузеров. [3]

На самом деле, HTML5 это все тот же язык разметки, понятный браузерам, в который просто добавили дополнительные инструменты для работы с объектами и мультимедиа. По сути это просто новая версия уже давно используемого в Интернете стандарта HTML4, стандартизированного Консорциумом W3C в 1997 году. Таким образом, с точки зрения разработчиков, HTML5 – это не есть что-то принципиально новое, на чем нужно будет учиться работать. Новый стандарт просто расширил возможности разработчиков. Теперь среда HTML5 позволяет реализовать те визуальные «фишки» и опции, которые раньше были доступны только благодаря технологии Flash.

Сам разговор о том, приживется или нет технология HTML5 в веб-разработке, лишен всякого смысла: распространение HTML5 – это новый этап стандартизации веб-технологий W3C. Известен даже предположительный срок, когда должна осуществиться полная доработка всех компонентов HTML5 – 2014 год. После этого Консорциум W3C объявит рекомендацию всем разработчикам о применении нового стандарта верстки. Так же, как это когда-то произошло с HTML4 в 1997 году и его предшественниками еще раньше. Вопрос выбора альтернативы даже не стоит – все браузеры будут поддерживать HTML5 по умолчанию.

Физические законы в «цифре»

Какими возможностями обладает HTML5? По сути это пустая оболочка, в которую можно внедрить что угодно. Благодаря таким инструментам, как Box2D, Canvas, на сайте можно реализовать 3D-модели объектов, которые будут перемещаться и взаимодействовать друг с другом по физическим законам.

«Многослойность» сайта

Благодаря HTML5, можно внедрить сложную анимацию на корпоративный сайт, как это в последнее время стало распространенным. При этом анимированные компоненты не будут смешиваться с содержимым страницы, они будут как бы на разных «слоях» и будут ограничиваться контурами объекта, а не областью его движения/трансформации. Чтобы лучше понять разницу, приведем простой пример. Если в качестве анимированного объекта, перемещающегося поверх сайта, сделать автомобиль, то при реализации с использованием технологии Flash кликабельным будет весь прямоугольник, в который вписан контур машины, даже если визуально там будет находиться текст основного содержания страницы. HTML5 работает более корректно и позволяет избежать данного `побочного эффекта`. Даже при отклонении в 10 пикселей от объекта анимации сайт будет воспринимать нажатие как работу с другим «слоем».

Анимация без границ

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

Третье измерение

HTML5 позволяет придать сайту эффект трехмерного пространства. Те же самые «слои» могут перемещаться при скроллинге с разной скоростью и, таким образом, формировать эффект параллакса.

Работа с видео без сбоев

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

Работа без перезагрузки внутренних страниц

Большим сдерживающим фактором в распространении HTML5 было то, что многие браузеры далеко не полностью использовали возможности языка javascript. Особенно это касалось браузера Internet Exporer, чья доля была очень высока, но который практически не поддерживал javascript. Новая технология Ajax позволяет делать сайты на HTML5 без перезагрузки внутренних страниц. Не надо ждать, пока сменится контент, интерфейс остается неизменным и подгружается практически мгновенно. Фактически сайт становится похожим на программу.

Конфиденциальность в эпоху HTML5

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

HTML5 — последняя версия языка Интернета, была разработана с прицелом на веб-приложения. Она содержит множество новых интерфейсов прикладного программирования (API), которые нужны веб-разработчику для аппаратного и программного доступа к устройствам с помощью JavaScript.

Вот наиболее интересные спецификации HTML5:

• API Геолокации позволяет браузеру знать, где вы находитесь
• Media Capture API разрешает браузеру доступ к камере и микрофону
• File API разрешает браузеру доступ к файловой системе
• Web Storage API позволяет веб-приложениям хранить большие объемы данных на вашем компьютере
• Спецификация DeviceOrientation Event позволяет веб-приложениям знать, когда ваше устройство изменяет ориентацию с книжной на альбомную.
• Messaging API дает браузеру доступ к системе сообщений мобильного устройства
• Contacts Manager API позволяет получить доступ к контактам, сохраненным в базе данных контактов пользователя

Прочитав этот список, вы может заключить, что HTML5 разработан специально для хакеров и кражи личных данных. Однако, в реальности авторы HTML5 относятся к конфиденциальности очень серьезно.

HTML5 улучшает сетевую безопасность, позволяет обойтись без плагинов

Нынешнее состояние сети, даже не беря во внимание HTML5, включает в себя отслеживающие cookie, флеш-cookie и взломанные веб-сайты, распространяющие вредоносное ПО. Кроме того, 6,3% веб-серферов по всему миру (многие из них из Китая) по-прежнему используют исключительно небезопасный Microsoft Internet Explorer 6.

HTML5 стремится сделать Web более безопасным, в частности, за счет устранения необходимости плагинов для браузера. Это отличное начало. Два наиболее часто устанавливаемых модуля браузера — Java и Flash, также являются двумя крупнейшими дырами в безопасности в любом браузере.

Просто будучи установленными, плагины делают браузер менее безопасным. Но дело не только в этом. Плагины, как правило, написаны для нескольких операционных систем. Уязвимости в плагинах, таких как Java или Flash — это уязвимости в Windows, MacOS и Linux. Другой проблемой является то, что большой процент установленных плагинов не имеют последних обновлений безопасности. В целом, плагины представляют собой большую проблему.

Многие из новых функций HTML5 — встроенное видео и аудио воспроизведение, векторная и растровая анимация, доступ к устройствам и сетевое хранение, предназначены для устранения необходимости плагинов. Цель — собрать то, что считалось «лишними» функциями под крышей браузера и, что более важно, под крышей утвержденных стандартов безопасности и конфиденциальности, а затем интегрировать в гораздо более последовательной, осторожной манере.

Доступ к устройству через API в HTML5 и настройки конфиденциальности

Доступ к такой широкой категории устройств через API представляет ещё одну потенциальную проблему конфиденциальности HTML5. Для многих из нас кажется естественным, что продолжающееся расширение сети и интернетизации всевозможных устройств создаёт много инновационных продуктов и услуг. Так же как и в настольных приложениях, где Web-приложения охватывают многие задачи, которые ранее были прерогативой пакетов программного обеспечения, так и в мобильных устройствах всё смещается в сторону Интернета.

Самым большим недостающим элементом сегодняшних мобильных веб-приложений является ограниченный доступ браузера к возможностям устройства по сравнению с возможностями родных мобильных приложений. Мобильное веб-приложение не может, например, включить виброзвонок телефона, проверить текущее состояние батареи или измерить освещенность. Однако, большинство новых мобильных браузеров могут получить доступ к вашему текущему местоположению и камере. Поскольку эти новые возможности встроены в браузеры, неприкосновенность частной жизни становится серьезной проблемой.

В «родных» приложениях настройки конфиденциальности устройства, как правило, настраиваются в процессе установки. Например, при установке приложения Android вы получаете уведомление о типах доступа, требуемых приложению. В этот момент вы можете разрешить или запретить запрошенный доступ. После установки приложения настройки сохраняются и приложение может получить доступ к камере, контактам и чему угодно что вы разрешили.

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

Чтобы понять, как браузеры справятся с этой потенциальной проблемой, мы должны сначала определить некоторые термины:

• Уведомление — обязательное требование для API, сообщающее пользователю о сборе данных. В настоящее время браузеры имеют немного другие механизмы уведомлений, но панель уведомлений в верхней части окна браузера становится наиболее распространенным методом. Вы можете увидеть пример вызова уведомления API, посетив сайт, который использует геолокацию HTML5 с браузером, который поддерживает геолокацию — последние версии всех основных браузеров умеют это.

• Согласие — процесс выдачи разрешения пользователем доступа API к устройству. Согласие может быть явным или неявным. Например, если вы нажмете кнопку «сфотографировать», вы неявно дали приложению разрешение на использование камеры. С другой стороны, если вы нажмёте кнопку «Отправить другу», вы не даёте разрешение API на спам кому-либо через базу данных ваших контактов. Каждый API в HTML5 предполагает, что явное разрешение требуется по умолчанию, но определяет обстоятельства, при которых неявные разрешения является приемлемыми.

• Минимизация — требование, чтобы API позволялось собирать только необходимый для текущей задачи минимум информации.

• Управление — возможность пользователя управлять выбором разрешений. Пользователи должны иметь возможность отозвать доступ браузера к устройству, после того как они его дали. Опционально, они должны иметь возможность вести белый и черный список приложений.

• Наконец, доступ — возможность пользователя просматривать и удалять историю совместно используемого устройства.

• Геолокация, пожалуй, потенциально самый большой нарушитель конфиденциальности в HTML5. Интересно, что она также является одним из наиболее широко реализованных API. Чтобы получить представление о мерах защиты конфиденциальности в API устройства, полезно посмотреть, как это реализуется в геолокации.

Раздел 4 предлагаемой спецификации API геолокации посвящен конфиденциальности. Он делит конфиденциальность на два направления: соображения для исполнителей API геолокации (создателей браузера) и для получателей информации о местоположении (разработчиков программного обеспечения).

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

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

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

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

Решений для защиты конфиденциальности немного

Консорциум World Wide Web разработал платформу Privacy Preferences Project (P3P) для решения такого рода проблем путем создания стандартного языка, с помощью которого веб-сайты могли бы обмениваться политиками конфиденциальности. С P3P браузеры могли информировать пользователей о политике сайта и даже позволять им отказаться от посещения сайтов с политикой, с которой они не согласны. Однако P3P не завоевал популярности у создателей браузеров, поэтому работа над ним была приостановлена.

Группа Защиты Конфиденциальности (Privacy Interest Group) консорциума W3C и Рабочая Группа Защиты от Слежения (Tracking Protection Working Group) представляют из себя две единственные силы по укреплению и стандартизации безопасности и конфиденциальности в Интернете и в HTML5.

Пожалуй, самым заметным достижением в конфиденциальности браузеров в последние месяцы является реализация спецификации, запрещающей отслеживание – Do Not Track (DNT), – всеми основными производителями браузеров. Некоторые браузеры, включая Internet Explorer 10, зашли так далеко, что включают DNT по умолчанию.

DNT является преференцией браузера, и отправляется через заголовок HTTP на веб-сайты. На самом деле, это довольно слабая защита, но веб-сайты в настоящее время должны добровольно соблюдать пользовательские предпочтения не быть отслеженными.

Хотя рекламная индустрия в целом сказала, что будет уважать предпочтения DNT, мало что было сделано в этом направлении. Предлагаемый в Калифорнии закон (California Right to Know Act) 2013г., например, позволил бы людям требовать у бизнеса отчета о том, что бизнес знает о них. После того, как ему противостояли лобби промышленных групп Интернета, закон был снят с рассмотрения, по крайней мере, до конца 2013 года.

При отсутствии добровольного жизнеспособного механизма для сайтов раскрывать свои политики, похоже, законодательство — единственное решение проблемы, которая только усугубляется, поскольку маркетологи собирают всё больше данных о пользователях. Руководитель Федеральной Торговой Комиссии, Эдит Рамирес, недавно призвала рекламную индустрию выполнить свои DNT-обещания. В то же время, законопроект о DNT был предложен в Конгрессе, и сейчас ему уделяется всё больше внимания, пока стандарт активно обсуждается.

HTML5 vs Flash

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

Разработчиками языков программирования постоянно внедряются все новые и новые проекты и технологии, чтобы дать возможность сайтам раскрывать весь свой потенциал и заменять многомиллионные рекламные кампании. Да, именно так: удобный для пользователей ресурс с ярким и необычным дизайном, находящийся в ТОП поисковой выдачи, эффективнее любой рекламы. Ей пользователи уже давно не верят, а вот своим глазам и ощущениям – да. Сейчас в руках веб-дизайнеров появился новый мощный инструмент, позволяющий им реализовывать все свои задумки и открывающий двери в мир светлого будущего сайтостроения. Речь идет о html5.

Html5 vs Flash: битва титанов

Flash остается в прошлом. И что бы ни говорили его сторонники, это так. Несмотря на все присущие новому стандарту html недостатки – от явной «необкатанности» до высокой ресурсоемкости, именно он вытеснит технологию Flash. Упрощенный сервис, отсутствие необходимости устанавливать всевозможные плагины, кросс-платформенность с кросс-браузерностью 5-го html являются его главными «плюсами» и залогом успеха. Да, нужно признать, что у Flash пока что есть некоторое преимущество в плане качества анимации, видео, векторных изображений. Но с каждым днем все больше сайтов, написанных с помощью html5, превосходят своих «флешевых» конкурентов. Нельзя говорить, что Flash в течение ближайшего времени канет в небытие (вернее, в область интерактивных презентаций, где, бесспорно, равных ему нет). Но и верить, что через 2-3 года html5 не покорит просторы Интернета – нелогично.

Html5: расширяя грани возможного

В чем секрет успеха html5? Возможно, в хорошей базе, ведь, по сути, это не новый язык программирования, а все тот же html, но уже со скриптовыми возможностями обработки картинок. Именно поэтому к нему активно интегрируется Mozilla, создавая Canvas 3D. Именно функция Canvas, реализованная в пятой версии html, дает возможность создавать сайты более высокого качества, расширяет возможности для их оформления, а также позволяет конструировать принципиально новые пользовательские интерфейсы. Говоря маркетинговым языком, html5 делает ресурсы «цепляющими», что важно для любой компании, заказывающей их создание, и желающей получить максимально быструю отдачу от вложений.

Если вкратце перечислять преимущества html5 для пользователей и веб-дизайнеров, то получится весьма интересный список:

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

Примечания

1. ↑W3C Charts a Course for the Future of the Open Web by Finalizing HTML5 Standard
2. ↑HTML5 Standard Finally Complete, W3C Announces
3. ↑7 причин уже сейчас перейти на HTML5