Улучшаем в интернет-магазине страницы с системными сообщениями

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

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

Страница ошибки «404 - not found»

Дизайн этой страницы обычно такой же, как у типовых внутренних страниц, потому что разработкой дизайна и оформлением страницы 404 не приято заморачиваться. Оставляют ее такой, как предусмотрено в CMS. Иногда на ней помимо сообщения «Страница не найдена», размещают карту сайта или форму поиска. Это, конечно, лучше чем одно только сообщение, что такой страницы нет, но подумав можно найти решения получше. Как же должен быть сделан правильный шаблон страницы ошибки 404?

Давайте порассуждаем. Какое основное целевое действие должен совершить посетитель, который оказался на странице с ошибкой «404 – страница не найдена»? Ответ прост — он должен не закрыть окно браузера и остаться в магазине! Если смотреть на проблему под таким углом становится ясно: просто сообщить пользователю что он лузер и такой страницы больше нет — не вариант. Поэтому текст сообщения «Страница не найдена» лучше писать не самым огромным шрифтом (потому что просто уведомить перестает быть главной задачей дизайна).

Почему страницы с отсутствующим товаром лучше не удалять и что делать вместо этого, хорошо написано на devaka.ru.

Думаем дальше. Как посетители попадают на 404-ю страницу? — Тремя способами:

1. Страница в магазине удалена, но в индексе поисковых систем еще присутствует.
2. Посетитель перешел по ссылке, которая:
   а) ведет на удаленную страницу,
   б) поставлена неверно с другого сайта,
3. Посетитель сам неверно ввел адрес страницы в строку браузера.

В идеале нужно понимать на какую именно страницу хотел попасть посетитель и в случае 1 и 2а — это вполне по силам. Можно по URL (если он имеет нужную структуру) угадать, к какому разделу ранее (до удаления) относился товар, и выводить на 404-й странице для посетителя список других товаров из того же раздела. Таким образом, посетитель, который перешел с поисковика, например, на товар «Сарафан в пол с леопардовым принтом», увидит другие сарафаны из того же раздела. Согласитесь шансы, что посетитель задержится на странице сильно возрастают, против стандартного уведомления «Извините, такой страницы нет».

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

Для интернет-магазина хорошим вариантом будет показывать на 404-й странице «Каталог товаров», но не скучное текстовое дерево, а с картинками, чтобы было интересно смотреть и из чего выбирать. Другой вариант — показывать на странице с ошибкой список самых популярных товаров, или самые дешевые, или самые дорогие. Если посетитель авторизован — покажите ему его избранное, конечно, если там уже есть отложенные товары. Но только не пустую страницу со стандартным уведомлением «Страница не найдена».

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

Пара советов слегка оффтопик:

1. На 404-й странице не должно быть редиректов и адрес в строке браузера пользователя должен остаться без изменений. Это удобно если пользователь увидит что набрал URL страницы неверно и решит исправить ошибку.
2. Что бы вы не решили показывать на 404-й странице, ответ сервера при ее отображении должен быть с кодом «404 Not Found» (а не 200 или еще каким-то). Это важно для SEO. Проверить код ответа сервера, можно тут, указав любую отсутствующую страницу или в Яндекс.Вебмастере.

Ваша корзина пуста

Другая, страница в интернет-магазине, про которую забывают — пустая корзина. Эту страницу посетитель увидит, если находясь в корзине, удалит все товары либо зайдет в корзину, пока в ней нет товаров (например, по адресу, запомненному браузером).

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

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

Попробуем разобраться, как пользователь может оказаться в пустой корзине: 1. Перейдет по ссылке, которую запомнил браузер. 2. Удалит в корзине все товары. 3. Зайдет оформлять заказ по ссылке «Оформить заказ» но в корзину ничего еще не положил (выше говорилось, что такой ссылки просто не должно быть, если корзина пуста).

