Длинные тени в дизайне сайтов

Длинные тениГлавная тенденция web-дизайна последних месяцев - так называемые "плоские" сайты. Основная отличительная черта этих сайтов практически полное отсутствие текстур, градиентов и теней. Такая популярность "плоского" дизайна связана в первую очередь с активным использованием различных мобильных устройств. И выход iOS7 со своими иконками только усили данную тенденцию.
Такие сайты, конечно, имеют свои плюсы. Четкие линии и структурированность и "облегчает" сайт в плане восприятия пользователями, внимание меньше отвлечено от контента сайта.

Кроме того отсутствие графики значительно ускоряет загрузку страницы. Но такой дизайн лишает сайт индивидуальности, своеобразной изюминки.
Не так давно веб-мастера обратили внимание на новый стиль, который получил название Jeff Escalante - "дизайн с длинными тенями". Выглядит этот стиль очень эффектно и нужно признать, такой стиль "вдыхает жизнь" в плоские сайты.
Jeff Escalante имеет свои четкие правила. Тень объекта должна располагаться под уклоном 45 градусов, при этом размер тени должен превышать размер объекта в 2,5 раза.
Такая тень делает плоский по сути объект объемным. Эффект длинной тени придает объекту глубину. Нужно сразу оговориться, что добиться действительно интересного эффекта длинной тени используя только инструменты CSS3 достаточно сложно. Поэтому выполнять дизайн объектов с длинной тенью лучше в графических редакторах.
Используя дизайн с длинными главное не переусердствовать. Чтобы не отступать от основной тенденции современного дизайна - плоскости, в стиле Jeff Escalante имеет смысл выполнять только некоторые элементы. Эффективно выглядят всевозможные пользовательские инструменты - иконки и кнопки сайта. В такой технике можно выполнить и элементы текста, например, в шапке сайта, для заголовков блоков и основных ссылок и меню.

Добавить комментарий


Защитный код
Обновить

DTH-2400 монитор-планшет Wacom Cintiq 24HD

DTH-2400  монитор-планшет Wacom Cintiq 24HD

Экран 24" Разрешение дисплея 1920x1200 px Размер дисплея 518,4x324 мм...

Подробнее »

Wacom Cintiq 13HD

Wacom Cintiq 13HD

13,3-дюймовый графический планшетWacom Cintiq 13HD с регулируемой высотой у наклоном рабочего...

Подробнее »

Графический планшет Genius G-Pen F350 3x5 (31100001100)

Графический планшет Genius G-Pen F350 3x5 (31100001100)

Модель:G-Pen F350 3'x5'Код:31100001100Размеры рабочей поверхности:101.6 x 127 ммРазрешающая способность:2000 dpiПеро:2...

Подробнее »
Подробный анализ, сео аудит сайта hydra2web | Сео аудит сайта hydra2web работает через гаранта.