Використання текстур в веб-дизайні - програмні продукти

Який найпростіший, правильний, а іноді і єдино можливий спосіб створити ілюзію рельєфу того чи іншого елемента (об'єкта) в веб-дизайні (а так само в 2D в цілому, і природно 3D)? Правильно - використовувати текстуру! Будучи "матеріалом" універсальним, текстури широко використовуються в веб-дизайні і є об'єктом нескінченних експериментів. Текстури на сайтах можна зустріти як прості, які лише підкреслює ті чи інші елементи проекту, так і набагато більш складні реалізації.

"Тонке" використання текстури

Хочете урізноманітнити простий однотонний або градієнтний фон - додайте "легку" текстуру, яка не буде кидатися в очі і різко контрастувати, але разом з тим, ускладнить і облагородить фон. Також це дозволить трохи виділити ті чи інші об'єкти, залучаючи до них увагу користувача.

Прикладом використання текстури в цьому ключі може послужити сайт LogoGalas. На сайті використовуються різні варіації синього кольору, як для фону, так і для шрифтів, зверху є темна смуга фону з меню і пошуком, інша частина сторінки світліша.

Використання текстур в веб-дизайні - програмні продукти

Зверніть увагу на ледве помітну текстуру в верхній частині сайту (там де знаходиться логотип і верхня навігація). Відмінний зразок вмілої роботи з текстурами! Це допомагає зробити перехід між відтінками фону більш помітним і "цікавим".

Інший приклад - сайт W + K Studio. Тут текстура використовується разом з ефектом градієнту для фону.

Використання текстур в веб-дизайні - програмні продукти

Причому в даному випадку "легка" і вельми проста текстура додає глибини і "багатства" цього самого градиентному фону.

Текстура як "груба сила"

На противагу "тонким" делікатним структурам, які ненав'язливо додають деталізації, іноді добре працюють яскраві контрастні текстури, що задають основний тон і настрій композиції. Найчастіше подібні текстури в веб-дизайні використовуються для виділення заголовків або додавання контрасту між різними колонками контенту на сайті. Потрібно досить акуратно відноситься до "важким" структурам, так як вони можуть відволікати користувача від наповнення сторінки і переманювати на себе всю увагу, що не є добре.

Яскравий приклад другого варіанту використання текстур - сайт Church on the Rock, де "сильні" текстури застосовуються досить широко.

Використання текстур в веб-дизайні - програмні продукти

По суті, весь дизайн (особливо в його верхній частині) Church on the Rock "замішаний" на контрастних структурах і їх взаємодії: окремі області сайту виділяються різними текстурами, при прокручуванні вниз використовується звичайний одноколірний фон.

Не менш показовим є дизайн сайту Narfstuff, де текстура фону представляє з себе найяскравіше пляма. Зверху в шапці сайту використано безліч різних елементів і прийомів веб-дизайну, текстури при цьому виділяють окремі області сторінки.

Використання текстур в веб-дизайні - програмні продукти

При прокручуванні вниз текстура через плавне розмиття переходить до білого кольору - хороший прийом зміни насиченою шапки на абсолютно "мінімалістичне продовження" внизу веб-сторінки.

Загалом, якщо говорити про текстура в веб-дизайні, то це дуже цікавий і корисний елемент, з його допомогою можна домогтися вельми примітних результатів. Особисто я дуже люблю додавати різного роду текстури для блогів, так як це допомагає шаблоном виглядати більш ємко, ефектно і виділяє основний вміст сайту. До речі, раджу глянути статтю про оригінальні генератори бекграундом (background) - знайдете парочку корисних онлайн сервісів, за допомогою яких можна створити красиві текстури для фону веб-сторінки. Взагалі використовуючи текстури можна домогтися самого різного результату. В кінцевому рахунку все визначає та мета яку ви перед собою ставите, а відповідна текстура знайдеться завжди!

Схожі статті