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

HTML - это основной язык разметки Всемирной паутины. Первоначально он был разработан для семантического описания научных документов, но с тех пор стал описывать гораздо больше. Большинство страниц в Интернете сегодня создано с использованием HTML4. Хотя HTML4 значительно усовершенствован по сравнению с первой версией HTML, написанной в 1993 году, он все же имеет свои ограничения. Самое большое из них заключалось в том, что веб-разработчики или дизайнеры хотели добавить на свой сайт контент или функции, которые не поддерживались HTML. В этом случае им приходилось использовать нестандартные технологии, такие как Adobe Flash, которые требовали от пользователей установки плагинов для браузера. Но даже в этом случае некоторые пользователи не могли получить доступ к этому контенту или функции. Например, пользователи iPhone и iPad не смогли бы этого сделать, поскольку эти устройства не поддерживают Flash.

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

HTML5 был разработан с основными целями, включая:

• Облегчение чтения кода для пользователей и устройств чтения с экрана
• Уменьшение дублирования между HTML, CSS и JavaScript
• Обеспечение отзывчивости и единообразия дизайна в разных браузерах
• Поддержка мультимедиа без необходимости использования Flash или других плагинов

Каждая из этих целей легла в основу изменений в новой версии HTML. Ниже мы остановимся на семи из этих изменений. Новые семантические элементы В HTML5 появилось несколько новых семантически значимых тегов. Они облегчают написание более чистого кода, который четко отделяет стиль от содержания, что особенно важно для пользователей вспомогательных технологий, таких как устройства чтения с экрана. К ним относятся элементы <section>, <header>, <footer>, <nav>, <mark>, <figure>, <aside>, <figcaption>, <data>, <time>, <output>, <progress>, <meter>, <main>.

При использовании HTML4 для добавления масштабируемой векторной графики (SVG) на веб-страницы вам понадобился бы Flash, Silverlight или другая технология. В HTML5 вы можете добавлять векторную графику непосредственно в HTML-документы с помощью тега <svg>. С помощью этого нового элемента можно рисовать прямоугольники, круги, текст и другие векторные контуры и фигуры. Ниже приведен пример круглой формы, созданной с помощью элемента SVG <circle>.

HTML5 не только ввел теги <audio> и <video>, которые устранили необходимость в плагинах для браузеров, но и представил видеоформат WebM. Это бесплатный формат видео, разработанный компанией Google, который обеспечивает отличное соотношение сжатия и качества. Он может использоваться с элементом video и поддерживается большинством браузеров.

В HTML5 появился атрибут placeholder. Вы можете использовать его с элементом <input> для предоставления краткой подсказки, чтобы помочь пользователям заполнить пароли или другие поля ввода данных.

Серверное событие - это когда веб-страница автоматически получает обновленные данные с сервера. Это было возможно в HTML4, но веб-страница должна была сама отправить запрос.

HTML5 поддерживает односторонние события с отправкой на сервер. Это означает, что данные постоянно отправляются с сервера в браузер. Подумайте, насколько это полезно, если ваш сайт содержит цены на акции, новостные ленты, ленты Twitter и так далее. Отправка событий с сервера поддерживалась и в предыдущей версии HTML, но веб-страница должна была неоднократно запрашивать их.

В предыдущей версии HTML данные хранятся локально с помощью cookies. В HTML5 вместо cookies используется веб-хранилище (web storage), использующее специальный API (через свойства Window.sessionStorage и Window.localStorage). Это позволяет хранить данные локально, как и куки, но в гораздо больших объемах (в браузере Firefox может быть ограничен 10Мб).

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

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

Совместимость со всеми браузерами

HTML5 поддерживается всеми основными браузерами, включая Chrome, Firefox, Safari, Opera, а также iOS для Chrome и Safari и браузеров Android. Он может работать даже с более старыми и менее популярными браузерами, такими как Internet Explorer. Это означает, что, создавая сайт на HTML5, вы можете быть уверены в том, что пользователи получат единообразное впечатление от вашего сайта, независимо от того, какой браузер они используют, мобильный или настольный.

