Доопрацювання та оптимізація інтернет-магазину продукції для бджільництва «ПаркПлюс»

Мета – оновлення та актуалізація сайту, забезпечення безпроблемного обміну даними, усунення явищ, що знижують продаж та лояльність клієнтів.

Перший етап доопрацювань інтернет магазину

Адміністрація компанії «ПаркПлюс» звернулися до веб-агенції «Червоний хамелеон», що має великий досвід створення інтернет-магазинів на Бітрікс та їх доопрацювання, спочатку для вирішення низки спільних завдань:

• виправити помилки інтеграції з 1С;
• інтегрувати та налаштувати шаблон Аспро Некст на сайт на 1С: Бітрікс;
• підібрати хостинг.

Для розуміння поточного стану сайту було замовлено низку аудитів (SEO, UX-дизайн, PPC), результати яких були представлені відповідними технічними завданнями від фахівців. Розробникам і верстальникам «Червоного хамелеона» належало впровадити численні виправлення з них.

На сайті також виявлено помилки, які потрібно було виправити.

Основні завдання з доопрацювання

• Налаштувати інтеграцію із 1С.
• Застосувати новий шаблон.
• Виконати первинну внутрішню оптимізацію.
• Виправити деталі, що впливають на комерційні фактори.
• Налаштувати інтеграції з рекламними системами та торговими майданчиками.
• Виправити помилки.
• Налаштувати оповіщення про замовлення у Телеграм.
• Забезпечити передачу даних у розширену аналітику електронної комерції.

Усього потрібно було вирішити понад 230 завдань на сайті, що зайняло понад 250 робочих годин.

Складнощі при доопрацюванні сайту

3 з 5

Особливість проєкту в тому, що завдання здебільшого невисокого рівня складності, але їх було справді багато.

Які роботи входили у доопрацювання сайту

Хостинг

Як майданчик для розгортання сайту була обрана «Туча». Розробники «Червоного хамелеону» перенесли та налаштували ресурс на новому хостингу.

Шаблон

На сайт було встановлено новий шаблон - "Аспро Некст".

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

1С

Виправлені помилки та налаштована коректна інтеграція з 1С для безперебійного двостороннього обміну даними.

Виконано автоматичне оновлення товарних позицій під час редагування їх властивостей у 1С.

Налагоджено коректну передачу параметрів при оформленні замовлення в 1 клік.

Вирішено проблему з перезаписом вже відвантажених замовлень новими у базі даних.

Первинна SEO-оптимізація сайту

Додали сайт у панелі вебмайстра пошукових систем Google та Яндекс.

Встановили код системи аналітики Яндекс Метрика через сервіс Google Tag Manager.

Усунули дублі внутрішніх сторінок сайту, які виникали через додавання наприкінці адреси:

/index.html	налаштуванням 301 редиректа
// (подвійного слєша)	налаштуванням 301 редиректа
Регістр (символами різного регістру)	налаштуванням 301 редиректа
/?id=XXX (GET-запитів)	через robots.txt

Переписали текст файлу robots.txt з урахуванням рекомендацій SEO-оптимізатора та пошукової системи. Оновлені правила закрили від індексації:

• адмін-панель сайту;
• директорії, які не мають прямого відношення до сайту;
• URL із запитами параметром GET та ін.

Оптимізатори виявили понад 750 дубльованих мета-тегів для різних сторінок title, descriptions, keywords та h1. Ми видалили автогенерацію keywords. Інші проблеми вирішили установкою та налаштуванням модуля розумного СЕО-фільтра, здатного ставити унікальні мета-теги для кожного варіанта вибору параметрів.

Налаштовано оновлення картки сайту Sitemap.xml. Видалені всі внутрішні посилання з кодом 3xx (редиректи/перенаправлення) та 4хх (сторінки не існує) або замінені на посилання з кодом 200.

В URL карток товарів додано категорію.

Налаштовано відображення інформативної та оптимізованої сторінки помилки 404. Вона не виводилася коректно через код зі старої версії сайту.

На сторінках пагінації, а також фільтрів (понад два параметри) настроєно генерацію тегів, що забороняють індексацію <meta name="robots" content="noindex,follow"/>.

