Чи потрібно скорочувати контент і набір функцій при розробці і проектуванні мобільної версії сайту, або ж варто спробувати вмістити все?

Baymard Institute провели дослідження з юзабіліті при покупках через мобільні пристрої і виявили, що всі мобільні версії E-commerce сайтів використовують різний підхід. Виявилося, що деякі рішення можуть призвести до дуже плачевних результатів.

Нижче зібрана інформація, яка допоможе розібратися в непростому питанні: який контент і які функції повинні бути присутніми на звичайній і мобільного версіях E-commerce сайтів.

Контент не повинен відрізнятися

Перш за все, важливо чітко розуміти різницю між типом самого сайту (E-commerce або звичайний сайт), а також розбиратися в контенті і функціонал. Спостереження, представлені нижче, були зроблені в ході тестувань саме E - commerce сайтів, і призначене для користувача поведінка може сильно відрізнятися, якщо у вас новинний портал, блог, сайт-візитка або щось ще.

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

Зверніть увагу, що є відмінності між «всім контентом» і «всіма функціями» на вашому мобільному сайті. Дослідження показують, що контент повинен бути ідентичним, але функціонал може відрізнятися там, де це виправдано.

Каталог товарів

Одним з тестованих мобільних сайтів був сайт магазину H & M, каталог якого містив обмежений список товарів. В результаті користувачі, в цілому, отримали досить негативний досвід покупок. Вийшло, що обмежена версія каталогу на мобільному сайті веде до того, що потрібно виконати цілий ряд додаткових завдань: пояснити користувачеві, що каталог не повний, пояснити, що саме не виводиться в мобільній версії, пояснити, чому цей контент прихований і як можна знайти ці приховані товари.

У мобільній версії сайту H & M було представлено близько 10-20 обраних магазином товарів, а інший контент сайту вдавав із себе новини моди, інформацію про події і так далі. Однак висновок цих 10-20 товарів створив у користувачів враження, що на сайті викладений весь каталог товарів - вони могли знайти якусь продукцію і вважали, що інші товари просто знаходяться десь ще в інших розділах. Деякі з покупців проводили на сайті більше 10 хвилин, переглядаючи кожну сторінку в пошуках повного каталогу, так і не розуміючи, що його там взагалі немає.

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

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

сторінки допомоги

При тестуванні проблеми виникали не тільки з обмеженими версіями каталогів. Також важливо надати користувачам повноцінний розділ допомоги, хоча на багатьох сайтах він був скорочений. Наприклад, збереглися лише розділи із загальними питаннями або питаннями відносяться тільки до мобільних пристроїв (куки, проблеми з відображенням сторінок і так далі).

Один з користувачів порахував кумедним те, що на сайті REI він міг зайти в розділ допомоги (картинка 1), потім в розділ поширених запитань, потім в розділ «Допомога: Купівля і товари» (картинка 2) - безрезультатно намагаючись знайти інформацію про методи і оперативності доставки. Як тільки він перейшов з мобільної версії сайту на повноцінну, він знайшов потрібну інформацію протягом декількох секунд (картинки 3 і 4).

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

різноманітність форм

Хоча весь каталог і всі сторінки допомоги обов'язково повинні бути представлені на мобільній версії сайту, сам спосіб виведення інформації може (а іноді навіть повинен) відрізнятися.

BestBuy розділили опис товару на кілька секцій з короткими, виділеними жирним шрифтом, заголовками, щоб полегшити читання. Трохи більш детальна (але все одно коротка) інформація була приведена в сірому кольорі під заголовками.

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

Також можна оптимізувати для мобільних пристроїв і розділ допомоги: пристрої з діагоналлю в 4 дюйма вимагають, щоб текстова інформація була стислій і легко доступною (створіть точні розділи, підзаголовки, розставте пріоритети в поданні інформації).

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

Функціонал може бути іншим

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

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

І хоча на повнорозмірних сайтах функціонал анимированной каруселі (досить популярна деталь на більшості великих e-commerce сайтів) зарекомендував себе з позитивного боку, на мобільних пристроях він створював проблеми при навігації. Найчастіше, слайдер відображав будь-яку інформацію, крім виведення самих товарів (наприклад, інформацію про послуги, про навігацію на сайті, допомога, події і так далі).

Більш того, деякі функції можуть бути додані саме на мобільний сайт, хоча вони можуть здатися майже непотрібними на полноразмерном: визначення місця розташування (по GPS), збільшені картинки товарів в альбомному форматі, висновок результатів пошуку в залежності від контексту, установки за замовчуванням в залежності від поведінки користувача тощо. Можна не тільки видаляти функціонал з мобільної версії, але і додавати туди нові функції, якщо це виправдано.

очікування користувачів

Як і багато іншого в області юзабіліті, все прив'язується до очікування користувача. Користувач чекає, що зможе знайти все товари на мобільній версії сайту - врешті-решт, чому на мобільній версії товарів повинно бути менше, якщо це все той же магазин або бренд? Те ж стосується і описів товарів і розділу допомоги - ви очікуєте отримати той же набір інформації, тому що товар або швидкість доставки не змінюється через те, що ви використовуєте інший пристрій для оформлення замовлення. Хоча ви готові до того, що зовнішній вигляд сайту і форматування може помінятися, адже розмір екрану використовуваного пристрою став набагато менше. Ще вас може порадувати, якщо мобільна версія сайту визначить, що ви фізично перебуваєте в одному з магазинів компанії, і запропонує оформити безкоштовну доставку в цей магазин.

Так що відповідь на поставлене на самому початку питання - «Чи повинні ви скорочувати свій контент і набір функцій в мобільній версії сайту, або ж варто спробувати вмістити туди все, що є у звичайній?» - весь контент (товари і сторінки сайту) повинен бути збережений, але форматування інформації може відрізнятися. Функціонал мобільної версії теж може відрізнятися від повнорозмірною версії сайту в тих питаннях, де це виправдано.

Переклад і адаптація матеріалу « How Should Your Mobile and Desktop Sites Differ? »
Автор статті: Christian Holst

© CubeLine Agency