Консультация по дизайну сайта

Добрый день! Меня зовут Антон Черный. Я дизайнер в компании Vigbo.

По вашему сайту я разделю разбор на 2 части. Это будут конкретные моменты на которые я укажу вам с помощью скриншотов и расскажу что в них лучше поправить или заменить и основные советы, это то на что стоит обратить внимание на протяжении всего сайта.

Конкретные моменты:

1) Начнем с вашей шапки сайта.

Старайтесь не допускать таких моментов, когда у вас шапка сайта распадается на 2 строки это неправильно с точки зрения веб-дизайна и не удобно для пользователя. Вы можете либо уменьшить размер текста в пунктах меню, либо смело в 2 раза уменьшить размер логотипа, таким образом все поместится на одной строчке.

Также, если говорим о меню навигации, хочется заметить как вы оформили всплывающие пункты меню, например при наведении на ссылку "Экскурсии". Чтобы я советовал поправить:

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

2) Сейчас покажу кусочек вашего сайта:

В этом месте самая большая концентрация не выровненных блоков.

Заголовок "Экскурсии..." выровнен по правому краю сайта
Подзаголовок "о1 Наши услуги" по левому краю сайта
Тексты в блоках ниже имеют выравнивание по центру

Из-за этого создается ощущение, что блок весь "кривой". Я бы советовал сделать следующее:

Выровнять все тексты по центру
Убрать пунктирную линию совсем. Мы (дизайнеры) вообще не советуем загрязнять сайты этими разделителями, лучше это делать с помощью отступов или игрой с цветом

3) Данный блок с текстом желательно переработать:

Не используйте лишние пробелы как в последнем предложении
Добавьте межстрочного интервала, а то строки слипаются
Акцентируйте важные заголовки с помощью размера текста
Выровняйте все по левой части, а то появился отступ

4) Далее все красиво. Доходим до блока:

Какой-то немного кривой блок. Все разное, прыгает. Может как-то его пересмотреть? Чтобы он ровнее и очевидней был для пользователей.

Основные советы по сайту:

1) Обязательно проверьте, чтобы на сайте не использовалось более 2 шрифтов. Есть негласное правило хорошего дизайна, что на сайте используется 1-2 шрифта. Из них, например, 1 шрифт используется для простого текста на сайте, 2-ой же шрифт используется для заголовков и текстов, где шрифт пишется большим размером. Это создаст общую стилистику вашему сайту и все страницы и блоки на сайте будут составлять собой одно целое. Это улучшит восприятие вашего проекта в целом. Также стоит использовать не только одинаковые шрифты, но и одинаковые настройки этих самых шрифтов.Если с этим сложно, то я рекомендую сделать так. Выписываете на листочек настройки из одного заголовка, который вам нравится по внешнему виду. Выписать нужно:

Название шрифта
Размер шрифта
Межбуквенное расстояние
Межстрочное расстояние

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

Заголовки
Текст в кнопках и ссылках
Подзаголовки и надзаголовки
Обычный текст сайта

Таким образом у вас будет отличная типографика на сайте. Также делаем и мы, когда создаем свои шаблоны для конструктора.

2) То, что я вам выше писал про шрифты качается также и всех кнопок на сайте а также отступов. Начнем с кнопок. Вы должны выбрать 1 вариант кнопки, ее размер, шрифт, настройки, форма написания (все большие или только первая буква большая), ее цвет, цвет при наведении. И использовать на всем сайте именно такие кнопки. Иногда имеет смысл сделать второй вариант кнопки, если она используется поверх изображений

3) Отступы тоже очень важны. Они визуально строят ваш сайт. Проверьте чтобы в начале и в конце каждого из блоков на вашем сайте использовался одинаковый отступ, например 40-50px. Когда вы используете разные отступы в блоках, это визуально "ломает" сайт как гармошка.

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

Я сделал общий обзор по сайту. Это те советы, которые помогут вам его улучшить. если вдруг что-то не понятно, есть какие-то вопросы, то пишите мне через личный кабинет. Не стесняйтесь, спрашивайте, возможно нужно что-то исправить или проверить сайт после вашей доработки. В общем по любым вопросам я вас жду. В остальном же желаю удачи вашему делу и бизнесу, надеюсь у вас все получится таким, как вы его задумали. Всего хорошего!