Разбор сайтов магазинов «Магнит», «Пятёрочка» и «Дикси»

В чём польза, удобство и удовольствие сайта — искало и нашло digital-агентство Red Collar.

Разбираемся, чем полезны сайты «магазинов у дома» и насколько легко эту полезность добыть. Для этого выбрали три наиболее крупные в нашей стране торговые федеральные сети: «Магнит», «Пятёрочку» и «Дикси».

Как оцениваем

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

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

  • 1 — функции нет на сайте.
  • 2 — есть, но пользоваться почти невозможно.
  • 3 — есть, но неудобная.
  • 4 — есть, удобная, но с косяками.
  • 5 — реализована отлично.

Надёжность

Начнём с технических моментов, без которых сайт не сайт: проверим, что он не просто открывается, но работает быстро, оптимизирован, доступен с разных устройств и браузеров и, конечно, адаптивен.

Со скоростью загрузки у «Магнита» всё хуже, чем у соперников — speed index 11.110 ms: скорее всего, это происходит из-за не ужатых изображений. А ещё не минифицированных JS-файлов: это когда код написан огромным столбом, а не сокращён до одной строки.

Сайт для широкой ЦА должен быть доступен людям с разными возможностями: например, им должно быть легко пользоваться и без мыши. У «Магнита» при переключении кнопкой Tab подсветка не попадает в выбор города, а значит, невозможно найти магазин рядом. Производительность в порядке, но пятёрку не поставим, так как сайт по реализации несложный и не за что оценить виртуозность разработчиков.

«Пятёрочка» сделала адаптив только на своих промостраницах: выручай-карте и детском клубе. Хорошая скорость загрузки сайта, но отсутствие адаптива перевешивает. Если нажмёте Tab, чтобы воспользоваться сайтом с клавиатуры, ни одна кнопка не подсветится, хотя сами кнопки активны.

У «Дикси» страницы разработаны так, чтобы быть удобными при просмотре с телефона, но небольшой косяк с карточками товаров: фото продукции не адаптируется. Со скоростью загрузки всё в порядке, как и с доступностью сайта.

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

Функциональность, удобство, удовольствие

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

Кейс 1: найти магазин

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

У «Магнита» геолокация определяется криво, приходится выбирать руками. Причём в блоке «Найти ближайший магазин» дадут выбрать только из региона, который вбит в шапке сайта. Не продумали путь пользователя. С первой попытки на поиск нужного магазина у нас ушло 1:42 минуты с десктопа, это очень долго.

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

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

На сайте «Дикси» из шапки есть прямой доступ к «Найти ближайший магазин». И самый удобный из трёх сайтов вид поиска: отсечение по области, городу и улице, который не зависит от города в шапке. Нашли точку за 43 секунды.

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

Кейс 2: узнать акции

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

Акции у «Магнита» делятся только по типу магазина, по категориям нет. Видно, что сайт хочет поговорить с покупателями через обилие акций — это плюс, но по ним неудобно навигировать — большой минус.

У «Магнита» поиск по сайту выдаёт только совпадение по новостям. Он для представителей СМИ, а не клиентов.

У «Пятёрочки» есть фильтры по категориям, хотя самих категорий нет. Классно, что предлагает выбрать акции в магазине рядом.

Поиск в «Пятёрочке» работает странно: если не находит нужного в товарах, выдаёт совпадение по новостям, если искомого нет нигде — не подскажет, где посмотреть вручную.

Когда хочешь выпить, но тебя останавливают

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

У «Дикси» акции есть на главной странице как промоблок, а в разделе «Акции и скидки» ничего не нашли. Зато в «Каталоге товаров» оказались как раз акционные позиции. Фильтрация не работает.

Кейс 3: ищу работу

Поиск сотрудников — одна из важнейших задач для крупных федеральных сетей с штатом сотрудников около 280 тысяч человек. Посмотрим, как сайты справляются с HR-задачами.

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

На главной странице «Магнит» сделал самостоятельный блок с вакансиями и фильтром — молодец

«Пятёрочка» упомянула об открытых вакансиях только в футере сайта, откуда переходишь на страницу с поиском работы. Дальше всё не продумано: работа в офисе есть только в Москве, а к складам и магазинам прикрутили карту, которая не работает.

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

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

Можно сделать два вывода: или компаниям не нужны новые сотрудники, или они не используют свои сайты с максимальной пользой для бизнеса. Кстати, большое количество открытых вакансий показывает, что сеть стабильно растёт и развивается — большой плюс HR-бренду.

Сверхценность

Это не интернет-магазин одежды, где ты можешь сидеть часами и с удовольствием рассматривать товары. Тут быстрое взаимодействие: зашёл, глянул и вышел. И от того, насколько зацепит информация, какое впечатление останется у человека, — зависит, купит ли он эту вещь в офлайне и вернётся ли на сайт ещё раз.

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

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

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

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

Сайт «Пятёрочки» неплохой, но погибает из-за контента

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

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

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

