Як підняти і збільшити продажі інтернет-магазину за допомогою адаптивної верстки - Netpeak Blog

1. Як впроваджувалася адаптивна верстка
2. Як тестувався адаптивний дизайн?
3. результати
4. висновки

Ми вже писали про перевагах адаптивної верстки сайту. Але чи окупляться час і гроші, витрачені на адаптивну верстку сайту інтернет-магазину? Відповідь на це питання - в гостьовому кейсі аналітика Івана Гусяк з Lemarbet .

Послуга: адаптивна верстка сайту інтернет-магазину. Тематика: продаж запчастин для мобільних телефонів і планшетів.

Як впроваджувалася адаптивна верстка

Клієнт - інтернет-магазин, який займається продажем запчастин для мобільних телефонів і планшетів. На створення адаптивної верстки сайту знадобилося сім днів роботи: 3 дні на дизайн різних версій і 4 - на верстку і тест коректності відображення. Адаптивна версія була реалізована для всіх екранів з розширенням більше 320 пікселів, тобто майже для всіх існуючих мобільних пристроїв.

Як тестувався адаптивний дизайн?

1. За допомогою вбудованого інструменту Google device mode в браузері Google Chrome.
2. За допомогою інструменту « Режим адаптивного дизайну »В браузері Mozilla Firefox.

Звичайно, верстку перевірили і на всіх мобільних пристроях співробітників відділу розробки.

результати

Адаптивний дизайн був запущений 15 серпня 2015 року. Уже через тиждень після запуску почала зростати якість і кількість транзакцій з мобільних пристроїв. На скріншоті - статистика трафіку і транзакцій з мобільних пристроїв. Період порівняння - 1,5 місяці до запуску і 1,5 місяця після запуску адаптивного дизайну.

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

Видно, що кількість мобільного трафіку зросла на 30%. Але показники електронної торгівлі зросли набагато більше: коефіцієнт конверсії зріс на 42%, кількість транзакцій - на 86%, а дохід - на 116%. Також порівняли дані сайту за півроку до реалізації адаптивної верстки і через півроку після її впровадження. Мобільний трафік виріс на 116%, а мобільні транзакції - на 170%. Також можна зробити висновок, що адаптивна верстка трохи вплинула на зростання органічного трафіку. Це видно, якщо порівняти нахили лінійної екстраполяції кривої трафіку до запуску адаптивного дизайну і лінійної інтерполяції кривої трафіку, отриманого після реалізації адаптивної верстки. Можливо, на цей результат вплинув алгоритм Mobile Friendly від Google, запущений 21 квітня 2015 року. На наступному скріншоті видно зростання доходу від електронної торгівлі. Вже за півтора місяці після впровадження адаптивної верстки зростання доходу склав 119%. При цьому не можна списати зростання трафіку у вересні на сезонність. Про це свідчить графік обсягів пошукових запитів по місяцях Цікаво також порівняти поділ трафіку і конверсій з різних гаджетів: планшетів, мобільних телефонів, настільних ПК. Найбільше зростання коефіцієнта транзакцій доводиться на мобільні, на другому місці - планшети, замикають трійку десктопні пристрою. В принципі, це логічно: на планшетах сайтом було досить зручно користуватися і до реалізації адаптивної верстки. Цікавий інше питання: чи не пов'язаний невелике зростання показників електронної торгівлі на настільних ПК з запуском адаптивної верстки? А може бути пов'язаний. Як? Через асоційовані конверсії. Тобто потенційний клієнт приходить на сайт з пошуку зі свого смартфона, дивиться сайт, і, якщо йому подобається, він надалі сідає за ПК і продовжує пошук (наприклад, «мікросхема для iPhone»). На жаль, для сайту не була підключена функція User ID , Щоб отримати актуальну інформацію про комплексну взаємодію користувача з сайтом. Але для більшості відвідувачів даного інтернет-магазину смартфон або планшет - більшою мірою інструмент для пошуку інформації, а конкретну транзакцію вони роблять за допомогою настільних ПК. Про це говорить наступна статистика. У перші 3-4 дні до асоційованої конверсії велику роль відіграє відвідуваність через мобільні пристрої, адаптивність яких сподобалася потенційним клієнтам і змусила їх повернутися і зробити покупку. Також цікаво перевірити, як адаптивна верстка вплинула на кількість транзакцій, здійснених новими і повернулися користувачами. В обох випадках після запуску адаптивного дизайну істотно виріс коефіцієнт транзакцій, хоча все-таки у випадку з новими відвідинами цей показник вище. При цьому абсолютні значення коефіцієнтів транзакцій для цих груп користувачів цілком логічні: 1,4% для нових користувачів і 3% для повернулися. Тепер трохи відійдемо від конверсій і поглянемо на поведінку користувачів, які заходили на сайт з мобільних пристроїв. Головні параметри - показник відмов, кількість сторінок за сеанс і середня тривалість сеансу практично не змінилися. Як же так? Чому сайт став зручніше, але поведінкові фактори залишилися колишніми? Якщо добре вдуматися і проаналізувати дії користувачів, можна зробити деякі висновки:

