Оптимізація дизайну по айтрекінгу

Куди користувач дивиться в першу чергу, відкриваючи сайт? На яких зонах концентрує увагу? На ці питання відповідає айтрекінг.

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

Теплова карта

Чому важливо розставляти акценти

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

Вплив айтрекінгу на веб-дизайн

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

Паттерни руху погляду

На основі багатьох досліджень були виявлені закономірності перегляду веб-сторінок користувачами. До них відносяться F-крива та E-крива.

F-модель

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

F-паттерн 

Е-модель

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

Особливості поведінки користувачів за даними айтрекінгу

1. Згідно з дослідженнями, найбільшу увагу користувачі приділяють саме заголовкам, всупереч поширеній думці про перевагу зображень у цій справі. Причому відцентровувати їх потрібно по лівому краю, адже ця зона будь-якого сайту є "найгарячішою" на теплової карті.
2. Розташування об’єкта на зображенні також може впливати на шлях перегляду сторінки. Наприклад, об’єкт, що рухається буде спрямовувати увагу відвідувачів у напрямку свого руху. Користувачі, як і всі люди, за звичкою стежать за поглядом інших і орієнтуються по направлюючим увагу вказівникам.
   

3. Існує навіть науковий термін “банерна сліпота”, що з’явився завдяки айтрекінгу. Він означає, що медійні банери абсолютно ігноруються користувачами.
4. Логотип компанії, який розташовується в лівому верхньому кутку, слугує в якості нагадування або покажчика на місце, яке користувач відвідав, а також на те, як перейти до початкової сторінки з будь-якого іншого місця на даному сайті.
5. Не обов’язково все вміщувати на першому екрані. Дослідження показали, що користувач не відчуває жодних труднощів в тому, щоб проскролити сторінку вниз. Інформація сприймається від цього не гірше, тож недоцільно робити з першого екрану “кладовище” для важливих елементів.
6. Так склалося, що переважна частина аудиторії значно простіше сприймає відео, ніж навіть найменший текст. Айтрекінг-тест підтверджує цю тезу, доводячи, що вся увага користувача фокусується на відео.
7. Люди очікують виявити інформацію, яка є найважливішою, на пріорітетних участках. До факторів, що визначають пріоритет участку, належать: місцерозташування, розмір і виділення, зовнішній вигляд по відношенню до інших елементів сторінки.

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