HTML5 – это пятая и новая, на сегодняшний день, версия HTML стандарта и языка разметки. Главная цель данного стандарта — улучшение языка разметки, для работы с новыми мультимедийными элементами и приложениями. Также в HTML5 сохраняется удобная читаемость программ для человека и обработки для web-браузеров. HTML5 поддерживает часть тэгов HTML4 и язык JavaScript.
Для того чтобы в предыдущей версии HTML (HTML 4), вывести на web-страницу видео или аудио нужно было использовать какой-либо сторонний плагин, который встраивался в HTML код с помощью специальных тэгов. В HTML 4 возможно использовать три различных элемента для встраивания мультимедиа.
• <applet>
• <embed>
• <object>
Например, мультимедийными плагинами могут служить следующие элементы:
Поэтому, часто для того чтобы пользователь мог увидеть мультимедийный видео файл на каком-то сайте, ему необходимо установить дополнительный плагин, что не всегда очень удобно так как требует дополнительного времени, а порой и знаний. Наиболее распространенный и повсеместно используемый плагин, на сегодняшний день – это Flash player. У Flash плеера есть один небольшой недостаток — он иногда притормаживает работу браузера.
В свою очередь в HTML5 вы можете встраивать мультимедиа с помощью обычных разметочных тэгов, которые уже встроены в данный язык и пользователь, чей браузер уже поддерживает HTML5, сможет без проблем просмотреть мультимедиа.
• Больше нет необходимости в плагинах, браузер включает в себя все необходимое, используя HTML5.
• Предполагается, что скорость работы значительно быстрее, так как все задачи выполняются на уровне браузера и не задействуются внешние элементы — плагины.
Кстати HTML5 все еще находится в стадии разработки. Но уже на сегодняшний день его частично поддерживают все современные браузеры новых версий, такие как — Internet Explorer, Opera, Firefox, Chrome, Safari.
Теперь давайте разберемся, как можно легко и просто встроить видео на web-страницу с использованием языка HTML5.
1. Сначала создадим файл, например html5video.html
2. Поместим в этот файл следующие строчки языка HTML5:
<html>
<body><center>
<p>HTML5
Видео пример</p>
<video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" width="640"
height="360" controls="controls"></video>
</body>
</html>
Теперь я помещаю этот файл на свой web-сервер, а вы можете разместить на своем, если он у вас есть. Если нет, ничего страшного. Далее вы cможете загрузить эту страницу, в вашем браузере, с сервера по адресу http://itmultimedia.ru/myexamples/html5video.html или нажав на HTML5Video. Вы должны увидеть плеер с видео файлом. Получается мы использовали HTML5 для встраивания мультимедиа файла с использованием элемента <video>, где src — это адрес до самого видео файла.
С HTML5 происходит вещь, казалось бы, совершенно невероятная в истории развития IT - технологий. Мы привыкли к тому, что все происходит гораздо быстрее, если не за месяцы, так за пару лет. Правда, потом целые коллективы программистов трудятся над тем, чтобы обойти всяческие неучтенные в спешке ограничения. А здесь мы имеем дело с проектом, продуманным настолько глубоко, что вот уже два года продолжается его тестирование. Все дело в том, что технология HTML5 в корне меняет многие концепции программирования, к которым привыкли поколения веб-мастеров. Может быть, потому его внедрение в повседневную жизнь не носит триумфального характера.
Да, до недавнего времени не все браузеры его поддерживали. Но сегодня его воспринимает даже консервативнейший IE. Все остальные браузеры делают это уже давно. Они не стали бы так поступать, не имея никаких предпосылок. Но дальше всех по этому пути прошел Google. Совсем недавно была выпущена 18 версия браузера Chrom, в котором добавлен новый модуль Canvas 2D, использующий самую яркую особенность HTML5 - тег canvas, позволяющий заменить флеш-технологии в интернете. Правда, это мало повлияло на внешний вид сайта Google.
Второй интернет-монстр, который открыто заявляет об использовании HTML5 - это YouTube. Но здесь можно включить тестовый режим, и использовать на свое усмотрение новую или старую технологию. Это тоже необычно, ведь раньше новинки вбрасывались в интернет, как шайба в игру - бац! - а дальше хоть трава не расти. И здесь оказалась самой востребованной именно медийная составляющая HTML5.
Но самое интересное, что с HTML5 уже сейчас имеет дело каждый, кто открывает свой блог или сайт, даже не подозревая об этом. Потому что новая технология внедрена в код самой популярной блог-платформы в мире - Wordpress. Появление огромного количества шаблонов на HTML5 для Вордпресса служит самым бесспорным индикатором жизненности этой новации. В результате, внешний вид сайтов претерпел кардинальнейшие изменения.
Новые возможности HTML5 предназначены для создания веб-приложений и интерактивных сайтов, взаимодействия с формами, подключения к интернет-страницам мультимедийного контента, работы с программными интрфейсами и структурирования документов.
Структурyрные возможности HTML5 делают структуру веб-документа более простой, а код чище. Новые семантические элементы header, nav, section, article, aside, и footer могут использоваться вместо контейнеров div, применяющихся сейчас в HTML4.0. Новые элементы позволяют более конкретно описывать заголовок, нижний колонтитул, колонки текста и другие. Эти нововведения могут использоваться для автоматический генерации оглавления и организации более эффективной и простой навигации по веб-странице. Код при этом становится более чистым и менее засоренным второстепенными деталями.
Неколько конкретных примеров
Пример 1. Вместо громоздкой записи HTML4:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">,
в HTML5 это будет выглядеть следующими образом:
<!DOCTYPE html>.
Пример 2. В HTML4 для создания заголовка необходим код:
<div id="header">
<h1>Мой блог</h1>
<p class="tagline">Здесь помещается текст</p>
</div>
В HTML5 есть специальный элемент <header>, котрый позволит записать этот же фрагмент в виде:.
<header>
<h1>Мой блог</h1
><p class="tagline"> Здесь помещается текст </p>
</header>
Как видим, код становится проще и понятнее.
Мультимедийные возможности HTML5 делают излишним использование Adobe Flash и многих других дополнительных программ. Музыку и видео можно воспроизводить непосредственно в браузере. Более удобное размещение фотографий и изображений без использования каких-либо дополнительных программ, которые требуются для этого в HTML4.0.
Ввод данных в HTML5 становится проще и безопаснее. Правильность введения данных контролируется в режиме реального времени непосредственно во время ввода. В HTML4 проверка ошибок и сообщение о них происходит уже после отправки документа, что может создавать проблемы пользователям.
Текст и изображение становятся одним целым. Полностью меняются возможности отображения изображений и текста на интернет-сайтах. С HTML5 разработчики получают новые возможности для оформления сайтов, которые позволяют сделать их не менее красивыми, чем глянцевые журналы.
Например, такими:
http://www.nikebetterworld.com/
http://www.ultranoir.com/en/#!/blog/creative_html/web_3.0/
Графика и анимация.
Новая функция Canvas позволяет размещать анимацию, графику с меняющимся контентом и небольшие игры непосредственно на веб-сайтах. При использовании HTML4 для этого требуются дополнительные программы, например, Adobe Flash. При помощи Canvas появляется возможность создания пользовательских интерфейсов и игр совершенно нового уровня.Преимущества для конечного пользователя. С HTML5 жизнь конечного пользователя становится заметно легче:
- не требуется установка многочисленных дополнительных программ.
- HTML5, в отличие от HTML4 совместим, помимо ПК и ноутбуков, еще и с планшетами, смартфонами и современными моделями телевизоров, которые предоставляют доступ в Интернет.
- HTML5 обеспечивает единый стандарт отображения контента, независимо от типа браузера.
На сегодняшний день в HTML5 присутствуют минусы, из-за которых он проигрывает прежним технологиям. Имеет место некоторая уязвимость HTML5 в области защиты данных. Такую уязвимость создает больший, по сравнению с cookie стандарта HTML4, объем данных, которые сохраняются на жестком диске пользователя. Опасность заключается в том, что в больших объемах данных может содержаться более подробная информация о пользователе. Эксперты высказывают мнение, что если хранилище HTML5 остается на компьютере пользователя в течение многих месяцев, то интернет-сайты, обращаясь к нему через JavaScript после загрузки страницы, могут незаметно для пользователя собирать и передавать данные владельцу сайта.
В отношении мультимедийного контента тоже есть недостатки, не позволяющие сделать окончательный выбор в пользу HTML5. Как отмечается в официальном блоге YouTube, поддержка видео HTML5 позволяет воспроизводить мультимедийный контент на компьютерах и устройствах, которые не поддерживают Flash Player, однако в полной степени HTML5 всем этим потребностям все еще не отвечает. На сегодняшний день Adobe Flash обеспечивает наилучшую платформу для воспроизведения видео. В HTML5 пока нет, например, полноэкранного режима. Имеются недостатки, касающиеся использования HTML5 для создания игр. И, кроме всего, новый стандарт пока еще не поддерживается всеми браузерами.
В течение примерно 10 лет время от времени появляется продукт, который получает название "убийца флеша", а Adobe Flash все не умирает. В случае с HTML5, который включает средства для создания и воспроизведения на интернет-странице мультимедийного содержимого, тоже стали говорить о том, что Adobe Flash вскоре отомрет за ненадобностью. Однако, слухи о скорой смерти флеша оказались преувеличенными.
Вот что говорят разработчики игр о недостатках HTML5, мешающих использовать его в этом направлении:
Платформа Flash используется также для анимации и разработки интерфейсов, ее применяют для создания более сложной рекламы и в трехмерной графике. Она постоянно эволюционирует и совершенствуется.
Как отметил Филипп Ле Эгаре (Philippe Le Hégaret), руководитель направления компании W3C, которая разрабатывает стандарт HTML5, в ближайшие годы не получится отказаться от технологии Flash. Причиной этому он назвал то, что потребуется длительное время для перехода всех веб-клиентов к поддержке HTML5. В течение ближайшего времени технологии HTML5 и Adobe Flash будут сосуществовать.
Дело в том, что в его постановке и выводах произведена подмена, аналогичная подмене в школьной шуточной задачке на сообразительность, в которой спрашивается:
- Cколько яблок на березе, если на одной ветке их 5, на другой ветке - 10 и так далее
При этом внимание учеников намеренно отвлекается от того основополагающего факта, что на березе яблоки не растут, в принципе.
В эксперименте Майкельсона ставится вопрос о движении эфира относительно покоящегося в лабораторной системе интерферометра. Однако, если мы ищем эфир, как базовую материю, из которой состоит всё вещество интерферометра, лаборатории, да и Земли в целом, то, естественно, эфир тоже будет неподвижен, так как земное вещество есть всего навсего определенным образом структурированный эфир, и никак не может двигаться относительно самого себя.
Удивительно, что этот цирковой трюк овладел на 120 лет умами физиков на полном серьезе, хотя его прототипы есть в сказках-небылицах всех народов всех времен, включая барона Мюнхаузена, вытащившего себя за волосы из болота, и призванных показать детям возможные жульничества и тем защитить их во взрослой жизни. Подробнее читайте в FAQ по эфирной физике.