Главное Авторские колонки Вакансии Вопросы
73 0 В избр. Сохранено
Авторизуйтесь
Вход с паролем

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

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

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

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

О проекте

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

Регион: Москва, Россия
Период работ: с января 2024 года

Перенос сайта на более производительный хостинг

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

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

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

Айрат Рахимзянов, руководитель SEO-агентства Релианта

Результаты проверки производительности до переноса:

После смены хостинга показатели значительно улучшились:

SEO-текст под пагинацией

Для категорий был реализован вывод SEO-текста после блока пагинации. Такой подход позволяет разместить описание раздела и ключевые запросы без ущерба для удобства навигации пользователей.

Это решение помогает повысить релевантность страниц для поисковых систем, сохранив привычный сценарий просмотра каталога.

Оптимизация структуры заголовков H2 и H3

На главной странице, в разделах каталога и карточках товаров были устранены лишние заголовки H2 и H3. Это позволило привести структуру страниц в соответствие с рекомендациями поисковых систем, не меняя внешний вид сайта.

Дополнительно был разработан механизм автоматического определения корректных HTML-тегов. Это позволило сохранить привычный процесс работы редакторов в административной панели Битрикс.

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

Так описание выглядит в административной панели:

Обновление шаблона хлебных крошек

Навигационная цепочка была переработана в соответствии с актуальными требованиями Schema.org. Благодаря этому структура сайта стала более понятной для поисковых роботов, что положительно влияет на качество индексации.

Обновление дизайна и функциональности страниц

1. Страница «Вопрос-ответ»

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

2. Страница «Сертификаты»

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

3. Обновление страницы «Гарантия и возврат»

Страница была переработана для более удобного восприятия информации о гарантийных обязательствах и условиях возврата.

(Опечатка в слове «Гарантия» на макете была исправлена позже.)

4. Редизайн страницы «О компании»



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

5. Страница «Избранное»


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

6. Обновленная карточка товара

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

До:

После:

В карточке были реализованы следующие изменения:

  1. отображение артикула товара;
  2. рейтинг рядом с отзывами;
  3. возможность поделиться товаром в социальных сетях;
  4. кнопка «Купить в 1 клик»;
  5. блок преимуществ, который раньше представлял собой изображение, был сверстан как полноценный HTML-элемент.

7. Обновление меню каталога

Для десктопной версии сайта было полностью переработано меню каталога.

До:

После:

8. Новый футер

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

До:

После:

9. Полный редизайн оформления заказа

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

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

После обновления пользователи получили новый интерфейс:

  1. полноценное управление товарами в корзине;
  2. отдельный блок с итоговой стоимостью, который постоянно остается в поле зрения.



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

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

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


10. Обновление шапки сайта

Шапка сайта стала компактнее и удобнее. Благодаря переработанной структуре пользователям проще получить доступ к навигации и ключевой информации.

До:

После:

11. Новая система поиска

Поиск по сайту был полностью переработан.

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

До:

После:

12. Обновление модальных окон

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

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

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

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

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

0
В избр. Сохранено
Авторизуйтесь
Вход с паролем