Композиція в дизайні сайту: робимо все за правилами

Імениті фотографи та художники на питання, як у них вийшов такий чудовий шедевр, відповідають: вся річ у композиції. Чим же вона така важлива і чи можна її використовувати при створенні сторінок сайту? Адже кожна з них теж значима.

Отже, композиція: спосіб поєднання елементів у просторі те щоб результат вийшов гармонійним. Звичайно, у веб-дизайні вона теж використовується, адже сайт має справляти приємне враження – і візуальне в тому числі.

Основні елементи композиції

До них відносяться:

1. Колір. Це основа сприйняття. Завдяки кольору передається і настрій, і суть. Так, соковиті відтінки виглядають динамічно, а пастельні запрошують розслабитись. За допомогою правильно підібраного тону так легко викликати емоції та привертати увагу. Як правило, контрастним і яскравим стає заклик до дії, а фон залишається спокійно-нейтральним. Щоб розібратися в основних комбінаціях кольорів, можна вивчити готові шаблони сайтів.
2. Розташування. Щоб зрозуміти, куди містити важливу інформацію, слід скористатися правилом третин. Розділіть область перегляду чотирма лініями так, щоб вийшло 9 квадратів. У місцях, де вертикалі і горизонталі перетинаються, зосереджено найбільше поглядів користувача. І 40% користувачів спочатку уважно вивчають лівий верхній кут. Пам'ятайте про це, коли шукатимете місце на сторінці для розташування кнопки кол-ту-екшн або фотографії бестселера.
3. Вільний простір. Сторінка повинна сприйматися як повітряна та чиста. Якщо ж ви виявили тут нагромадження зображень і текстових блоків, настав час зайнятися «генеральним прибиранням». Залишіть тільки те, що дійсно важливо, те, що відображає саму суть компанії, без загравань. Запевняємо вас, відвідувачі люблять лаконічність і чистоту, вони цінують те «повітря», що ви залишаєте для них в інформаційному просторі.

Стильні кольори подарують візуальну насолоду, мінімум блоків з інформацією не дадуть заплутатися – і ваш сайт вже такий близький до ідеалу.

Правила розташування важливої інформації

На сайті дуже важлива візуальна ієрархія: якщо око відвідувача «зачепиться» за щось важливе та цікаве на самому початку, то більша ймовірність, що людина додивиться сторінку до кінця.

Як звернути погляд відвідувача на те, що дійсно важливо? Враховуйте особливості перегляду: екран сканують очима по траєкторії, що нагадує букву Z або F.

До основних елементів візуальної ієрархії відносяться:

• масштаб;
• колір;
• контраст;
• вирівнювання.

Комбінуйте шрифти та розміри літер, габарити та насиченість зображень, створюйте видимі лінійні напрямки – щоб користувачі легко пройшли за запропонованим вами маршрутом.

Розподіляйте інформацію по сторінці так, щоб навіть її положення приносило зиск. І ось ваш сайт вже успішний у мережі!