На этапах становления Web 2.0 стилей, нашел написанную мной в далеком 2007 году статейку, так как все сайты на которых я её публиковал благополучно исчезли, публикую её еще раз у себя:

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

Для начала открываем Photoshop и создаем новый «проект». Размер не важен, главное чтобы вам было удобно «творить». Теперь выбираем инструмент Type Tool и впечатываем на белый лист, например, своё имя. Это будет первый слой.
Рядом с именем можно поставить какой-нибудь стандартный значок.
Я выбрал инструментCustom Shape Tool и выбрал на верхней панели , создал новый слой и разместил на нем оранжевую лапку.

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

Идем дальше. Добавим к лапке и надписи градиенты – это можно реализовать следующим образом: выделяем слой с элементом (допустим с надписью), выбираем из главного меню: Layer -> Layer Style -> Gradient Overlay :

В этом окне выставляем Opacity = 42%, Gradient – выставляем цвет надписи переходящий в белый цвет, Angle около -90 градусов. Аналогично поступаем со значком(не забываем сменить цвет градиента!). Получаем что-то такое:

Дальше создаем самую изюминку Web 2.0. Создаём сначала новый слой над надписью, где выделяем овальную область и заливаем её белым, после чего выставляем Fill слоя примерно 30% также поступаем со значком(создаем новый слой над значком …):

После всех этих операций получаем:

Дальше к нашим элементам можно добавить тень: выделяем слой с элементом (значком или текстом) Layer -> Layer Style -> Drop Shadow:

Выставляем значения: Distance – 1 px, Opacity – 100%, Size-1 px. Аналогично поступаем со вторым элементом, получаем результат:

Дальше мы добавим , неотъемлемую часть Web 2.0 – зеркальное отражение. Копируем все, что есть путем Ctrl+A(если размеры Canvas больше чем область, занимаемая вашим значком и текстом, то выделите эту область с помощью инструмента Rectangular Marquee Tool) , Shift+Ctrl+C и вставляем Ctrl+V. Полученный новый слой переворачиваем путем выполнения команды : Edit -> Transform -> Flip Vertical. Берем инструмент Move Tool и перемещаем полученную картинку ровно под «нормальную» чтобы казалось, что это отражение. Должно получиться вот такое чудо:

Теперь поработаем над реалистичностью отражения. Поставим Fill слоя на 40%.Создадим «слою отражения» маску. Жмем на Add Layer Mask и помещаем на маске черно – белый градиент снизу вверз под 90 градусов.

Пока что все! Удачного вам Web 2.0!