1 секунда прискорення завантаження дала приріст конверсії на 10%: кейс Staples

Компанія Staples – одна з найбільших у світі мереж магазинів канцелярських товарів, налічує більше 2000 магазинів в 26 країнах світу. Компанія веде бізнес також і в онлайні, її інтернет-магазин є одним з найбільших за оборотами в США.

У компанії завжди визнавали, що UX сайту надзвичайно важливий, і що швидкість завантаження сайту є одним з основних факторів, що впливають на UX.

До того моменту, коли компанія Staples вирішила приділити більше уваги прискорення власного сайту, вже були відомі дані, що зі збільшенням швидкості завантаження сайту відсоток відмов (bounce rate) зростає (за даними mPulse/Soasta та Айрі.рф):

а конверсія падає:

Для роботи над швидкістю сайту компанія створила крос-функціональну команду, що складається з представників кількох підрозділів:
  • Менеджмент: його представники визначають, яка функціональність з точки зору користувача повинна бути на сайті.
  • ІТ: визначає способи, якими буде реалізована необхідна функціональність і її подальше впровадження.
  • Маркетинг: відповідає за дизайн і оптимізацію використовуваних зображень і відео.
  • Мерчендайзинг: визначає те, як продукт буде візуально представлено на сайті.
  • Аналітика: пов'язує всі разом і надає аналіз даних.
Робота почалася з того, що були каталогізовані всі різні функціональності, які підтримуються на сайті.

У компанії був встановлений регламент: щотижня команда збиралася і обговорювала 1-2 функціональності сайту. Доповідачем виступав так званий «власник» цієї функціональності, тобто той чоловік з компанії, бізнес-завдання якого вона працює. Команда обговорювала ці функціональності з точки зору прискорення завантаження і виправданості відмови від неї або якогось її аспекту заради прискорення завантаження сайту.

Хід робіт
Одним з важливих рішень, які потрібно прийняти, стало: чи вважати цільовим KPI повне час завантаження (FPL – Full Page Load) чи потрібно зосередитися на поліпшенні часу до можливості користувача взаємодіяти зі сторінкою (Time To Interactive). Команда в підсумку вирішила зосередитися на повному часу завантаження, оскільки це більш конкретний показник. У той час як показник «час до можливості взаємодії з сайтом» кілька туманний і допускає різні тлумачення в сенсі того, які можливості мають бути доступні користувачеві в цей момент.

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


Дуже схожі візуально зображення, різні версії одного і того самого баннера могли «важити» в одному випадку 25 КБ, а в іншому – 250 КБ.

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

А/В-тестування
Практика проведення А/В-тестування в компанії була неефективною. У компанії використовувалися два різних засоби А/В-тестування, кожне з яких додавало свій скрипт на сайт з зовнішніми викликами.

Команда відмовилася від одного з засобів А/В-тестування, а також запровадила процес закінчення експерименту, щоб переконатися, що зі сторінок, де тестування закінчилося, забирається більше не потрібний скрипт тестування.

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

Команда видалила частину з них, але зазначає, що в цьому відношенні ще можлива подальша оптимізація.



Звернення до баз даних
Деякі сторінки сайту виробляли 200 звернень до бази даних. Команда оптимізувала їх до 10 на сторінку.

Javascript
Код скриптів на сайті був суттєво переписано, їх розмір в обсязі скоротився на 48%, а в рядках коду – на 52%.

CSS
Стилі на сайті також піддалися оптимізації, в обсязі вони були скорочені на 83%, а в рядках – на 88%.

Витягнуті уроки
1. Фіксуватися на значущі зміни
Спочатку команда намагалася працювати за моделлю «спринту» і з кожним новим релізом версії сайту вносити якісь поліпшення. Однак виявилося, що такі незначні поліпшення були практично непомітні. Складалося відчуття, що робота ведеться, а результату немає або майже немає.

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

2. Звертати увагу на конкретні сторінки
Досить швидко команда зрозуміла, що для того, щоб домогтися істотних результатів, потрібно сфокусуватися на конкретних сторінках, які відвідуються більшістю користувачів – головна, картка продукту, пошук, логін, кошик.

Результати
  • Медіана часу завантаження головної сторінки сайту зменшилася на 1 секунду
  • Час завантаження скоротилася для 98% користувачів. У найбільш «повільних» користувачів, воно скоротилося на 6 секунд.
  • Конверсія зросла на 10%
Примітка по трактуванні результатів від експертів з Soasta, авторів використовувався в оптимізації засоби стеження за поведінкою користувачів mPulse:

Дані результати НЕ означають, що ВСІ користувачі стали завантажувати головну сторінку на 1 секунду швидше.

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

Це також НЕ означає, що ВСІ користувачі стали конвертуватися на 10% краще.

Ті користувачі, для яких сторінки дійсно швидше завантажувалися, дала в результаті таку гарну конверсію, що в середньому по всім користувачам вона покращилася на 10%.

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

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

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.