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


25

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

Що можна зробити в веб-дизайні, щоб привести погляд користувача на весь сайт у потрібному напрямку, не потребуючи того, щоб користувач шукав потрібні частини сторінки?

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


7
Можливо, вас зацікавить "Eyetracking Web Usability" (2009) від Nielsen & Pernice: useit.com/eyetracking
Jari Keinänen

2
@koiyu я пішов і знайшов статтю "F" і збирався опублікувати її, коли зрозумів, що ти вже є. Я не можу достатньо підкреслити, наскільки важлива ця звичка до читання. Чудові проекти узгоджуються з цим потоком, а погані конструкції йдуть проти цього.
zzzzBov

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

Відповіді:


8

Це все питання балансу між розміром, кольором та вирівнюванням. З досвідом ви дізнаєтеся, що і коли використовувати ці хитрощі для привернення уваги. На щастя, на веб-сайті ми можемо відстежити цю увагу і є багато наукових досліджень з цього питання, наприклад, на веб-сайті Jakob Nielsen є хороші дані .

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

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

Чудова книга, яка може допомогти вам у цьому, - це ракетна хірургія, зроблена легко Стівом Кругом


5

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

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

Більше ресурсів для відстеження очей:

Послуги з відстеження очей:


3

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

(Джерело: http://www.grokdotcom.com/2007/10/04/how-a-pretty-face-can-push-visitors-away/ )


0

Я можу придумати два простих способи спрямувати погляд користувачів на веб-сайт:

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

Інтернет не є статичним середовищем. Стрілки не спрямовують людей. Потрібно орієнтувати їх за різними розмірами та кольорами у зваженій системі.
dkuntz2

Я не розумію. Чи можете ви детальніше розглянути детальніше про те, що "стрілки не керують людьми" та "спрямовуйте їх різними розмірами та кольорами у зваженій системі"?
Ган
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.