Як оптимізувати сайти під мобільний трафік

358

Частота використання мобільних гаджетів для підключення до інтернету зростає у всьому світі. Експерти вважають, що вже в 2015 році більшість пошукових запитів буде здійснюватися власниками смартфонів і планшетних комп’ютерів. Ми не поділяємо скепсис експертів, це може статися вже в цьому році 🙂 При цьому, потрібно враховувати, що в деяких країнах, наприклад, в Китаї та Індії, мобільний трафік вже домінує.

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

Це підтверджує дослідження компанії Keynote Systems, згідно з результатами якого 64% власників смартфонів у США вважають, що сайт повинен відкриватися протягом максимум чотирьох секунд. А 16% власників мобільних девайсів ніколи не повертаються на ресурс, який завантажується надто довго. Некоректне відображення інтернет-сторінок на екрані планшета або смартфона є другою проблемою після повільного завантаження, що змушує користувачів відмовлятися від відвідування ресурсу.

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

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

Адаптивна верстка або мобільна версія сайту?

Насправді не так все просто, як здається. Адаптивна верстка – це дуже серйозний тренд. У загальному і цілому ми його теж підтримуємо (в силу своїх можливостей, звичайно). Але потрібно розуміти, що тренд диктується не тільки реальними перевагами адаптивної верстки перед створенням спеціалізованих версій, але і модою. Адаптивна верстка викликає відразу кілька глобальних проблем. Насамперед – багаторазове ускладнення розробки при багаторазовому ж спрощення структури. Тобто, структура сайту стає каменем спотикання. Чим простіша структура – тим менше необхідної інформації ви можете надати користувачам. Більш складна структура збільшує трудовитрати на виробництво. Адаптивний дизайн хороший для блогів, невеликих сайтів. Але якщо у вас величезний проект з великою кількістю сторінок (і – головне – типів сторінок) адаптивний дизайн може ваш проект просто поховати. Загалом, питання не настільки однозначна, як може здатися на перший погляд. В кожному випадку ми закликаємо окремо і дуже відповідально приймати рішення – створювати мобільну версію сайту або ж іти шляхом адаптивної верстки.

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

Спрощення дизайну

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

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

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

Оптимізуйте контент

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

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

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

Робіть навігацію простою і зрозумілою

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

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

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

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

Скорочуйте час завантаження

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

Наприклад, відмовтеся від флеш-анімації, залишивши її для основної версії сайту (якщо вона там взагалі доречна). Чи варто нагадувати, що продукти компанії Apple взагалі не підтримують флеш-технології? А адже ця компанія утримує 30% ринку смартфонів у світі. Java також збільшує швидкість завантаження сайту. Тому краще відмовтеся від анімації, автоматично запускається аудіо і відео, оптимізуючи сайт під мобільний трафік.

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

Як оптимізувати сайти під мобільний трафік

Працюйте над впізнаваністю вашого бренду

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

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