HTML5С новыми современными требованиями к оформлению и интерактивности веб-сайтов, возможностей стандарта HTML4, на котором построено подавляющее большинство проектов мягко говоря исчерпываются. Информационно продвинутая Интернет-общественность выдвигает все более строгие и практичные требования к медиа-контенту как в сфере безопасности, так и в плане универсальности, скорости и удобства при работе с информационными потоками. Проблема замены стандарта назрела уже давно и сегодня четыре ведущих компании разработчики веб-браузеров: Google, Mozilla, Opera и Apple совместно с организацией W3C, которая занимается проектирование и внедрением стандартов сети Интернет, активно ведут работу по модификации языка HTML. Что же нового и вкусного готовиться на этой кухне. Расскажу обо всем по порядку.

 

Повышенная безопасность.

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

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

 

Поддержка полноценной графики.

Quake2 for HTML5До недавнего времени бесспорным лидером анимированной графики для браузеров была технология Flash. С появлением в новом HTML5 стандарте такого инструмента как Canvas позиции Flash-графики будут, вероятно, сильно потеснены.

Суть такого мощного нововведения как Canvas состоит в том, что для браузеров на экране выделяется специальное пространство, положение которого на веб-странице определяется разработчиком сайта. В этой области с помощью целого набора специальных графических HTML5 команд можно составлять графические изображения, в том числе и анимированные, практически любой сложности. Более того для 3-D графики разрабатывается специальный набор команд аналогичных всемирно известному стандарту трехмерной графики OpenGL. Теперь браузер будет способен воспроизводить не только красивые двухмерные интерактивные приложения, но и полноценные трехмерные игры.

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

Примеры реализации игр на HTML5

Galactians 2

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

Sand trap

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

HTML5 Chess

Шахматы, полностью оформленные с применением новой технологии и возможностью переключения обзора доски с фигурами из 2D в 3D вид.

 

Видео и Аудио одним тегом.

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

Ситуация иронична тем, что браузерам для этого приходиться постоянно пользоваться программными костылями в виде Flash проигрывателей. Я уже и не говорю про постоянные обновления от Adobe для этой технологии, без которых пользователи сильно рискуют нахватать себе вирусов через бреши в старых версиях Flash.

HTML5 призван наконец избавить браузеры от этих “костылей” и дать им возможность полноценного воспроизведения аудио и видео контента своими силами. Для этого в HTML5 коде предусмотрены специальные теги, таки как <video> и <audio>. Впрочем, у этого нововведения имеются и свои недостатки, например отсутствие единого стандарта для видео кодеков, что не способствует пока широкому распространению этой удобной для пользователей и веб-разработчиков технологии.

 

Даешь многократное увеличение скорости работы.

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

Конечно же, проектировщики HTML5 не могли обойти эту проблему стороной. Новый стандарт обеспечивает поддержку многопоточности, которую именовали как Web Works. Таким образом, современные многоядерные системы получают возможность параллельно выполнять обработку скриптов и тем самым увеличить скорость работы сайта на несколько порядков в зависимости от его конструкции и сложности.

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

Примеры реализации приложений на HTML5

Google Body Browser

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

DeviantART Muro

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

CSSWarp

Пишем тексты и задаем им в отображении любую траекторию. Хотите применить созданное творение на своем сайте? Никаких проблем. Сервис позволяет преобразовать полученное изображение в простой HTML, который можно разместить у себя на сайте.

 

Прощайте cookies

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

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

 

Опробуем силы вашего браузера

В заключении скажу, что стандарт HTML5 на сегодняшний день еще только развивается и нет гарантии того, что ваш браузер поддерживает эту технологии на 100%. Чтобы проверить возможности своего браузера можно воспользоваться этим ресурсом HTML5 Test. Если из 475 доступных очков, на экране вы увидите хотя бы 300, то считайте что новые технологии языка HTML5 вам уже доступны.

Тест HTML5

 

И напоследок видео, демонстрирующее возможности стандарта HTML5

Комментарии   

goryunova
0 # goryunova 19.12.2011 08:38
Дети, как правило, лучше воспроизводят рассказ, чем взрослые. Потому что ещё не потеряли способность удивлять и сопереживать.
Если, прочитав это высказывания, вы обиделись или загрустили, значит, не всё потеряно: в душе вашей ещё живёт ребёнок-тот , каким вы были в детстве. Отличный сайт УДАЧИ ВАМ И ВАШЕМУ САЙТУ.
Ответить | Ответить с цитатой | Цитировать
eduha
0 # eduha 19.12.2011 20:00
Здорово! Прогресс не стоит на месте. :-)
Ответить | Ответить с цитатой | Цитировать
Федор
0 # Федор 20.12.2011 04:24
Это значительно облегчает работу с сайтами!
Ответить | Ответить с цитатой | Цитировать
Александр
0 # Александр 21.12.2011 03:37
Интересная статья, спасибо.
Ответить | Ответить с цитатой | Цитировать
Сергей
0 # Сергей 21.12.2011 06:39
Спасибо за интересную информацию
Ответить | Ответить с цитатой | Цитировать
Всеволод Моисеев
0 # Всеволод Моисеев 08.01.2012 02:47
Александр, прогресс не стоит на месте! Не успеешь к одному привыкнуть, на тебе-ещё новее появилось. :lol:
Ответить | Ответить с цитатой | Цитировать

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


Защитный код
Обновить