1. Зовнішній вигляд
2. 2. Спливаючі вікна
3. 3. Відсутність єдиної дизайнерської концепції
4. 4. Помилки верстки
5. 5. Відсутність логотипу
6. 6. Реклама на комерційному сайті
7. 7. Автоматичний запуск відео або музики
8. 8. Невдала колірна гамма і контрастність
9. 9. Незручне і нелогічне розташування елементів
10. 10. Надлишкова анімація
11. Навігація
12. 12. Биті посилання
13. 13. Не оформлена сторінка 404
14. 14. Ні «хлібних крихт»
15. 15. Мінімальний розмір клікабельних елементів
16. 16. Горизонтальна прокрутка
17. 17. Відсутність внутрішнього пошуку на сайті
18. 18. Немає сторінок «Контакти» і «Про нас»
19. 19. Тупиковий сценарій
20. функціональність
21. 21. Миттєвий запит реєстрації
22. 22. Проблеми з формами реєстрації
23. 23. Приховані поля введення паролів
24. 24. Відсутність оптимізації для мобільних пристроїв
25. 25. Немає підтримки моніторів з високою роздільною здатністю
26. 26. Ні «соціальних» кнопок
27. контент
28. 28. «Полотна» тексту
29. 29. нечитабельним шрифт
30. 30. «Розтягування» статті на кілька сторінок
31. 31. Відсутність навігації усередині статті
32. 32. Неактуальна інформація
33. 33. Вузька або широка колонка тексту
34. 34. Надлишок (або нестача) зображень
35. 35. «Многотекстаібукв»

у статті «Що таке юзабіліті, і як зробити сайт зручним для користувачів» ми вже розповідали про поняття і принципи зручного ресурсу. Сьогодні ми поговоримо про помилки, які часто допускаються при веб-проектуванні. Для зручності ми згрупували помилки в логічні групи.

Зовнішній вигляд

1. Багато реклами

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

2. Спливаючі вікна

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

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

3. Відсутність єдиної дизайнерської концепції

Сайт повинен бути витриманий в єдиному стилі. Не варто креативити і розфарбовувати в різні кольори сторінки з рубриками, записами і головну або застосовувати різні елементи оформлення. Це збиває з пантелику, і користувач просто не зрозуміє, де він - на вашому сайті або вже немає.

4. Помилки верстки

Верстка повинна бути «рівною», без перекосів. Текст не повинен виходити за рамки відведених блоків, зображення не повинні «скакати» по різних кутах. Перевірте, як відображаються сторінки в різних браузерах. Некоректна верстка може істотно зіпсувати вашу репутацію, адже вона свідчить про непрофесіоналізм.

5. Відсутність логотипу

У шапці сайту повинен бути логотип. Кожен користувач інтуїтивно шукає логотип саме тут. Який би у вас не був сайт - інтернет-магазин, блог або каталог оголошень - логотип обов'язково потрібен.

6. Реклама на комерційному сайті

Рекламні банери сторонніх ресурсів або блоки контексту на сторінках інтернет-магазину - явище, як мінімум, дивна. Це може викликати недовіру з боку клієнтів і бути згубним для репутації.

7. Автоматичний запуск відео або музики

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

8. Невдала колірна гамма і контрастність

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

9. Незручне і нелогічне розташування елементів

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

10. Надлишкова анімація

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

Навігація

11. Зайве меню

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

12. Биті посилання

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

13. Не оформлена сторінка 404

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

Розмістіть тут цікаві записи, форму пошуку, рубрики, поясніть, чому виникла помилка 404. Можна також помістити цікаву картинку або відео - це приверне увагу. Детальніше про роботу з такими сторінками ми писали в цієї статті.

14. Ні «хлібних крихт»

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

15. Мінімальний розмір клікабельних елементів

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

16. Горизонтальна прокрутка

Її не повинно бути взагалі. Сайт повинен повністю поміщатися по ширині на екрані користувача, будь то телевізор, ноутбук або смартфон.

17. Відсутність внутрішнього пошуку на сайті

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

18. Немає сторінок «Контакти» і «Про нас»

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

19. Тупиковий сценарій

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

функціональність

20. Повільне завантаження сторінок

Збільшення часу завантаження сторінки до 7 секунд підвищує показник відмов на 30%. Якщо сторінка вантажиться ще довше, то показник відмов прагне до 100%. Повільні сайти гірше індексуються і нижче ранжуються пошуковими системами. Саме тому треба працювати над збільшенням швидкості завантаження сторінок і часу відповіді сервера. Для перевірки відгуку сторінок використовуйте цей безкоштовний сервіс від Google.

21. Миттєвий запит реєстрації

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

22. Проблеми з формами реєстрації

Форма реєстрації - це не анкета. Десяток і більше полів в формі дуже часто стають причиною відмови від використання ресурсу. Практика показує, що 2-4 поля цілком достатньо. Іншу інформацію людина може ввести пізніше в особистому кабінеті.

23. Приховані поля введення паролів

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

24. Відсутність оптимізації для мобільних пристроїв

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

25. Немає підтримки моніторів з високою роздільною здатністю

Враховуйте рух прогресу і налаштуйте підтримку моніторів з високим ppi. В іншому випадку елементи (логотипи, піктограми) можуть виглядати розмите, а якісні фото - не так добре виглядати, як могли б.

26. Ні «соціальних» кнопок

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

контент

27. Незрозуміло, про що сайт

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

Сайт про будівництво та ремонт? Чи не вгадали

28. «Полотна» тексту

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

29. нечитабельним шрифт

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

30. «Розтягування» статті на кілька сторінок

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

31. Відсутність навігації усередині статті

Якщо стаття велика, то варто зробити зміст і посилання по ходу тексту «До змісту». Також допустимо застосування посилань-якорів на різні частини тексту.

32. Неактуальна інформація

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

33. Вузька або широка колонка тексту

Ширина поля для тексту повинна складати 60-70% ширини сторінки. Дуже вузькі колонки витягають текст, і їх незручно читати. Широкі колонки ускладнюють читання, адже можна втратити рядок (як на малюнку нижче).

34. Надлишок (або нестача) зображень

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

35. «Многотекстаібукв»

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

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