Для запобігання дублювання сторінок при сортуванні товарів у списку встановлено тег rel=«canonical» основної сторінки.

Для вирішення проблеми низької швидкості роботи сайту:

• стиснули зображення на сторінках ресурсу за рекомендацією Google;
• впровадили функцію Lazy Loading для картинок;
• задіяли системні функції підвищення швидкості завантаження;
• встановили модуль Ammina Optimizer.

Домоглися підвищення оцінок з 43 для мобайла і 83 для робочого столу до 64 і 96, відповідно, по сервісу Page Speed.

Впроваджено оптимізовані шаблони генерації мета-тегів title, descriptions, h1, запропоновані Luxeo.

На сторінках та блоках провели оптимізацію заголовків h2-h6. Видалили зайві підзаголовки, замінивши їх на інші елементи розмітки.

Усунули зайві виділення контенту тегами <b>, щоб не потрапити під санкції переоптимізації пошукових систем.

На сторінках сайту впровадили генерацію природного входження комерційних слів:

• купити
• ціна
• Київ
• вартість
• Україна
• покупка
• продаж.

Доповнили необхідною інформацією мікророзмітку Schema.org на сторінках контактів, карток товарів, підрозділів.

Замість стандартної шапки сайту згорнули фіксовану, яка видно при скролінгу сторінки. Елемент містить меню та координати для зворотного зв'язку.

Додано функціонал моментального замовлення зворотного дзвінка.

Створено та протестовано українську версію сайту.

Аналітика

Встановлено код Пікселя Facebook. Налаштовані події для відстеження додавання товарів у кошик, оплати, взаємодії з клієнтами тощо.

Після додавання нового функціоналу клієнтом та зміни шаблонів виведення деяких сторінок було видалено код вставки Google Analytics та Пікселя Facebook. Наші програмісти відновили скрипти. У кошику для коректної роботи коду було повністю переписано функціонал обліку видалення товарів.

Впроваджено розширену Google Analytics електронну торгівлю за технічним завданням від Netpeak. Модуль допомагає передавати для аналізу максимум інформації про досконалі конверсії, проміжні дії, рекламну ефективність, відстежувати кожен етап продажів. На сайт додані можливості відстежувати:

• перегляди товарів у каталозі;
• кліки по товарах;
• перегляди карток товарів;
• додавання товару до кошика;
• видалення товару із кошика;
• кроки оформлення замовлення;
• варіанти оформлення замовлення;
• досконалі покупки.

Дизайн

Переналаштовані сторінки картки товару, кошика, оформлення замовлення.

Для мобільної версії сайту:

• створено скрипт, що визначає пристрій, з якого зайшов на сторінку користувач, щоб перенаправляти на мобільний шаблон;
• переверстана розстановка блоків "Хіт", "Новинка", "Акції" по два в ряд;
• перебудовано розміщення елементів на різних сторінках сайту;
• змінено дизайн картки товару, сторінок оформлення замовлення та оплати;
• налаштовано виведення сортування в розділах каталогу: доданий текст «За популярністю», «За ціною», «Фільтр», показ стрілочки в залежності від напрямку сортування.

Після UX-аналізу сайту спеціалістами компанії Luxeo внесли численні зміни до десктопної та мобільної версії інтернет-магазину.

Десктоп:

• зробили помітну кнопку зворотного дзвінка;
• замінили кнопку "Докладніше" на "Купити" при наведенні на товар у списку;
• переоформлено блок виведення корисних статей, оглядів та порад;
• виправлено відображення блоку «Раніше ви дивилися»;
• додані елементи до слайдера;
• виправлено функціонал додавання відгуків на сайт для підвищення довіри до проєкту;
• скориговані посилання телефонних номерів на сторінці "Контакти";
• додано основні характеристики на картки товарів при відображенні списком.

Мобайл:

• виправлено порядок виведення інформації на сторінці "Контакти" (на першому екрані клієнту показувалася карта);
• виправили відображення контактів філій компанії на картці Google;
• додали посилання для контактних даних;
• виправили відображення оцінки (рейтингу) у картці товару;
• блок із ціною та кнопкою «Купити» встановлений над короткими характеристиками позиції;
• виправлено відображення способу оплати після оформлення замовлення.

Функціонал

