[КЕЙС] Редизайн и оптимизация скорости загрузки интернет-магазина спортивных товаров

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

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

Сроки реализации проекта: [Редизайн и оптимизация загрузки Amunicia] — 2 недели.

С проектом amunicia.com.ua мы сотрудничаем уже более двух лет. Начав с внутренней оптимизации сайта на OpenCart и его продвижения в поисковых системах. Как это было и чего мы добились за первый год работы над сайтом, читайте в нашем кейсе.

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

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

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

Редизайн: переход на адаптивную версию

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

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

Каталог и трехуровневое меню

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

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

Фильтрация

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

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

К примеру, Григорий решил купить себе красные кожаные боксерские перчатки. Григорий вводит в Google “купить красные боксерские кожаные перчатки”, раньше он бы нашел на нашем сайте страницу, посвященную только боксерским перчаткам в общем, без фильтров и дополнительных параметров, а сегодня Григорий переходит на посадочную конкретного поискового запроса. Все просто: Григорий доволен, ведь на ринге он будет в новых взлелеянных в мечтах перчатках, и мы получили нового счастливого покупателя, ведь на 100% удовлетворили его поисковый запрос.

Данные по загрузке страницы

Согласно PageSpeed Insight мы получили быструю загрузку сайта. Наши показатели такие: для загрузки страницы требуется 1,5 Мб. Если сравнивать данный показатель с аналогичными ресурсами, то их показатели составляют 2,7 Мб. Чем меньше количество операций и данных, тем быстрее загружается страница.

Что мы сделали для увеличения скорости загрузки сайта

• Оптимизация контента: сжали изображения, задали одинаковый формат контент всего сайта. Благодаря этому сайт прогружается быстрее;
• Оптимизация CSS кода — благодаря этому мы существенно увеличили скорость отображения первого экрана;
• Провели минификацию (перед выдачей лучше минифицировать код HTML, CSS и JavaScript);
• Оптимизировали веб-шрифты. Мы воплотили это посредством инвентаризации, а именно, удаления ненужных шрифтов, которые замедляют работу сайта;
• Ввели кэширующие заголовки (HTTP заголовки). В интернете всегда используется “http headers” — для нашего проекта мы изменили отправку данных на сервер, и это повлияло на скорость загрузки;
• Использовали CDN для ускорение рекламных объявлений. Благодаря этому скрипту контент загружается значительно быстрее, что благоприятно влияет на конверсию;
• Кэширование данных (уместно для быстрой работы сайта, ведь файлы сайта некоторое время хранятся в памяти, особенно актуально для частых посетителей сайта);
• Уменьшили время ответа сервера до 0,11 секунд, а среднее время загрузки страницы до 2,95 секунд.

Итоги проекта

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