7 причин уже сейчас перейти на HTML5

05.04.2012 12:24 2 11 673 просмотра
Технология HTML5 с каждым днем становится все более популярной в Интернете. Если несколько лет назад о ней знали только в узких профессиональных кругах веб-разработчиков, то теперь наслышаны об HTML5 и люди, связанные с отраслью лишь опосредованно. В большей степени известность эта распространилась в связи с противостоянием технологий HTML5 и Flash. HTML5 претендует на право стать универсальным стандартом разработки мульмидейного контента в будущем, защитники Flash'a яростно обороняют свои позиции. Попробуем, не углубляясь в технические тонкости, рассказать, чем же хорош HTML5 и почему этого стандарта не стоит бояться.

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

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


http://www.thisshell.com/

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


http://pirogov.ru/

Эту «фишку» можно использовать где угодно и как угодно, все ограничивается только фантазией разработчиков. Можно сделать промо-сайт с wow-эффектом, где интерактивные объекты будут располагаться прямо поверх основного контента.

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


http://beta.rallyinteractive.com/

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


http://nizoapp.com/


http://wheelsofsteel.net/

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


http://www.nikebetterworld.com/product


http://benthebodyguard.com/

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


http://www.360langstrasse.sf.tv/page/

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


http://artofflightmovie.com/

Эту технологию уже активно используют социальные сети, которым крайне важно удержать пользователя. Посмотрите на Facebook или ВКонтакте: основное меню остается практически неизменным при клике на его разделы, а вся информация подгружается в отдельном блоке. Таким образом, пользователю не приходится ждать, когда произойдет полная перезагрузка страницы.

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

Комментарии 2

Алексей Кормилкин  (akormilkin)
#
Василий, а что необходимо сделать, чтобы "уже сейчас перейти на html5"? У меня, к примеру есть свой сайт (в профиле ссылка), сейчас он на html4. Я хочу его оживить. Что я должен сделать и сколько мне это будет стоить?

p.s.
Кстати, Вы могли бы на примере моего сайта, продемонстрировать, что получит ваш потенциальный заказчик, который захочет перейти на html5.
Василий Пирогов  (vpirogov)
#
Алексей, «оживить» сайт, просто добавив элементы HTML5, невозможно – нужно перевёрстывать сайт и делать редизайн. Если Вы хотите, чтобы сайт был достойным. В материале мы привели примеры эффектов и технических решений, которые можно внедрить в том числе и на Вашем сайте – Вы, как потенциальный заказчик, можете самостоятельно решить, какие хотите использовать. Мы можем дать профессиональные советы, где и как использовать фишки HTML5, но это тема отдельного разговора по юзабилити.
Комментарии и отзывы могут оставлять только зарегистрированные пользователи.
Авторизуйтесь или зарегистрируйтесь.

Популярные сообщения

Микрозайм по вашим ПД. Результат.
Не так давно, всего пол года назад, я писал о том как легко и просто получить долг. Неожиданно оформленный на вас микрозайм, исключительно по вашим ПД,
7
Авторский рейтинг надежности МФО от thinks (не аккредитован ЦБ) - декабрь 2018
Авторский рейтинг надежности МФО от thinks (не аккредитован ЦБ) - декабрь 2018 В рейтинге в названии МФО выставлена ссылка на статистику сайтов данных
1
Об одной очень надежной, сверхнадежной Ценной Бумаге
Предлагаю занятное мысленное упражнение. Представьте, Правительство предлагает вам приобрести некую очень надежную Ценную Бумагу стоимостью 10 миллионов
5
Акция по страхованию квартир в Москве от Росгосстрах
Срочно в номер! Стартовала предновогодняя акция от ПАО СК РГС по страхованию квартир в столице - стандартный тариф на страхование снижен на 40-50%. Полный
0
Как не потерять все деньги в Тинькофф Банке
Попытался в одном месте кратко собрать базовые рекомендации, как не потерять деньги при одновременной утрате и карты, и телефона. Возможна ситуация,
5

Новые сообщения

  • Банки - это надежно?
    Начну сразу с вопроса: Вы всё еще оптимисты? После моего поста про сланцевую нефть количество оптимистов резко поубавилось. А зря! Инвестор должен
  • О реальной мотивации людей, берущих ипотечные кредиты
    Процентная ставка по кредиту для потребителя означает цену, которую он платит за желание потреблять сегодня, а не завтра. Хочешь купить сегодня, а денег
  • Большой Cashback от ОТП банка - Даже не пробуйте!
    Жена дрессирует щенка. Муж ей говорит: - Дорогая, сомневаюсь, что у тебя что-нибудь получится. Жена: - Ничего, главное в этом деле терпение. С тобой
  • и на старуху бывает проруха
    .Стараюсь следить за всеми изменениями условиях, грейс-периодами кредиток и прочими подводными и надводными камнями своей скромной финансовой жизни.
  • Микрозайм по вашим ПД. Результат.
    Не так давно, всего пол года назад, я писал о том как легко и просто получить долг. Неожиданно оформленный на вас микрозайм, исключительно по вашим ПД,