Налаштовано функцію зміни статусу замовлення після оплати. Проблема виникала через некоректне налаштування зв'язку 1С: Бітрікс із системою оплати LiqPay.

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

Організований та налаштований функціонал надсилання повідомлень про замовлення в Телеграм та оповіщень у Вайбер.

Налаштовано надсилання пошти через модуль Надсилання електронної пошти через SMTP.

Організовано оцінку геолокації для коректного виведення міста, в якому знаходиться покупець.

Додано та налаштовано модуль компанії «Інтайм», а також організовано підвантаження відділень Укрпошти на сайт для оформлення доставки.

Помилки

Виправлено виявлений баг із безкоштовною доставкою.

Усунуті проблеми функціонування модуля Нової пошти: помилка надсилання СМС при доставці, неможливість вибрати конкретний склад при оформленні замовлення.

Виправлено проблему відсутності кнопки «Купити» та вибору потрібної кількості товару для деяких позицій.

Виправлено помилки автоматичного створення резервної копії сайту та бази даних.

При обміні 1С із сайтом виникала помилка «CREATE INDEX». Аналіз показав, що проблема, найімовірніше, пов'язана з «перетином» обмінів, оскільки один процес блокує таблиці бази даних, тому інший неспроможний отримати до них доступ. Щоб не з'являлася помилка, рекомендовано:

• Не запускати обмін вручну під час автоматичного обміну.
• Підвищити ліміт часу автоматичного обміну.

Вирішено проблему виведення активного списку розмірів у картці товару. Перенастроєно компонент і вказано коректне поле для заповнення даних при обміні з 1С.

Не працювало посилання на зміну пароля, яке надсилається у листі на пошту. Після переходу з неї з'являлося повідомлення, що користувача не існує.

У ході дослідження виявили, що причина у редиректах на стороні модуля rodzeta.redirect: під час переходу скидалися параметри url. Внесли редагування для коректної роботи компонента.

Виправлено помилку надсилання СМС при зміні статусу замовлення в адмінці. У текст повідомлення були додані лапки для коректної обробки коду.

Усунено проблему некоректного пошуку. При деяких запитах результати не відображалися. Для вирішення вимкнули USE_LANGUAGE_GUESS.

Усунуто проблему дублювання відгуків на сторінках товарів.

Фіди

Налагоджено інтеграцію з сервісом Google Merchant Center, виправлено помилки передачі даних та сканування контенту.

Створені та налаштовані фіди товарів, що автоматично формуються та регулярно оновлюються, з усіма необхідними параметрами для представлення товарних оголошень з категорії «Бджільництво» в Google AdWords.

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

PCC

За техзаданням від Netpeak впровадили код динамічного ремаркетингу у шаблон сторінок сайту:

• головна;
• пошук;
• кошик;
• карточка товару;
• каталог;
• оформлення замовлення.

Код передає структуровані дані (JSON) на формування ретаргетингового оголошення – з товарами, якими цікавився користувач, але не оформив покупку.

Результат робіт з доопрацювання та оптимізації сайту

Усі роботи за проєктом зайняли близько 9 місяців.

Нам вдалося:

• перенести робочий проєкт на новий хостинг;
• встановити обраний клієнтом шаблон, оновити та налаштувати його так, щоб у роботі сайту не було помилок;
• домогтися істотного підвищення швидкості роботи сайту – на 15,5% на робочому столі та пости на 50% на мобайлі;
• інтегрувати та забезпечити коректну передачу даних з 1С;
• виправити помилки ресурсу;
• організувати відстеження місця розташування користувача, надсилання СМС, e-mail, а також повідомлень у Viber та Telegram;
• скласти коректні фіди для передачі відомостей про товари в GoogleAds і Розетку;
• налаштувати оформлення інформації для ретаргетингу;
• додати події для розширеної аналітики.

Зараз сайт працює на останній версії купленого шаблону. Всі внесені редагування дали потрібний результат: сторінки швидко вантажаться, мінімізована кількість помилок.

https://parkplus.com.ua/ – об'ємний проект, який потребував великого залучення команди «Червоного хамелеону». Однак, незважаючи на кількість поставлених завдань, усі вони були вирішені, і замовлення доведене до логічного завершення.