HTML5 и CSS3 уже сегодня! Часть 1. Общие сведения, интересные ссылки, примеры

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

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

Однако, как показала практика, некоторые элементы можно использовать уже сейчас как дополнительный бонус для какого-либо сайта. А увидит ли пользователь эффект от новых технологий или нет, это кардинально ничего не изменит.

Новые технологии открывают очень широкие возможности, о некоторых из которых было очень сомнительно мечтать. Очень порадовало нововведение для разбиения блока текста на несколько колонок! Сколько сейчас для этого лишних движений приходится делать! Только представьте, что в будущем надо будет какому-нибудь контейнеру всего лишь прописать пару строчек CSS и вуаля - сколько надо колонок, столько и видим.

Из нововведений, актуальных для текущего дня, можно выделить:

• отбрасывание тени как текстом, так и блоками,
• закруглённые углы,
• градиентное окрашивание,
• наклон блоков. 

Сейчас HTML5 и CSS3 хорошо поддерживают Google Chrome, Apple Safari, Mozilla Firefox и немного похуже Opera. Пока ещё последняя версия ишака (восьмёрка) не отличается такой поддержкой.

Полезные ссылки

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

Презентация новых технологий CSS3 и HTML5!

Также, о возможностях и нововведениях, можно почитать на предлагаемом ниже плакате (картинка кликабельна). Для тех кто знает английский (был найден тут - ссыльк).

Сейчас многие программисты устраивают тестдрайв новым технологиям и делают при их помощи различные интересные штуки. К примеру:

• по адресу http://hakim.se/experiments/ можно ознакомиться с довольно любопытными анимационными экспериментами.
• по предлагаемой ссылке можно поиграть во всеми известного Пакмана, сделанного при помощи HTML5.
• любопытна и иконка супер Марио на CSS3, которая вращается вокруг своей оси (ссылка).

Также существуют не только игрушечки, но и полезные разработки на данных технологиях. К примеру, очень удачно создан список дел (To-Do list) на сайте http://10k.aneventapart.com/. Пользуйся в своё удовольствие, а если надо - к примеру, как бонус в свой движок.

Второй очень полезной разработкой является графический редактор Muro, использующий нововведения HTML5 (ссылка на сайт). Смысл проекта прост - рисуй сколько хочешь, при этом никаких тебе флэш-технологий. При этом рисовалка была проверена Деннисом Кротерсом (Dennis Crothers) из Wired.com, который остался очень доволен ей. Если вы умеете рисовать - рисуйте здесь! Подробнее о проекте можно узнать из статьи на xiper.net.

В завершении

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

И напоследок, предлагаю песенку о CSS3. Все дружно поём и молимся на скорую кончину IE8 и младше =))).

CSS, css3, html, html5

(голосов: 2, средний: 2.50 из 5)