Все письма серии «Сделай сам»


1PS.RU
Комплексное SEO Реклама в Яндексе и Google Создание сайтов
Серия писем Сделай сам
19 Проверяем дизайн своего сайта

Здравствуйте!

Давно у нас не было писем из серии «Сделай сам». Исправляемся. Напомню, что в прошлом письме мы рассказывали о верстке текста на сайте.

Сегодня поговорим о дизайне. Конечно, если Вы не дизайнер, то самостоятельно отрисовать макет с нуля, даже если мы Вам пошаговое руководство выдадим, не сможете. Зачем тогда это письмо?

Затем, что Вы просто обязаны понимать основы дизайна. Для чего? Чтобы адекватно оценить работу исполнителя-рисовальщика, которому заплатили. Ну или чтобы сейчас окинуть взором свой ресурс и понять, а что, собственно, с ним не так.

К слову, предыдущие письма серии «Сделай сам» можно перечитать в архиве. Там накопилось очень даже приличное количество годноты. =)

Итак, дизайн ...

1. Почему дизайн – это важно?

1 Дизайн сайта – своего рода визуальный «язык общения» между Вами и Вашими клиентами. Не стоит скидывать со счетов тот факт, что визуальное оформление подталкивает клиента к покупке (хотя если сделано некорректно, то отпугивает).

Например, синие тарелки. Доказано, что из них люди съедают меньше. В том числе и по этой причине для оформления сайтов с едой синий цвет не выбирают. В общем, дизайн – архиважно. Поэтому проверяем!


2. Чек-лист: что учесть в дизайне, чтобы сократить отказы и повысить конверсию

1 В веб-дизайне есть ряд правил, сегодня расскажем о 5 основных, которые стоит соблюдать. Проверяйте на своем сайте:

  • Модульная сетка – правило №1

    Сетка – основа сайта, его единый каркас. Сетка отражает расположение всех основных блоков и элементов сайта, проходит через все страницы. Если не придерживаться сетки и направляющих, то сайт превратится в набор хаотично раскиданных элементов, расположенных как попало (выше-ниже, больше-меньше). Итог один: кто в лес, кто по дрова. Смотрите примеры тут.
  • Цветовая схема – правило №2

    Выбор цветов для сайта должен быть обоснован, а число цветов не превышать 3-4: цвет фона, цвет шрифта, цвет элементов + дополнительный цвет. Изначально для сайта выбирается цветовая схема и далее в дизайне ее придерживаются. Не нужно для каждой новой страницы сайта изобретать новую цветовую схему.

    Цвета подбираются на цветовом круге. В подборе нужно учитывать цели и особенности бизнеса, колористику (сочетаемость цветов), а также особенности восприятия цвета (некоторые цвета более агрессивные, некоторые менее), в том числе культурные (например, черный цвет в Японии обозначает радость, а белый в Китае – цвет траура).
  • Шрифты – правило №3

    В дизайне сайта допустимо не более 2 разных шрифтов, которые легко и удобно читать (без засечек – такие шрифты для печатной литературы). Рекомендуем для примера посмотреть модные варианты: Helvetica, Roboto. А также не такие востребованные, но не менее подходящие: Lato, Ubuntu, Exo, Railway, Helios. Типовой размер шрифта – 14 pt и выше. Шрифт заголовков должен быть крупнее, чем обычный текст.

    Выравнивать основной текст на сайте лучше всего по левому краю, заголовки допустимо выравнивать по центру. Никакого «газетного» выравнивания по ширине на сайте использовать недопустимо!

    Еще один важный момент оформления текста – длина строки не должна превышать 70–80 символов, чтобы легко было читать с экранов.

    Чтобы получить идеальное межстрочное расстояние (интерлиньяж) для комфортного чтения, используйте размер шрифта * 1,5.
  • Дизайн-шаблоны / UIKit – правило №4

    Все элементы на сайте должны быть оформлены единообразно, у всех схожих по смыслу элементов (ссылки, кнопки «В корзину», кнопки «Оставить заявку», галереи фотографий, меню, формы и т. д.) – должен быть свой единый шаблон оформления, использующий цветовую схему сайта и шрифты.

    То есть, например, все кнопки «Оставить заявку» должны выглядеть одинаково на всех страницах. Так посетителю Вашего сайта будет проще его использовать, он быстро научится работать с сайтом. Как результат – повысится лояльность.

    UIKit – это документ, в котором описываются стили оформления для каждого элемента сайта. Все стили лучше формализовать на этапе создания сайта.
  • Тренды правило №5 (финальное)

    Дизайн не стоит на месте, он постоянно развивается, появляются новые тренды. Сейчас ценится минимализм – простота, точность, много пустого пространства (воздух между элементами). Если у Вас на сайте все еще тенюшечки, градиенты, дикие параллаксы и мигающие яркими цветами баннеры – Вы безнадежно устарели. И что? Конечно, сворачивать головы и говорить: «Смотри-смотри!», – посетители не будут. Они просто закроют, уж простите, этот «нафталин» и уйдут на более современные ресурсы.

    К сожалению, нет дизайна вне времени, устаревает все, так как технологии веба развиваются стремительно. О том, что модно сегодня, читайте в блоге.



3. И все-таки хотите сделать самостоятельно?

1 Что же, мы искренне желаем Вам удачи и вдохновения. Чтобы было проще, вот подборка полезных ресурсов, которые помогут развить в Вас дизайнера: 80 бесплатных ресурсов для дизайнера.



Запасной вариант


Нужен профессиональный дизайн с учетом сетки, колористики, типографики и трендов? Мы создаем сайты с уникальным дизайном, а также исправляем устаревшие дизайны. Просто оставьте заявку на консультацию. Это бесплатно и ни к чему не обязывает. Вам ответят на вопросы о современности дизайна сайта и посоветуют, с чего начать доработки.


Получить консультацию




До встречи в следующем письме и удачи в самостоятельной работе над сайтами.





Анна Сазонова
Руководитель отдела развития
Сервиса 1PS.RU


© 1999-2024 «1PS.RU»