Сайты на HTML 5

Подробности

11 Июля 2012

Каждому человеку в интернете известно что такое HTML. Но мало кто знает, что HTML5 не просто новая версия web-языка - это новая эра в вебразработках.

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

Где применить HTML5

Структурные возможности HTML5 делают структуру веб-документа более простой, а код чище. Новые семантические элементы header, nav, section, article, aside, и footer могут использоваться вместо контейнеров div, применяющихся сейчас в HTML4.0.
Мультимедийные возможности HTML5 делают излишним использование Adobe Flash и многих других дополнительных программ. Музыку и видео можно воспроизводить непосредственно в браузере. Более удобное размещение фотографий и изображений без использования каких-либо дополнительных программ, которые требуются для этого в HTML4.0.
Ввод данных в HTML5 становится проще и безопаснее. Правильность введения данных контролируется в режиме реального времени непосредственно во время ввода. В HTML4 проверка ошибок и сообщение о них происходит уже после отправки документа, что может создавать проблемы пользователям.
Внешний вид. Текст и изображение становятся одним целым. Полностью меняются возможности отображения изображений и текста на интернет-сайтах. С HTML5 разработчики получают новые возможности для оформления сайтов, которые позволяют сделать их не менее красивыми, чем глянцевые журналы.
Графика и анимация. Новая функция Canvas позволяет размещать анимацию, графику с меняющимся контентом и небольшие игры непосредственно на веб-сайтах. При использовании HTML4 для этого требуются дополнительные программы, например, Adobe Flash. При помощи Canvas появляется возможность создания пользовательских интерфейсов и игр совершенно нового уровня.

И в этой ситуации не обошлось без «НО»:

Уязвимость HTML5 в области защиты данных. Такую уязвимость создает больший объем данных, которые сохраняются на жестком диске пользователя и хранятся там долгое время. Такой факт дает возможность незаметно собирать информацию о пользователе.
Мультимедиа и игры. Многие разработчики жалуются на низкую производительность контента созданного с помощью HTML5, ограниченность платформ в применении, увеличение затрат в плане ресурсов и времени, и т. д.
Браузеры. До недавнего времени не все браузеры поддерживали HTML5. Но сегодня его воспринимает даже консервативный IE. Все остальные браузеры делают это уже давно. Но дальше всех по этому пути прошел Google. Совсем недавно была выпущена 18 версия браузера Chrom, в котором добавлен новый модуль Canvas 2D, использующий самую яркую особенность HTML5 – тег canvas, позволяющий заменить флеш-технологии в интернете.
Но, не смотря на все недостатки тестовой версии HTML5 «гиганты интернета» начинаю активно использовать эту версию. Например Google, YouTube и т. д.

Спецификации HTML5

Начало нелегкого пути стандартизации проекта HTML5 было положено в 2007 году, и продолжается до настоящего времени. Согласно расписанию W3C, предполагалось, что HTML5 получит от W3C статус «рекомендовано» в конце 2010 года, но для этого проекту нужно было получить одобрение Last Call и Candidate Recommendation. Поддержу Last Call HTML5 получил в октябре 2009 года. С Candidate Recommendation обстоит все намного сложнее, но редактор спецификации Ян Хиксон, уверяет, что одобрение будет получено в 2012 году или позже.

Примеры реализации

1. Корпорация Google много сделала для того, чтобы новый стандарт языка Интернета увидел жизнь. Много делает она и сейчас, чтобы как можно скорее стал общепринятым. Для его рекламы часто используется стартовая страница Google. Вот как выглядит, например эта страница с применением HTML5, предназначенная для того, чтобы поздравить с чем-то жителей Гонконга. Зайдите на http://www.google.com.hk/intl/zh-CN/landing/shuixia/ и пощелкайте мышкой чуть ниже уровня воды. Получите массу удовольствия. Во всем остальном - это совершенно нормальная стартовая страница Google. Это не единственный пример такого рода, в день рождения Станислава Лема главная страница Google была симпатичной аркадной игрушкой по мотивам Кибериады. (тут предлагаю сделать захват экрана, а на фоне вы будете читать текст)
2. Лучше всего обучаться чему-то, играя. Вот перед вами замечательный сайт http://html5game.ru/. Мне особенно нравится шапка сайта. При наведении на нее курсора она разлетается на отдельные шарики, а потом собирается назад. Представленные на сайте игрушки ( которые постоянно пополняются) во многом повторяют известные всем флеш-игры, хотя грузятся, заметно быстрее. Знаю по себе, лучше способа изучить новый язык, чем попытаться написать на нем новую игрушку, просто нет.
3. Интерактивный графический редактор по адресу http://www.picozu.com/editor. По возможностям немного превышает стандартный Paint, но впечатляет сама возможность рисования, пользуясь средствами HTML5.

Увиденное наводит на определенные мысли.

1. Внешне выглядит, что самой используемой функцией HTML5 является тег canvas. Именно он позволяет создавать такую эффектную графику.
2. Время на загрузку таких сайтов все равно требуется. Значительно меньше, чем для флеша, но тем не менее...
3. Мощность компьютера лучше иметь побольше.
4. Пока что все это великолепие все еще в стадии эксперимента. Это странно. Видимо, в Интернет проникла общечеловеческая инерция мышления.
5. Вещи незрелищные, например влияние новых тегов для оптимизации сайта на его продвижение остаются незаметными.