Помилки в адаптивному дизайні. На що звернути увагу?

Відео: Адаптивний дизайн 10 Тестування і типові помилки

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

Цій майстерності можна і потрібно вчитися.

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

Вміст важко розглянути

Це дивно, як легко зробити кілька простих помилок, щоб колись красивий сайт на різних екранах виглядав би то мікроскопічним, то до непристойності гігантським.

Кнопки, заголовки і текст можуть бути легко перекручені в залежності від незліченних змінних.

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

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

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

Відео: Адаптивний дизайн сайту - як адаптувати шаблон WordPress

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

Сторінки занадто довго завантажуються

Важкі зображення і відео уповільнюють завантаження веб-сайтів.



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

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

Це буде створювати безліч проблем для розробників і маркетологів, так що краще уникати створення «повільного дизайну».

фріланс

Відео: Що таке адаптивний дизайн?


Дизайн вбиває функціональність

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


Відео: Як зробити адаптивний сайт?

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

Повірте, людина, що зіткнувся з цим, до вас більше не повернеться.

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

Ви не розумієте користувачів

Не думайте, що розробники можуть просто забрати розроблений вами дизайн і створити ідеальне рішення. Це просто не справедливо.

Ось чому, як дизайнери, ви повинні розглянути, хто використовує проект, а також де, коли і як.

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



В анкету можна включити питання:

Ім`я: людині приємно, коли запитують, як його звуть

Зображення: особи зроблять цей процес простіше і більш особистим

Професія: чим людина займається? Різні професії воліють різні пристрої.

Адреса: якщо більшість користувачів знаходиться в Бразилії, вони, ймовірно, використовують інші пристрої, ніж люди в Японії

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

Цілі: які саме сайти цікавлять і чому?

Проблеми: які проблеми в житті користувачів, і як вони зазвичай намагаються вирішити їх?

висновки

В процесі роботи над дизайном ви повинні думати про майбутнє вашого проекту і про ваших користувачів.

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

В іншому випадку ваш адаптивний дизайн важко буде назвати хорошим.


Увага, тільки СЬОГОДНІ!


Оцініть, будь ласка статтю
Всього голосів: 117