Предполетная подготовка: что нужно сделать с интернет-магазином до начала SEO-продвижения

Константин Елистратов

Основатель и генеральный директор студии интернет-продаж IARGA

Чек-лист разделен на три блока:

• технический,
• визуальный,
• коммерческий.

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

Техническое тестирование сайта

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

Скорость загрузки и вес страницы

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

Часто скорость страдает из-за не оптимизированной логики во фронт- или бэкенде-сайта. Я обычно использую для проверки сервис Pingdom, он меряет скорость ответа, вес и скорость загрузки контента.

Сразу предостерегу от использования Google PageSpeed. Он меряет параметры, влияющие на скорость отрисовки страницы в браузере. Эти параметры лишь слегка коррелируют с показателями скорости загрузки: весом страницы, скоростью ответа сервера (она вообще почти не учитывается). В итоге PageSpeed меряет все что угодно, только не скорость загрузки страниц. А она важна.
На скриншоте видна реальная скорость ответа страницы (Wait-129.0ms), то есть примерно 1/10 секунды.

Проверка поиска

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

Проверка фильтрации

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

Проверка оформления заказа

Заказ оформляется корректно, все письма с уведомлениями отправляются и доставляются.

Проверка расчета доставки

Расчет доставки автоматизирован, работает корректно и не тормозит. Особенно это важно в оформлении заказа. Предусмотрен сценарий работы в случае «тормозов» на стороне образчика служб доставки.

Проверка систем оплаты

Системы оплаты переведены в боевой режим. Оплата с карты и возврат средств проходят корректно.

Проверка онлайн-чеков

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

Проверка телефонов

Удивительно, но факт. Телефоны в сайте часто остаются из дизайн-шаблона. Их обязательно нужно проверить по всему сайту.

Регистрация, авторизация, восстановление пароля

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

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

Визуал и адаптивность

На этом этапе важно проверить на телефоне (вертикально и горизонтально) и на планшете функции, перечисленные выше. В чек-листе наших тестировщиков около 200 пунктов, я вынес сюда основные. Они касаются тех разделов, где ошибки особенно влияют на конверсию и юзабилити.

Общий вид с телефона

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

Погрузиться в каталог максимально глубоко с телефона

Часто при адаптивности теряется возможность погрузиться на 3–4 (и далее) уровень каталога. Это стоит проверить отдельно.

Сравнение товаров

Страница сравнения обычно выглядит как горизонтальная таблица с кучей данных. Важно проверить, чтобы ей было удобно пользоваться на мобильном. Обычно стандартное сравнение «от CMS» для этого не очень подходит.

Добавить товар в корзину

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

Личный кабинет

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

Кликабельные номера и email

Про это часто забывают: клик с телефонного номера должен запускать звонок на этот номер.

Поиск по ключевым словам

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

Найти товар фильтром

Как минимум должно работать. Как максимум – работать удобно. Фильтр должен быть таким, чтобы его было легко найти, отметить, применить и отменить обратно. Мой любимый вариант – фильтр выдвигается сбоку по клику на кнопку «фильтр».

На скриншоте пример кнопки «Фильтр», раскрывающей фильтр, который без перезагрузки обновляет товары.

Расчет доставки и выбор точки самовывоза

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

Оформить заказ

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

Страница оплаты

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

Коммерческий чек-лист

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

Структура каталога

Структура должна погружаться «От общего к частному», недопустимо использовать в качестве разделов свойства (например, «Мониторы 17») или бренды (например, «мониторы самсунг»), так как это сделает невозможным поиск между несколькими брендами/размерами. При формировании стоит оглядываться на лидеров в сегменте либо в поисковой выдаче. Предположительно, такая выдача удобна и привычна пользователям.

Логика анонсов и баннеров на главной

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

Информация об оплате и доставке

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

Заполненность отзывов

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

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

На скриншоте явная заказуха: живые люди не запоминают марку матраса (да еще и марку предыдущего). Ну и многовато дифирамбов для живого человека. И ниже было еще 300(!) таких же отзывов.

Максимально полное заполнение карточки товара

Должны присутствовать следующие элементы:

• описание,
• картинки,
• характеристики,
• документация (сертификаты), если есть.
• информация о доставке, гарантии, наличии.

На скриншоте очевидная проблема – у товара только одно фото:

Проверить увеличение на фото

По клику или при наведении. Эта функция часто не рисуется, так как не требует макетов и, как результат, забывается программистами.

Статьи и новости

Если на сайте есть вкладка «Статьи» и «Новости», то добавить минимум по 2–3. Сайт с единственной новостью «мы открылись» не должен выходить в продвижение. Возможно, для этого потребуется качественный копирайтинг и подбор контента. На скриншоте яркий пример как не надо. Две новости от 2017 года. Первая «мы работаем», вторая: «а теперь действительно работаем».

Реквизиты

Во вкладках «Контакты» или «О компании» нужно заполнить реквизиты. Проверить корректность и соответствие реквизитам в платежной системе.

Рекомендуемые товары

Согласовать логику и при необходимости заполнить вручную «Рекомендуемые товары» к товарам в каталоге или в корзине.

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

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