HTML5 позволяет работать в автономном режиме

HTML5 позволяет создавать автономные приложения. Браузеры, поддерживающие автономные приложения HTML5 (а таких большинство), загружают HTML, CSS, JavaScript, изображения и другие ресурсы, составляющие приложение, и кэшируют их локально. Затем, когда пользователь попытается получить доступ к веб-приложению без подключения к сети, браузер отобразит локальные копии. Это означает, что вам не придется беспокоиться о том, что ваш сайт не загрузится, если пользователь потеряет или не будет иметь активного интернет-соединения.

HTML5 позволяет писать более чистый код

Благодаря новым семантическим элементам HTML5 вы можете создавать более чистые и описательные базы кода. До HTML5 разработчикам приходилось использовать множество общих элементов, таких как divs, и стилизовать их с помощью CSS для отображения заголовков или навигационных меню. Результат? Множество div и имен классов, которые затрудняли чтение кода.HTML5 позволяет писать более семантически осмысленный код, что позволяет вам и другим читателям разделять стиль и содержание. Это более доступно

Также благодаря новым семантическим элементам HTML5 вы можете создавать более доступные веб-сайты и приложения. До появления этих элементов устройства чтения с экрана не могли определить, что div с классом или идентификатором <header> на самом деле является заголовком. Теперь, благодаря "заголовку" и другим семантическим тегам HTML5, такие устройства могут более четко исследовать HTML-файл и предоставлять лучший опыт пользователям, которые в нем нуждаются.

Первый публичный проект HTML5 был выпущен Рабочей группой по технологии веб-гипертекстовых приложений (WHATWG) в 2008 году. Однако в качестве рекомендации Консорциума Всемирной паутины (W3C) он был выпущен только 28 октября 2014 года. Затем в 2019 году WHATWG объединила эту рекомендацию со стандартом HTML Living Standard.

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

В 1999 году, через год после выхода HTML4, W3C решил прекратить работу над HTML и вместо этого сосредоточиться на разработке эквивалента на основе XML под названием XHTML. Четыре года спустя вновь возник интерес к развитию HTML, поскольку люди начали понимать, что развертывание XML полностью зависит от новых технологий, таких как RSS.

В 2004 году на семинаре W3C компании Mozilla и Opera предложили, чтобы HTML продолжал развиваться. Когда члены W3C отклонили это предложение в пользу продолжения разработки замены на основе XML, Mozilla и Opera - к ним присоединилась Apple - создали Рабочую группу по технологии веб-гипертекстовых приложений (WHATWG) для продолжения развития HTML.

В 2006 году W3C изменила курс и заявила, что заинтересована в участии в разработке спецификации HTML5. Год спустя была сформирована группа для работы с WHATWG. Эти две группы работали вместе в течение нескольких лет до 2011 года, когда они решили, что у них две разные цели. В то время как W3C хотела опубликовать готовую версию HTML5, WHATWG хотела опубликовать и постоянно поддерживать живой стандарт HTML.

В 2014 году W3C опубликовала свою "окончательную" версию HTML5, а WHATWG продолжила поддерживать "живую" версию на своем сайте. Эти два документа объединились в 2019 году, когда W3C и WHATWG подписали соглашение о сотрудничестве в разработке единой версии HTML в будущем.

Благодаря новым семантическим элементам, расширенным возможностям форм, независимым от формата тегам видео и многим другим, HTML5 революционизирует процесс создания веб-страниц. Это, в свою очередь, меняет опыт пользователей в Интернете. Теперь мы можем смотреть видео без необходимости обновлять Flash или загружать другое программное обеспечение. Мы можем пользоваться приложениями, когда у нас нет подключения к Интернету. Мы можем получать одинаково приятные впечатления от сайта, используя мобильный телефон, планшет или телевизор Smart TV - и многое другое.