Редизайн и апгрейд Drupal-сайта «Математическое бюро»

Заказчик
Проект посвящён математическому моделированию на оптовом рынке электроэнергии. В русскоязычной сети подобных узкотематических блогов нет.
Задача
Классически редизайн. Мы провели аудит сайта и предложили более продуктивный подход: провести работу по SEO, проработать структуру разделов и страниц сайта.

Мы в Initlab занимаемся разработкой, поддержкой и усовершенствованием сайтов на Drupal. Сегодня расскажем вам о том, как мы полностью обновили дизайн и переработали структуру сайта математического бюро.

Небольшая ремарка: дизайн разрабатывали наши хорошие друзья из студии PLATZKART по результатам нашего SEO-проектирования. Мы подробно описали все необходимые рекомендации и внедрили готовый дизайн на сайт.

Задача. К нам обратились за стандартным редизайном, обновить фон, цвета и формы. Мы провели аудит сайта и предложили более продуктивный подход: вместе с обновлением дизайна провести работу по SEO, проработать структуру разделов и страниц сайта.

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

Позиционирование

В первую очередь мы предложили усилить позиционирование.

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

Мы решили эту задачу так:

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

 

Было 

 

Стало

Технические и визуальные решения

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

Отделили важные элементы блоками, немного оживили их оформление. Например, раньше тизеры статей были сплошным текстом с гиперссылкой в заголовке. Теперь это более объёмные элементы интерфейса с кнопками «Подробнее».

 

Было

 

Стало

Сократили меню. В старой версии «Статьи» и «Блог» были отдельными пунктами меню. Читателю было не совсем понятно в чём отличие. Можно было предположить, что в блоге содержатся статьи создательницы, а в статьях больше предложенных материалов, однако и там, и там содержались смешанные записи от разных авторов. Мы предложили объединить этот раздел в «Блог» и вынести его в нижнее меню, на главный экран и в виде тизеров статей на главной странице + вынесли блок «Сотрудничество» отдельно в меню. Раньше оно входило в приветственный текст.

 

Было

 

Стало

Расширили главную. Раньше главная страница опиралась на узкую сетку, что создавало впечатление устаревшего сайта. Сама страница укладывалась практически в один скролл. Мы дополнили её информацией и сделали более адаптивной для современных экранов.

 

Было

 

Стало

 

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

 

Было

Стало


Адаптировали под мобильные устройства. Аналитика показала, что более 70% посетителей десктопные. Однако:

  1. По данным Google Search Console, индексация и оценка сайта сейчас происходит по мобильной версии.
  2. Трафик в последние годы стремительно уходит на мобильные устройства, не стоит им пренебрегать.

Поэтому важно, чтобы сайт был удобным и быстрым как с десктопной, так и с мобильной версии. 

 

Было

 

Стало

SEO: Настроили похожие публикации, перелинковку и теги. Всё это было на старом сайте, но иногда встречались мелкие ошибки вроде битых ссылок или нарушенной логики. Также мы обновили отображение тегов и похожих публикаций.

 

Было

 

Стало

 

Посвятили клиента в основы принципа E-A-T. Поисковые системы при ранжировании сайтов уже давно оценивают не только текстовые и технические факторы. На первый план все больше выходят такие критерии, как качество контента и информации, полезность и уровень экспертности автора. E-A-T факторы (аббревиатура от слов expertise (экспертность), authoritativeness (авторитетность), trustworthiness (достоверность)) в SEO – это критерии, которые поисковый алгоритм Google учитывает при определении качества контента и ресурса в целом. Такие показатели свидетельствуют о том, что страница содержит контент, которому можно доверять, а значит страница достойна более высокого места в выдаче. Теперь клиент учитывает эти факторы при загрузке контента на сайт.

Репутация, позиционирование:

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

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

Форма обратной связи. Раньше находилась только в разделе «Контакты», хотя её очень не хватало на странице «Сотрудничество», куда мы её тоже добавили.

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

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


Перейти на сайт

В карточку агентства

Письмо автору кейса

Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов
Подпишитесь на рассылку
Читайте также
Кейсы по теме#Маркетинг, дизайн, реклама
Проекты компании Proactivity Group