11 Поширені помилки веб-дизайну (помилки)

Є в Інтернеті тонна веб-сайту, і сотні або, можливо, тисячі створюються днем. Ось дуже цікава річ - Які елементи хорошого сайту?

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

У цій статті ми хотіли б підкреслити 11 помилок веб-дизайну, які роблять веб-розробники та дизайнери і деякі припущення, як ці помилки можна легко уникнути.

1. Де знаходиться поле пошуку?

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

Пропозиції:Користувацький пошук Google це акуратний, простий і ефективний спосіб розпочати роботу. Це дозволяє відвідувачам ефективно шукати ваш сайт. Просто скопіюйте HTML-код з панелі керування та вставте його на свій веб-сайт і voilà ??  ?? Ã'Â, у вас є функція пошуку прямо на вашому сайті.

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

Докладніше: Створення вікна пошуку: приклади та найкраща практика- У цій статті наведено детальні вказівки щодо розробки вікна пошуку.

2. Погана читаність і чіткість.

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

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

1. Порівняйте кольорові схеми більшості основних сайтів і зверніть увагу на те, як кольори покращують читабельність. Гарне місце, щоб спробувати різні кольорові схеми Adobe Kuler.
2. Використовуйте a Шрифт без зарубок як це дозволяє легко читати в Інтернеті.

Докладніше: Ось хороша стаття, яка дасть вам більше порад щодо поліпшення читабельності - Зчитуваність - Створення веб-сторінок для легкого читання.

3. Неорганізований макет вмісту.

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

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

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

Пропозиції: Організуйте вміст на своєму веб-сайті за допомогою HTML і CSS, використовуючи при створенні дизайну ваших сторінок.

1. Створюйте достатньо пробілів між текстом і зображеннями за допомогою полів.
2. Оновлення та послідовність. Мета оновлення полягає не лише в тому, щоб додати новий контент, а й виявити і виправити помилки минулого. Якоб Нільсен пропонує вам найняти a web “садівник”.

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

4. Погана навігація.

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

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

Пропозиції:

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

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

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

5. Невідповідний дизайн інтерфейсу.

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

Пропозиції:

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

6. Неприваблива роздільна здатність екрана.

Я впевнений, що ми відвідали веб-сайти, на яких потрібно прокручуватись горизонтально. Це абсолютне ні в сучасному веб-дизайні. Хороший дизайнер розроблятиме веб-сайти, які відповідають більшості розмірів екрана. Поточна оптимізована розкладка для веб-сайтів наразі становить 1024 x 768 пікселів.

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

• Перевірте свою статистику - Аналітичні служби, такі як Google Analytics, надають інформацію про те, яку роздільну здатність монітора вони використовують. Це корисна інформація, яку ви повинні знати перед ініціюванням наступного оновлення.
• Статистика W3 шкіл - W3 Schools дає чіткі списки найпопулярнішого браузера, який використовують користувачі мережі, і сортують їх за популярністю. Є й інші цікаві і важливі статистичні дані.

7. Складні реєстраційні форми.

Форми реєстрації складні. Скільки інформації потрібно від користувача? Пройшли ті дні, коли користувачеві доводилося вводити zillion дані для реєстрації на вашому веб-сайті. Деякі веб-сайти роблять більшість полів реєстрації обов'язковими і перевіряють поля в тій мірі, в якій користувач розчарований після декількох спроб. Пам'ятайте, що користувачі відвідують веб-сайт для отримання інформації. Не навпаки.

Проста форма людини робить реєстрацію безболісною.

Пропозиції:Порівняйте форми реєстрації в громадах в Інтернеті та зрозумійте, яка основна інформація потрібна користувачу під час реєстрації.

Докладніше: 9 Поширені помилки зручності в веб-дизайні - Ця посада на Smashing Magazine займає глибокий погляд на реєстраційні форми серед інших помилок зручності.

8. Недобросовісне використання зображень / анімацій.

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

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

Докладніше: Спалах: 99% погано - Використовуйте Flash належним чином. Пройшло майже 10 років з того часу, як Якоб Нільсен опублікував цю статтю, але він залишається актуальним з точки зору зручності використання Flash Розриває веб-основи шматок.

9. Переповнені сторінки, більше пробілів.

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

kylestanding добре використовувати простір в їх проекті.

Ось кілька статей, щоб дати вам гарну ідею на важливість прогалин у веб-дизайні:

• Порівняння чотирьох макетів білого простору
• Значення білого простору
• Пробіли

10. Без фонової музики, будь ласка!

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

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

11. Тест, тест і тест.

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

• Чи можна переглядати веб-сайт у різних середовищах?
• Чи відповідає дизайн макета у всіх браузерах?
• Чи можна переглядати веб-сайт у різних налаштуваннях, наприклад, зображення вимкнено, JavaScript вимкнено, тощо?

Пропозиції:W3C пропонує інструменти для перевірки якості. Перевіряти Панель інструментів забезпечення якості W3C і Перевірка веб-сторінки.

Висновок:

Будьте прості, дурні (K.I.S.S). Якщо це просто, його можна використовувати. Загалом, відмінні веб-сайти залишають його простим і корисним. Зробіть свою домашню роботу і вона приходить легко і природно.

Які ваші досвіди у проектах веб-дизайну? Які інші поради та думки ви б хотіли поділитися з помилками веб-дизайну?

Примітка редактора: Цей пост написано Brujo Owoh для Hongkiat.com. Brujo Owoh - студент мультимедійних систем, що спеціалізується на веб-дизайні та 2D анімації. Він любить читати художню літературу, спілкуватися зі своїми товаришами і йти в ногу з тенденціями дизайну в Twitter. Відвідайте блог Brujo.