+7 (495) 105-99-69
Москва, ул. Ленинская Слобода,
д. 19, стр. 1, БЦ Омега Плаза

metrotile.ru

Задача: Провести редизайн корпоративного сайта и создать интернет-магазин

История началась с того, что к нам вернулся «старый клиент» — компания Metrotile, дилер бельгийской черепицы, которому мы разработали сайт в 2014 году. Это был корпоративный сайт для партнеров и оптовых заказчиков, созданный по принципу «смотреть, но не трогать» — узнать о товаре можно, но купить нельзя.

metrotile.ru

Теперь компания «созрела» до онлайн-продаж, в том числе, конечным потребителям. Была только одна загвоздка — в интернете уже полно сайтов, на которых можно в пару кликов заказать черепицу. Нужно было как-то отстроиться от конкурентов.

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

Яркие, неоновые, сочные, в таком высококачественном макро, что сходу даже не верится, что это фотографии, а не картинки, и что на снимках строительные материалы.

Это нужно было использовать, как именно — придумали позже.

Богатый внутренний мир

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

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

Мы начали с SEO-аудита сайта, чтобы определить технические и структурные ошибки, мешающие продвижению.

Конечно, кое-что подглядели у конкурентов из топ-10 поисковой выдачи и составили семантическое ядро из 135 запросов, по которым Metrotile.ru может подняться в поиске.

В итоге получилась готовая структура. А если конкретно:

  • Прописали основные категории и подкатегории, путь от главной страницы в каждый раздел и на карточку товара.
  • Выделили разделы, ссылки на которые должны располагаться в футере страницы, в главном и навигационном меню.
  • Обозначили требования к формированию меню и URL-адресов, оформлению страниц каталога.
  • Спроектировали необходимый функционал страниц. Многое штатный специалист уже реализовал, до идеала не хватало нескольких важных деталей, «Корзины», формы подписки на рассылки, строки поиска по каталогу, подробного фильтра товаров и кнопки «Купить» в листинге с возможностью выбрать количество позиций.
  • Добавили рекомендации по региональному продвижению сайта.
  • Указали требования к текстовой оптимизации и составили технические задания для подготовки текстов для продвигаемых страниц.
metrotile.ru

Обычно следующим этапом идет создание прототипа будущего сайта, но мы решили отказаться от этого шага — текущий сайт по сути и был прототипом, которого вместе с SEO-структурой было достаточно для того, чтобы приступить к следующему шагу.

Незаурядная внешность

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

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

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

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

metrotile.ru

Обычно на этом этапе отрисовывается 3-4 основных страницы: главная, категория и карточка товара и «Корзина». Но только для сайта ювелирной кровли мы отрисовали макеты 35 разных страниц.

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

Вычитка обычно проводится на последнем этапе — при выгрузке контента на сайт. Этот процесс еще называется «вторые 90% проекта».

Однако заказчику было важно увидеть идеальную картинку еще на этапе верстки.

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

Чтобы нам было чем заняться, пока заказчик вычитывает все 35 макетов страниц сайта, он попросил нас «перекрасить» фотографии разных видов черепицы так, чтобы не было ощущения, что они покрашены фломастером. Мы получили картинки продукции в одном цвете и тиражировали их в разной цветовой гамме. Всего «раскрасили» порядка 750 фотографий. Заодно проработали вопрос увеличения количества изображений с официального сайта заказчика в Яндекс.Картинках. По брендовым запросам в выдаче были чьи угодно фотографии, только не Metrotile, потому что картинки не были тэгированы в коде сайта. Мы внедрили «альты» и поисковик их постепенно индексирует.

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

Для сравнения вот главные страницы коммерческих сайтов, которые находятся в топе выдачи по запросу «композитная черепица».

Все же очевидно.

Категория разработки:
Интернет-магазин с индивидуальным дизайном
  • Сроки 4-6 месяцев
  • Цена от 1 200 000 рублей
Участники
Арт-директор:
  • Алексей Шевцов
Дизайнер:
  • Евгения Харитонова
  • Ольга Чухаленко
Технический директор:
  • Денис Коровкин
Тимлид:
  • Аля Жапаспаева
HTML-верстальщик:
  • Надежда Левенкова
Менеджер:
  • Надежда Колобкова
Дата выпуска: 09/01/2019
Срок 4-6 месяцев