Як покращити адаптивну версію сайту

Як покращити чуйну версію вашого сайту? - 9 порад

1. Визначте пріоритетні типи контенту.

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

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

Ця рада безпосередньо випливає з попереднього.

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

Чи означає це, що користувач смартфона повинен бачити таку саму інформацію, як і відвідувач сайту з настільного комп'ютера?

Абсолютно ні.

3.Надайте користувачам зображення відповідного розміру

Говорячи про те, як покращити чуйну версію веб-сайту, не можна забувати про графіку .

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

З одного боку, вони можуть бути "недомальовані" до краю екрана, а з іншого боку, вони можуть бути зайво розтягнуті в порівнянні з оригіналом.

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

Все це для того, щоб переконатися, що даний вид (і графіка у ньому) просто оптимальний.

4. Зробіть адреси електронної пошти та контактні номери доступними для перегляду. сайту, це, безсумнівно, одна з основ. Є певні елементи сайту, до яких варто ставитися відповідним чином. на мобільних сайтах. Мова йде, наприклад, про адреси електронної пошти. Помістивши відповідне посилання на таку адресу, ми можемо вибрати його пальцем. Відкриється поштовий клієнт, який можна використовувати для надсилання повідомлень.

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

5. Зменште вагу графіки

І знову ми на мить занурюємося в графіку.

Однак ніщо не заважає нам використовувати так званий стиск для зображень.

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

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

З цього приводу я можу порекомендувати вам один з наших кстів: як оптимізувати графіку на сайті?

6. Переконайтеся, що поля форм мають правильні типи

На комп'ютерах ми не помічаємо цієї проблеми. Той факт, що форма має два поля "Ім'я" та "Номер телефону", не має для нас жодного значення. За допомогою однієї клавіатури ми можемо однаково легко заповнити обидва поля. /span>

Якщо поле в HTML позначено типом "число", то при виборі такого поля мобільний браузер за замовчуванням запускає цифрову клавіатуру .

З іншого боку, якщо поле позначене як "текстове поле" або "текст", буде відображатися клавіатура за замовчуванням.

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

Тому не забувайте помічати потрібні поля потрібними типами. span>

Ось текст, який може здатися вам цікавим: Форми на веб-сайтах - як їх ефективно оформити?

7. Налаштуйте розмір шрифту та висоту рядків.

Один із очевидних у контексті того, як покращити чуйну версію веб-сайту .

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

Текст на вашому сайті просто повинен бути добре видно. У деяких випадках доцільно навіть трохи збільшити розмір шрифтів у порівнянні з тими, які доступні на настільних комп'ютерах.

саме стосується і висоті лінії. Текст не можна просто "стиснути". Між окремими рядками має бути правильна відстань, щоб текст "дихав" і легко читався. 8. Розгляньте можливість додавання пошукової системи

Через свій дизайн чуйні веб-сайти часто не так інтуїтивно зрозумілі у використанні , як їх настільні аналоги.

Це особливо актуально для більш складних сайтів з великою кількістю контенту всередині. span>

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

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

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

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

9. Налаштуйте розмір кнопок

Як кажуть, останнє, але не менш важливе.

У контексті того, як покращити чуйну версію веб-сайту, про кнопки не можна забувати.

<Саме вони відповідають за виконання найважливіших дій - пошук, вибір підсторінок і навіть купівлю товарів. У них тисячі варіантів використання. Тому правило просте - кнопки повинні бути не тільки видимими, але і правильного розміру. .

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

Як покращити чуйну версію веб-сайту? - резюме

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

Сам факт використання так званої "сітки" при будівництві ділянки не допоможе.

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

Сподіваюся, що наведені вище поради будуть вам корисні.