Как сделать редизайн сайта – пошаговая инструкция и регламент проведения

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

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

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

Опросник по причинам:

• Сайт устарел?
• Сайт обладает всем необходимым функционалом?
  
• Сайт выглядит лучше конкурентов?
  
• Посетители сайта становятся клиентами?

Почему необходимо провести редизайн?

• Сайт не отображает качеств и ценностей бизнеса.
• Сайт уступает позиции конкурентам.
  
• Показатели конверсии ниже средних в нише и уступают конкурентам.
  

Цель редизайна:

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

*Ваша цель может быть в абстрактной формулировке. Например, «обновить сайт, сделать его быстрее и удобнее» или «обновить сайт и опередить конкурентов по позициям и трафику». Но не забывайте расшифровывать свои цели и фиксировать их. Что значит быстрее, удобнее, больше трафика – всё это можно выразить в понятных цифрах, которые станут вашими KPI для проекта.

Данный этап проведения редизайна, фактически, единственный, который будет напрямую зависеть от «силы» бренда компании и желания компании создать «базу» для предстоящих работ.

Какие виды исследований можно запланировать:

• Опросы текущих клиентов;
• Создание персон и тестирование гипотез на персонах;
  
• Интервью со своей командой разработки;
  
• Интервью с целевой аудиторией;
  
• Анализ данных веб-аналитики;
  
• Составление Customer Journey Map;
  
• Конкурентный юзабилити аудит;
  
• Юзабилити тестирование интерфейса целевой аудиторией;
  
• Анализ технических показателей;
  
• Анализ функциональных элементов.

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

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

• Изучаем и фиксируем семантику сайта;
• Изучаем и фиксируем позиции сайта;
  
• Фиксируем весь перечень страниц и страниц входа на сайт;
  
• Фиксируем доп.KPI (лиды, процент конверсий, отказы).
  

После фиксации текущей результативности определите положение компании на рынке и динамику проекта.

Например, вы 5 в Яндекс и 3 в Google. Соотнесите позиции с конкурентами. Проведите анализ по кластерам запросов.

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

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

Основной и обязательный вид работ, предваряющий стадию отрисовки прототипов. Здесь вам нужно строго определить:

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

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

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

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

Сначала дайте необходимое для переезда:

• ТЗ на настройку основных перенаправлений;
• Карту редиректов;
  
• ТЗ на внесение Мета-тегов;
  
• Пояснения по заголовкам сайта;
  
• ТЗ на alt изображений;
  
• Структуру сайта и пояснения;
  
• ТЗ на перенос контента;
  
• Правила для канонических страниц;
  
• ТЗ на генерацию sitemap.xml;
  
• Шаблон 404 страницы;
  
• ТЗ на настройку HTTP headers;
• ТЗ на внедрение основных видов микроразметки;
  
• ТЗ на внедрение Open Graph.
  

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

Выработайте единый документ, где будут указаны все требования к редизайну:

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

Ваше ТЗ должно стать руководством к проведению работы.

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

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

Когда вы провели ревью теста и убедились, что всё в порядке, переносите сайт на бой. Наконец, разработчики говорят вам, что всё готово. Но теперь необходимо провести ревью после переноса на бой. Например, на бою и тесте могут быть разные настройки хостинга. Не позволяйте небольшим деталям повлиять на итоговый результат. Удачи!