1. Середня тривалість сеансу. Після запуску адаптивної верстки користувачам вже не доводиться робити зум сторінки пальцями, що зменшує час взаємодії з сайтом. Але в нашому випадку середня тривалість сеансу не зменшилася, а практично не змінилася. Справа в тому, що деяка частина аудиторії, з огляду на зручність сайту, дійсно витрачає менше часу на орієнтацію, зум і навігацію. А друга частина аудиторії, навпаки, залишається на сторінці довше, щоб обробити представлену інформацію. Тому середня тривалість сеансу тут і виходить майже незмінною.
2. Показник «сторінок / сеанс» розраховується аналогічно. З одного боку, чим зручніше сайт, тим менше сторінок потрібно перегортати, а з іншого - чим більше глибина перегляду, тим більше відвідувачеві сподобався сайт. Тому середнє значення майже не змінилося.
3. Нарешті, «показник відмов». Відвідувачі після першого ж кліка розуміють, куди вони потрапили (наприклад, на картку товару з потрібною їм запчастиною) і отримують всю необхідну інформацію. Частина аудиторії відразу залишає сайт, а частина, з огляду на зручність перегляду, продовжує переходити на інші сторінки. Тому значення показника практично не змінилося.

Останній цікавий показник - асоційовані конверсії. На скріншоті нижче представлена статистика асоційованих транзакцій до і після запуску адаптивної верстки. Для простоти і чистоти аналізу взято тільки канал безкоштовного трафіку з поділом на мобільні пристрої та настільні ПК. Показники асоційованих конверсій на мобільних пристроях в 2-3 рази випереджають настільні ПК. Причому зростання спостерігається для всіх існуючих показників: як для конверсій за останнім кліку, так і для прямих взаємодій.

висновки

1. Якщо ви витрачаєте гроші на розкрутку і рекламу сайту - обов'язково виділіть гроші на адаптивну верстку. Витрачати гроші на розкрутку і рекламу сайту без адаптивного дизайну (з огляду на швидке зростання «мобільних» користувачів, які вже зараз складають від 20% до 40% інтернет-аудиторії в залежності від тематики) практично безглуздо. Це як в офлайновом бізнесі рекламувати магазин і не відреставрувати слизькі сходинки, не зробити пандуси для візків і колясок, не забезпечити зручний прохід між стелажами і нормальний мерчандайзинг товарів. Тобто адаптивний дизайн - підвищення рентабельності інвестицій.
2. Якщо сайт ніяк не просувається, але і так має хороший трафік і продажу (наш випадок), постарайтеся виділити гроші на адаптивну верстку. У нашому кейсі вже за 1,5 місяці з адаптивним дизайном кількість продажів з мобільних пристроїв зросла на 86%, а дохід - на 119%.
3. Якщо сайт ніяк не просувається і ніхто його не відвідує - ні в якому разі не робіть адаптивну верстку. Краще прибережіть гроші на оплату домену та хостингу :)

Думка авторів гостьового поста може не збігатися з позицією редакції і фахівців агентства Netpeak.

Георгій Рябий

Шеф-редактор блогу Netpeak.
В особистому архіві з 2004 року - публікації в газетах і журналах, вичитка книг, кілька збірок, копірайтерського галери новинних сайтів, посади редактора стрічки і адміністратора форуму, букет спецпроектів.