ресурс для начинающих веб-разработчиков
комплексные веб-услуги по созданию сайтов

Сложилось твердое убеждение, что один год в веб-программировании равен трем годам реального времени. И это действительно так. То, что происходит на наших глазах в области интернет-технологий поражает воображение не только самых консервативных и скептически настроенных членов нашего общества, но и далеко продвинутых пользователей этих технологий. Еще совсем недавно HTML5 и CSS3 казались делом будущего, но уже сегодня веб-разработчики вовсю используют эти технологии в своей работе. В этом во многом способствуют создатели веб-браузеров (Chrome, Safari, Firefox и Opera) реализовавшие часть этих спецификаций.

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

И так HTML5 и CSS3 — это следующее поколение постоянно используемых технологий, созданное для упрощения работы и удобства тех, кто повсеместно занимается разработкой веб-приложений.

Платформа веб-разработки

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

Коротко остановимся на них.

Более содержательная разметка

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

Мультимедийные возможности без зависимости от плагинов

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

Расширенные возможности создания приложений

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

Передача информации между доменами

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

Web Sockets

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

Хранение данных на стороне клиента

Как правило, HTML5 рассматривается как веб-технология, но с появлением прикладных интерфейсов (API) Web Storage и Web SQL Database появилась возможность создания браузерных приложений, которые хранят все данные на машине клиента.

Улучшение интерфейса

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

Улучшение форм

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

Улучшение доступности

Использование новых элементов HTML5 упрощает работу с контентом. Область навигации по сайту намного проще найти, если вы ищите тег nav вместо тега div. Завершители, боковые панели легко перемещаются или вообще исключаются из просмотра.

Расширенные селекторы

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

Визуальные эффекты

Тени, отбрасываемые текстом и изображениями, придают веб-странице визуальную глубину, а градиенты создают иллюзию объема. CSS3 позволяет добавлять тени и градиенты без использования фоновой графики и дополнительной разметки. Трансформации используются для закругления углов, деформации и поворота элементов.