Вы наверняка слышали фразу «красота находится в глазах смотрящего», вот так и какой-либо дизайн оценивается посетителями, а не дизайнерами. И здесь имеется в виду не только визуальное восприятие, но и удобство пользования сайтом.
Если на вашем сайте царит хаос, непонятно что где находится, и вообще он противоречит всем правилам юзабилити – посетитель просто закроет его, и уйдёт на сайт с более понятным дизайном.

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

 

Основная направленность сайта.

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

 

Тексты

Посетители сайта, как правило, хотят получать информацию быстро, поэтому очень важно сделать представленную информацию легкой для чтения и понимания. Текст на странице не должен быть перегружен различными специальными или техническими терминами. Информация на странице должна быть организованна с помощью заголовков и подзаголовков. Последний пункт так же полезен и для SEO.

 

Шрифты

Старайтесь не перегружать дизайн сайта обилием разных шрифтов. Трёх шрифтов для текста, заголовков и подзаголовков будет вполне достаточно. Для текста используйте шрифты семейства Sans Serif (без засечек). Оптимальный размер шрифта для удобного чтения с экрана – 16 px.

 

Цветовая палитра

Грамотно продуманная цветовая палитра сайта позволит Вам передать общее настроение сайта, акцентировать внимание посетителя на нужных вам моментах.
Не пытайтесь использовать в своём проекте все цвета радуги. Чем шире ваша цветовая палитра, тем сложнее будет выдерживать единый стиль и концепцию сайта. Оптимальный вариант – использовать 3-4 основных цвета и их оттенки. Играйте на контрасте шрифта и фона. И не забывайте про плюсы пустого пространства.

 

Изображения

Хорошо подобранное изображение может быть в несколько раз информативнее текста. Старайтесь размещать на сайте только качественные, профессионально сделанные изображения. Лучше всего использовать свои, уникальные фотографии, сделанные именно для текущего проекта. На самый крайний случай, для поиска изображений можно воспользоваться фотостоками. Так же, какие-то моменты лучше выразить инфографикой.
И не забывайте про видео! В некоторых случаях, с помощью видеороликов, донести до посетителей сайта какую-либо мысль, вам удастся гораздо быстрее. Как говорится – вместо тысячи слов… лучше один раз увидеть, чем сто раз прочитать…

 

Навигация по сайту

При построении навигации по сайту, необходимо соблюдать, так называемое, правило трёх кликов – посетитель сайта для доступа к разделу с нужной ему информацией, должен сделать не более трёх кликов мышкой.
Продумать навигацию лучше всего с самого начала работы над сайтом – на стадии прототипирования. Она должна представлять из себя логическую иерархию разделов и страниц, которые взаимодействуют между собой. Для улучшения юзабилити сайта используйте на нём, понятные пользователю, кликабельные кнопки и хлебные крошки.

 

Создавайте сайт на основе сетки

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

 

Размещайте контент по букве «F»

Исследования поведения посетителей на сайте выявили, что основная часть пользователей просматривает контент на мониторе по определённой схеме. Сначала посетитель просматривает по горизонтали верхнюю часть контента, после чего взгляд перемещается чуть ниже и опять идёт по горизонтали. Ну и напоследок пользователь просматривает материал по вертикали в левой части экрана.

 

Время загрузки страниц

Пользователи нынче пошли избалованные. По статистике, если сайт не открывается в течении 3х секунд, и на экране ничего не происходит, то посетитель просто закрывает вкладку и идёт гулять дальше по интернету. Исходя из этого, уделяйте особое внимание времени загрузки страниц вашего сайта.
Оптимизируйте изображения которые вы используете на сайте. Упрощайте код JavaScript и CSS.
Если у вас на странице находится тяжёлый контент, который замедляет открытие страницы – воспользуйтесь прелоадером, что бы он отображал статус загрузки. Главное, чтобы экран не был пустым, и на нём происходило какое-нибудь действие.

 

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

Кануло в лету то время, когда сайты просматривали только с компьютеров. На сегодняшний день почти половина траффика приходится на мобильные устройства. И если ваш сайт под них не адаптирован, то можете сами посчитать сколько посетителей вы теряете.