Вариант, чтобы исправить сейчас — отдать эту задачу команде со вкусом, которая разработает шаблон под все виды акций и будет его придерживаться. Но если с баннерами было понятно ещё при разработке сайта, то надо было поставить задачу агентству и чётко озвучить, что акции крайне важны.

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

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

Приложение

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

Победитель

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

Вывод

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

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

0
45 комментариев
Написать комментарий...
Михаил Муромов

Господи помилуй, у них, оказывается, есть сайты! Лет 15 уже покупаю в Пятёрочке, мысль о сайте никогда даже в голову не приходила

Ответить
Развернуть ветку
Максим Шпилёв

А карточку не регал?

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Михаил Муромов

Не регал. Мне её жена периодически выдаёт, я и не знал, что карточку регать надо на сайте

Ответить
Развернуть ветку
iweble

Какие-то неизвестные и непонятные ребята дают икспертные оценки большим сайтам. Норм чо. Пойду Твиттеру оценки поставлю. Ждите новостей

Ответить
Развернуть ветку
indievision

Стрнно, что за стеб. Так то ребята — крутые. http://redcollar.ru/about/ Вряд ли у тебя больше наград )

з.ы. Просто так совпало что слежу за студией уже давно, у них что ни сайт, огонь просто.

Ответить
Развернуть ветку
Олег Слемнев

Согласен, работы у них отличные. Просто проблема в том, что многие не знают никаких дизайн студий, кроме лебедевской.

Ответить
Развернуть ветку
Rogozhkin

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

Ответить
Развернуть ветку
indievision

))) Ух, ну теперь буду знать что такое настоящий веб... Расскажите еще это тем профессионалам в разных областях, что ставили оценки на FWA и awwwards. И чините скролл, конечно.

Ребята из студии, если вы читаете, оживите как-нибудь сайт https://www.awwwards.com/sites/glavnoe-detali а то видимо заказчик перестал существовать. А сайт был просто бомбическим =)

Ответить
Развернуть ветку
Rogozhkin

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

Ответить
Развернуть ветку
indievision

Вы серьезно? Неужели не понятно что тут разные цели. Студия больше специализируется на сайтах которые выделяют компании среди множества похожих. Магазину дверей, не нужен онлайн магазин (никто не покупает двери онлайн) ему нужно показать и рассказать о себе так, чтобы среди 20 сайтов что смотрит клиент, он запомнил именно один. И у студии это получается, имхо. Эта статья о том же. Очень многие не понимают — зачем и в какой ситуации нужен тот, или иной сайт. И ваши комментарии это подтверждают.

Есть много студий которые делают «добротные», как вы выражаетесь, сайты. И они тоже получают награды. Бюро, например, или nimax, sibirix, greensight.

Что касается скролла и тормозов, у вас какие то проблемы. На моем офисном пк, собранным 7 лет назад — ноль тормозов и скролл работает везде. Чините скролл и тормоза =)

Ответить
Развернуть ветку
Максим Шпилёв

Если не они, то кто?)

Ответить
Развернуть ветку
Андрей Савастюк

Компании небольшие, экономят как могут. На сэкономленные деньги от разработки сайтов, наверняка сделали больше скидки на пельмени)

Ответить
Развернуть ветку
Ilya Shubenok
Впечатление, что сайты им не нужны

Ну, в целом так и есть.

Ответить
Развернуть ветку
Виталик Виршин

с нетерпением жду ваших обзоров на такие важные сайты как: мосводоканал и росгаз

Ответить
Развернуть ветку
Кирилл Трубецкой

Что-то пробовал прогуляться Tab-ом по сайту студии. Вот хоть убей, но до меню так и не достучался. Видимо ребятки на столько хороши, что денег на мышки не хватает.
Браузер Chrome как-то намекнул, что сайт не защищенный))) видимо у ребяток нет денег купить SSL сертификат или они настолько дерзкие. Сбор данных не производят и клиентов не предупреждают.
Блин, крутые ребята. Правда написанное выше полный бред и реклама.

Ответить
Развернуть ветку
Даня Ходкевич

Да на кой им эти сайты вообще, их наверное только чтобы киберсквоттеры не баловались сделали))

Ответить
Развернуть ветку
Артём А.

Нашли, чем заняться. Очент порадовало что пол статьи про tab, которым ЦА этих сайтов просто не пользуется.
Юзеркейсы тоже смешные. Если кому то и надо искать магазин, его будут искатт или на картах или "в яндексе/гугле"
Такие сайты делают "что б было", не более. Ибо без сайта крупной компании сегодня "нельзя".
Если у кого сайт и будет выполнять какую полезную функцию, то только у какого нибудь перекрестка, у которого есть доставка.
Диджитал агентство исследует закоулки пятерочки:) это как если бы автоблогеры делали обзор на китайские мопеды:) вееесьма сомнительный пиар) особенно для вс и особенно с такой содержательностью)

Ответить
Развернуть ветку
Артём Костельнюк

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

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Артём Костельнюк

