Редизайн и апгрейд Drupal-сайта "Математическое бюро"
ЗаказчикПроект посвящён моделированию на оптовом рынке электроэнергии. В русскоязычной сети подобных узкотематических блогов нет.ЗадачаКлассически редизайн. Мы провели аудит сайта и предложили более продуктивный подход: провести работу по SEO, проработать структуру разделов и страниц сайта.
Мы в Initlab занимаемся разработкой, поддержкой и усовершенствованием сайтов на Drupal. Сегодня расскажем вам о том, как мы полностью обновили дизайн и переработали структуру сайта математического бюро.
Небольшая ремарка: дизайн разрабатывали наши хорошие друзья из студии PLATZKART по результатам нашего SEO-проектирования. Мы подробно описали все необходимые рекомендации и внедрили готовый дизайн на сайт.
Задача. К нам обратились за стандартным редизайном, обновить фон, цвета и формы. Мы провели аудит сайта и предложили более продуктивный подход: вместе с обновлением дизайна провести работу по SEO, проработать структуру разделов и страниц сайта.
Мы подготовили объёмный документ по SEO-проектированию, в котором детально изложили наше видение, предложения и пожелания к проекту. После согласования с заказчицей мы приступили к редизайну. В этом кейсе мы опустим большую часть технических подробностей и покажем основные визуальные и структурные решения.
Позиционирование
В первую очередь мы предложили усилить позиционирование.
Раньше на главной странице пользователя встречала информация о математическом бюро, т.е. в представлении большинства некой организации. При этом в заголовке было указано, что это проект Ирины Чучуевой. Информация подавалась через обилие текста и не давала понять, что важнее: личность создательницы или деятельность организации.
Мы решили эту задачу так:
- теперь в первую очередь пользователь видит фотографию основательницы. Так мы сместили фокус на то, что по большей части это её блог, её проект и большая часть статей написана ею;
- компетенции создательницы выражаются через портфолио и научные статьи, поэтому мы вывели их более наглядно на главный экран;
- таким образом мы гармонизировали через визуал личность создательницы и её детище.
Было
Стало
Технические и визуальные решения
Оставили светлые тона, минимализм. У прошлого сайта было действительно грамотное цветовое решение для специфики контента. Мы оставили дизайн минималистичным и светлым, идеально подходящим для восприятия графиков, таблиц и формул.
Отделили важные элементы блоками, немного оживили их оформление. Например, раньше тизеры статей были сплошным текстом с гиперссылкой в заголовке. Теперь это более объёмные элементы интерфейса с кнопками «Подробнее».
Было
Стало
Сократили меню. В старой версии «Статьи» и «Блог» были отдельными пунктами меню. Читателю было не совсем понятно в чём отличие. Можно было предположить, что в блоге содержатся статьи создательницы, а в статьях больше предложенных материалов, однако и там, и там содержались смешанные записи от разных авторов. Мы предложили объединить этот раздел в «Блог» и вынести его в нижнее меню, на главный экран и в виде тизеров статей на главной странице + вынесли блок «Сотрудничество» отдельно в меню. Раньше оно входило в приветственный текст.
Было
Стало
Расширили главную. Раньше главная страница опиралась на узкую сетку, что создавало впечатление устаревшего сайта. Сама страница укладывалась практически в один скролл. Мы дополнили её информацией и сделали более адаптивной для современных экранов.
Было
Стало
Добавили тематическую навигацию. Тематическая навигация важна, чтобы посетитель в любой момент, даже попав первый раз на статью, мог увидеть, какие темы отражены в блоге, и быстро перейти к нужным записям. А также наличие сквозных ссылок на разделы увеличивает вес этих разделов и продвигает их в поиске.
Было
Стало
Адаптировали под мобильные устройства. Аналитика показала, что более 70% посетителей десктопные. Однако:
- По данным Google Search Console, индексация и оценка сайта сейчас происходит по мобильной версии.
- Трафик в последние годы стремительно уходит на мобильные устройства, не стоит им пренебрегать.
Поэтому важно, чтобы сайт был удобным и быстрым как с десктопной, так и с мобильной версии.
Было
Стало
SEO: Настроили похожие публикации, перелинковку и теги. Всё это было на старом сайте, но иногда встречались мелкие ошибки вроде битых ссылок или нарушенной логики. Также мы обновили отображение тегов и похожих публикаций.
Было
Стало
Посвятили клиента в основы принципа E-A-T. Поисковые системы при ранжировании сайтов уже давно оценивают не только текстовые и технические факторы. На первый план все больше выходят такие критерии, как качество контента и информации, полезность и уровень экспертности автора. E-A-T факторы (аббревиатура от слов expertise (экспертность), authoritativeness (авторитетность), trustworthiness (достоверность)) в SEO — это критерии, которые поисковый алгоритм Google учитывает при определении качества контента и ресурса в целом. Такие показатели свидетельствуют о том, что страница содержит контент, которому можно доверять, а значит страница достойна более высокого места в выдаче. Теперь клиент учитывает эти факторы при загрузке контента на сайт.
Репутация, позиционирование:
Подписка на рассылку. Мы добавили на сайт подписку на новостную рассылку. Она не сильно навязчивая (раз в полгода), рассказывает о новых статьях и помогает создательнице искать единомышленников.
Мультиязычность. На сайте была слабо развита английская версия. После общения с основательницей мы выяснили, что она хотела бы делать больший упор на зарубежную аудиторию, демонстрировать иностранный опыт. Мы учли зарубежную специфику в работе с мультиязычностью, сайт смотрится одинаково хорошо на обоих языках.
Форма обратной связи. Раньше находилась только в разделе «Контакты», хотя её очень не хватало на странице «Сотрудничество», куда мы её тоже добавили.
В итоге мы проделали достойную, на наш взгляд, работу: добавили недостающие функции, убрали лишнее и освежили дизайн.
Мы в Initlab уверены, что вместе с внешним видом нужно обращать внимание на юзабилити, скорость загрузки и другие показатели сайта. Вместе с редизайном можно решить множество проблем, до которых всё никак не доходят руки: улучшить код, мигрировать на более новую версию Drupal, добавить новые функции и т.д.
Перейти на сайт
Полный текст статьи читайте на CMS Magazine
