Кейс по созданию нового многостраничного сайта для архитектурное бюро в Санкт-Петербурге. Делимся опытом: предыстория проекта, основные задачи и реализация, от блочной структуры, до результата.

Заказчик
Предыстория
Основные задачи
Реализация. Блочная структура
Реализация. Дизайн
Результат
Итог

Заказчик

ООО "Эверест" - архитектурное бюро в Санкт-Петербурге. Основное направление компании заключается в проектировании и техническом обследовании зданий.

Предыстория

Компания имела в своем распоряжении самописный сайт на протяжении десяти лет, занималась его ведением и периодически вносила в него небольшие изменения. Сайт использовался не только как представительский-информационный ресурс компании, а так же, как канал получения новых клиентов. В следствии быстрого развития рынка web услуг и технологий, сайт потерял актуальность и потускнел на общем фоне сайтов конкурентов. Компания начала движение в сторону полного обновления сайта, получила множество предложений от разных web студий, в том числе и от нас. После личной встречи с генеральным директором и некоторого времени, было принято решение о сотрудничестве с нами по данному вопросу.

Основные задачи

Сайт должен быть написан на CMS MODx Revolution, возможность быстрого и удобного ведения.
Создание продуманной структуры сайта на основе поведенческого характера типового посетителя, отвечающей всем основам юзабилити.
Создание нового, современного дизайна на основе синего и желтого цветов.
Сохранение структуры сайта, его основного текстового содержания.
Адаптивность под мобильные устройства, кроссбраузерность под популярные браузеры, включая IE.

В процессе создания добавились такие задачи, как подключение и настройка систем сбора статистики Яндекс.Метрика и Google Analytics, подключение и интеграция многофункциональной системы Calltouch.

Реализация. Блочная структура

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

Было принято решение сделать шапку сайта в два уровня: информационный и навигационный, последний сопровождает посетителя по странице. После шапки на каждой странице последует блок с тематическим изображением, заголовком и описанием. Подвал сайта так же в два уровня: навигация по основным услугам, контактные данные и форма обратной связи; копирайт. Страницы получили некоторые общие блоки:

Лицензии и допуски, отзывы (блок содержит ссылки на соответствующие страницы).
Наши клиенты (блок содержит слайдер с логотипами клиентов).

Реализация. Дизайн

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

Результат

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

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

У компании Эверест более 400 выполненных объектов, отзывов и документов так же насчитывается не мало. Страницы, содержащие соответствующую информацию имеют возможность ajax подгузки в навигации, что значительно упрощает просмотр информации таких объемов.