Вы наверное удивитесь, но так и нужно делать. И делают. Но, к сожалению, в нашей стране этому нечасто уделяют внимание.

https://habr.com/company/linka/blog/346238/

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Артём Костельнюк

Это то же самое, что сказать "А кто сказал, что нужны инвалидные коляски? А кто сказал, что нужны пандусы?". Из той же оперы. Не вижу смысла продолжать, если это для вас не очевидно.

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Артём Костельнюк

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

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Артём Костельнюк

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

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

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

Ответить
Развернуть ветку
Артём А.

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

Ответить
Развернуть ветку
Павел

Коллеги, привет.

1. У вас есть статистика как часто пользуются навигацией с клавиатуры? А то слишком много упоминания про TAB...
2. Это писал штатный специалист?
3. Плотно работаем с кадровыми агентствами. Соискатели приходят в крупные сети в основном через следующие каналы:
– сети покупают кадры у кадровых агентств
– в магазинах через анкеты/телефоны
– покупают лиды и пользуются контекстом (трафик ведётся на посадочную страницу)
Зачем такой акцент на вакансиях?
4. «Две основные проблемы: ни у одного сайта нет отличительной от конкурентов черты, чего-то, что выделяло бы сайт в глазах пользователя.»
Например (кроме баннеров)?

Ответить
Развернуть ветку
Леван Какубава

5. Кто их ЦА? Кроме b2b сегмента

Ответить
Развернуть ветку
Леван Какубава

Ребят, а кто-нибудь покупает fmcg товары онлайн и почему? Что нужно предложить такого, чтоб товар, который нужен "здесь и сейчас", заказали на сайте?
Низкая цена и/или дефицит товара в офлайне?

Ответить
Развернуть ветку
Nikolay Lebedev

Когда у Утконоса была более широкая карта доставка – пользовался, оч.удобно. Всю бакалею покупал там.
мотивация: Не надо тащить все на себе, тебе привозят к порогу дома.

Недавно в Озоне (!) покупал 30 пачек молока пармалат. Курьер прифигел и сказал "Ну вот мы уже и молоко доставляем" ))).
мотивация: в Озоне было дешевле и мне нужен был именно пармалат 3.5% которого в наших сетевых магазинах небольшого подмосковного городка просто не было.

в итоге получаем: удобство доставки, цена, дефицит

Ответить
Развернуть ветку
Павел

Вопрос не по теме... Почему Пармалат?

Ответить
Развернуть ветку
Nikolay Lebedev

вкусное + лучшее молоко которое взбивается для капучино

Ответить
Развернуть ветку
Nice Man

Сарафаново 2,5 попробуйте. Не 3,5, а именно 2,5, если получится. Это Перекрёсток и Пятерочка в основном)))

Ответить
Развернуть ветку
Георгий

Лухари же

Ответить
Развернуть ветку
Георгий

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

Ответить
Развернуть ветку
Yuriy Sapozhnikov

в смысле, "терять на заказе"?

Ответить
Развернуть ветку
Георгий

Условия доставки сейчас примерно такие:
1. по цене полки - у всех и вся
2. бесплатная доставка - на первый заказ далее постоянные промокоды
3. минимальный чек либо его нет (акция, первый заказ, промокоды) либо 1к рублей.
Имея 10% дисконта с полки сервисы мне везут пожрать на тысячу рублей.
То есть они зарабатывают сотку, за сотку мне собирают заказ и привозят курьером. Добавляй туда рекламу в директе по 300р за клик с которой я пришел.
По желанию можно добавить всех сотрудников офиса.

А так как таких сервисов как грибов - поднимешь цены или условия хоть на 1% останешься без клиентов.

Ответить
Развернуть ветку
Nice Man

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

Одно дело, если бы они пару пивка за полчаса привозили. А так...

Ответить
Развернуть ветку
Aleks Melnik

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

Ответить
Развернуть ветку
Леван Какубава

Можно нескромный вопрос - на что рассчитывает заказчик? Скиньте ссылку, если не секрет, у меня тоже такая тема намечается, только там еще и без продовольствия будет ассортимент. Цены - средняя по больнице, чтото всех в веб прорвало в последнее время)

Ответить
Развернуть ветку
Aleks Melnik

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

Ответить
Развернуть ветку
Леван Какубава

хозтовары, дек. косметика (одна надежда на него) и быт.химия

Ответить
Развернуть ветку
Aleks Melnik

Интернет-магазин или просто отображение актуальных товаров и скидок будет?

Ответить
Развернуть ветку
Леван Какубава

Интернет-магазин

Ответить
Развернуть ветку
Вера Гагарина

Зачем ходить на их сайты и тем более их как-то оценивать? :)

Ответить
Развернуть ветку
Nice Man

Пиар агентства своего)

Ответить
Развернуть ветку
Alina Rakhimova

так ведь пятерочку aic рисовали http://www.aic.ru/work/site/675/
видимо что то пошло не так...

Ответить
Развернуть ветку
42 комментария
Раскрывать всегда