Хороший способ улучшить пустую корзину — положить в нее подарок. Часто, в интернет-магазинах уже при входе, посетителю в корзине автоматически добавляют подарок. Удалить подарок из корзины нельзя и таким простым способом убивается два зайца: стимулируется оформление заказа, и покупатель не увидит пустую корзину. Нужно помнить, что цена подарка в корзине должна значиться как 0 рублей. Чтобы покупатель ошибочно не думал, что у него в корзине лежит товар, стоящий денег, но который нельзя удалить. Никакие компромиссы типа «пересчетов постфактум», «заплатите за вычетом суммы подарка» недопустимы. Стоимость подарка не должна суммироваться со стоимостью заказа.

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

Хорошо если получение подарка ограничено по времени и это видно в корзине. Это будет стимулировать оформить заказ. Чем дороже подарок, тем сильнее.

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

Иногда, полезно давать инструмент «Вы удалили из корзины», в котором будут показываться товары только что удаленные. Казалось бы, зачем это делать. Но смысл есть. Особенно в женских нишах и с большим ассортиментом. Покупатель, делая выбор, может добавить товар в корзину спонтанно, потом, перед оформлением заказа, подгоняя заказ под приемлемую сумму какие-то товары удалять. Но точно так же может захотеть вернуть удаленный товар. Чтобы это сделать, ему придется уходить из корзины в каталог (что не соответствует главному целевому действию в корзине) и снова там искать удаленный товары. Это раздражает, особенно если каталог большой, а товар был найден на какой-нибудь 10-й странице пагинатора.

Я очень редко вижу такую возможность в инет-магазинах, но это вполне работающий инструмент. В любимом мной 1С-Битриксе, «из коробки» этот функционал реализован как возможность «отложить» товар из корзины. По сути то же самое что удаленные товары.

Ноль товаров (в маленькой корзине)

Сейчас почти в любом магазине есть функционал «маленькая корзина». Это прокачанная ссылка на корзину, расположенная обычно в правом верхнем углу всех страниц сайта (кроме корзины и страницы оформления заказа). В ней выводят количество товаров, общую сумму, иногда там же есть возможность удалять товары из корзины, менять количество и конечно кнопка «оформить заказ». Часто маленькую корзину делают плавающей — это удобно и помогает переходу в корзину для оформления заказа — одному из целевых действий в каталоге товаров интернет-магазина.

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

Если вы всем посетителям даете  подарок, то в маленькой корзине – информере, тоже нужно писать об этом. Когда товаров нет — пишем просто – «В корзине подарок». Когда товары в корзину уже добавлены покупателем, пишем, например, так: «3 товара на 3500 р. и подарок».

Как только в корзине появляется товар, маленькая корзина становится плавающей — приклеенной к правой верхней части окна браузера.

Ничего не найдено (результаты поиска по сайту)

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

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

Не все посетители понимают что «По запросу ничего не найдено» — не всегда означает отсутствие товара, а просто нужно попробовать искать по-другому.

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

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

Но что делать, если товары действительно не найдены? Можно попытаться упростить поисковый запрос пользователя, если по нему нет результатов. То есть если по запросу «вечернее черное платье» мы видим что результатов «0», то автоматически разбиваем запрос на три: «Вечернее», «Черное» и «Платье» и вываливаем на посетителя результаты. Это неточное соответствие его запросу, но лучше чем ничего. При этом не забываем уведомить, что запрос упрощен, поскольку по полному запросу ничего не найдено.

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

Отсутствие результатов фильтра

Эту страницу посетитель интернет-магазина увидит, если в каталоге товаров задаст параметры для фильтрации, которым не будет соответствовать ни один товар. Например, сначала выберет раздел «Вечерние платья», в нем задаст фильтр по цвету «Синий», далее из всех синих платьев захочет выбрать только размера SM и среди них только те, что по цене от 2500 до 4000 р.

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

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

