10 «корисностей» веб-майстру (принципи юзабіліті)

1)Lable полів форм краще розташовувати над полями форм

Дослідження проводили UX Matters. Згідно з їхніми результатами, краще краще розташовувати над полями форм. Найчастіше використовують макет у 2 стовпці (lable зліва, поля форм справа) начебто виглядає добре, але не є найпростішим макетом. Але цей макет є найпопулярнішим.

веб-майстру

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

Інший варіант, вирівнювання lable по правому краю. Якщо порівнювати з першим варіантом форма приємніша на вигляд.

принципи
Але в цьому варіанті мінус – текст більше «скаче», і явно визначається дискомфорт для очей: мається на увазі перехід від заповненого поля до наступного lable (позиція якого завжди залежить від кількості символів тексту) візуально не зручна.

2)Більшість користувачів не «прокручують»

Так надайте в цій частині сайту основні дані: 1.Ім'я сайту, 2.Пропозиція значущості (тобто які вигоди вони отримають від його використання), 3.Навігація по основних частинах сайту, які важливі для користувача.

Робіть сайт зручним, не тільки для себе) Наведу кілька прикладів:AnyWayAnyDay або fineandchic.com

3)Якість дизайну є показником довіри

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

4)Користувачі концентруються на особах

5) Кращий колір для посилань це синій

Круто, коли створюєш сайт з унікальним дизайном,АЛЕколи йдеться проюзабіліті, краще робити те, що всі інші роблять. Дотримуйтесь конвенцій, оскільки коли люди відвідують новий сайт, вони завжди шукають речі на тих місцях, де вони звикли знаходити їх на інших сайтах, вони використовують свій досвід, щоб осмислити новий вміст. Це називається "використання зразків". Люди очікують певних речей, таких як кольори посилань, розташування логотипу сайту, поведінка навігаційних вкладок і т.д.

веб-майстру
Googleзавжди робить свої посилання синіми і на те є причина: колір знайомий багатьом користувачам, через що посилання легко виявити.

Який колір повинен мати посилання? Перше міркування це контраст: посилання мають бути досить темними (або світлими), щоб контрастувати з кольором фону. Наступне, вони повинні відрізнятись від решти тексту на сторінці, так що не потрібно робити чорні посилання, коли сам текст на сторінці чорний. І нарешті, дослідження показало (Van Schaik та Ling), що якщо ви ставите пріоритет на юзабіліті, то посилання краще робити синіми. Колір посилань браузера за замовчуванням це синій, тому люди очікують побачити саме цей колір. Вибір іншого кольору це не проблема, але користувачам знадобиться більше часу на знаходження таких посилань.

6) Вільний простір покращує розуміння

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

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

7) Ідеальне поле введення пошукового запиту має бути 27 символів завширшки

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

введення
Дослідження показало, що в середньому поля введення пошукового запиту мають ширину 18 символів. Судячи з даних,27% пошукових запитів були надто довгимиі не помістилися в них. Розширення поля введення пошукового запиту до 27 символів у довжину дозволить помістити в ньому 90%пошукових запитів Пам'ятайте, що ви можете ставити ширину не тільки в пікселях і пунктах, але також і в em (відносна одиниця довжини, що дорівнює розміру поточного шрифту). Таким чином, використовуйте цю величину для встановлення ширини поля введення пошукового запиту в 27 символів.

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

8) Інформаційні сторінки про продукт допоможуть вам виділитися

10) Тестування користувача не повинно бути великим

Дослідження Jakoba Nielsena на тему ідеальної кількості тестувальників юзабіліті сайту показало, що всього 5 користувачів, що тестують, виявлять майже 85% всіх проблем на вашому сайті, в той час як 15 тестуючих виявлять майже всі проблеми.

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

З.И. Інформація може бути не новою, але вона актуальна!