Повторим вышеприведенный пример: Сначала пользователь зайдет в раздел «Вечерние платья». В параметрах фильтра должны выводятся только те параметры, по которым есть товары. Т.е. если в разделе «Вечерние платья» нет супербольшого размера XXXL, то в фильтре такой галочки тоже не будет, соответственно выбрать ее будет нельзя. Далее, по той же схеме — пользователь задаст в платьях фильтр по цвету «Синий», увидит все синие вечерние платья, а заодно уберутся из фильтра все «лишние» поля (товаров по которым заведомо не будет). Например, если нет синего вечернего платья по цене до 2000 р., то в фильтре бегунок будет стоять на 2500 р. — минимальной цене по которой есть в наличии синее вечернее платье. В конечном итоге, если покупатель задаст слишком много параметров в фильтре, у него «закончатся» варианты выбора, а на странице с результатами будут выведены товары соответствующие последним, выбранным им настройкам фильтра. И никаких страниц «Товаров не найдено» не будет. Похожим образом реализован умный фильтр в 1С-Битриксе.

Избранное. Отложенных товаров нет

Если в интернет-магазине есть сервис «Добавить в избранное» (иногда его называют «Отложенные товары»), то на странице, когда не добавлено еще ни одного товара, обычно пишут «Товаров в избранном нет».

Это нормальное уведомление. Но не соответствует важному правилу – сказал о проблеме — дай решение. 

В этом случае решением будет небольшой текст с описанием работы данного функционала и/или видеоролик о том, как пользоваться «Избранным» на вашем веб-сайте.

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

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

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

Нет товаров для сравнения

Когда в интернет-магазине есть функционал сравнения товаров, страницу с уведомлением «Нет товаров для сравнения» посетитель увидит, если сумеет перейти на пустую страницу, или когда сам удалит все товары из списка.

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

При этом покупатель, перемещаясь в каталоге, переходя из раздела в раздел может запутаться. Зайдет в «Ноутбуки» и удивится, вроде бы добавлял товары для сравнения, а их там нет.

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

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

Теперь возвращаемся к главной теме — что выводить при отсутствии товаров для сравнения (в одном или нескольких списках — неважно).  Нормальным вариантом, помимо стандартного уведомления «Товаров для сравнения нет», выводить, так же как в предыдущем примере с «Избранным» небольшую справку как пользоваться функционалом и какие удобства он дает покупателю.

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

Выводы

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

Кратко резюмирую:

• Определяем, как посетитель попадает на страницу. Бывает, что в зависимости от этого можно показывать разную информацию. Об этом говорилось в начале поста в примере про страницу 404.
  • Не забывайте что все подобные страницы (кроме удаленных страниц товаров) должны быть закрыты от индексации в robots.txt (корзина, сравнение, избранное, результаты поиска, иногда и результаты фильтра). Т.е. нужно исключить вариант, при котором на них попадает посетитель с поисковика. Потому что содержимое этих страниц персональное для каждого пользователя и не может быть правильно проиндексировано.
  • Нужно упомянуть, что при правильном подходе, страницы с результатами фильтра могут быть хорошими лендингами для низко и среднечастотных запросов. Поэтому закрывать от индексации результаты  фильтра или нет, нужно решать в каждом отдельном случае.
• Помним об основном целевом действии, которое хотим, чтобы совершил посетитель. Не забываем что целевые действия отличаются, например, для корзины в которой есть товары и для пустой корзины.
• Незабываем, что пользователь может быть авторизован или нет, иногда это важно. В зависимости от этого можно показывать разную информацию. Например, если пользователь авторизован и в его «Избранном» есть товары, иногда есть смысл повышать товары из пользовательского избранного в результатах поиска по магазину или показывать на других страницах.
• Учитываем правило: Сообщили о проблеме — дайте пути решения. Если без «сухого уведомления» не обойтись, не забывайте говорить пользователю, что ему сделать дальше. Например, если пользователь ввел неверно пароль, кроме уведомления «Ошибка авторизации», следует писать возможную причину ошибки (возможно, неверно указан емейл или пароль) и способ ее решения (вспомнить пароль).
• Одно другому не мешает. На системных страницах стандартные сообщения должны остаться. То, о чем сказано в этой статье, это не «вместо» стандартных уведомлений, а дополнительно к ним.