Starting a new project?
отримати консультацію
Залиште свої контактні дані, наш менеджер передзвонить вам.
Дякуємо! Скоро з вами зв'яжеться наш менеджер.
Дякуємо! Скоро з вами зв'яжеться наш менеджер.
За даними ресурсу Statcounter, за останній рік мобільним пошуком користуються на 8-10% більше, ніж десктопним – 55% та 44% (дані за листопад 2021). І оскільки поширення мобільних та їх можливості з часом збільшуються, колись показник буде близьким до 100%.
Рис. 1 – Статистика Statcounter
Тенденція переходу до мобільних телефонів для серфінгу в інтернеті, і головне для покупок, змусила сайти розробляти власні мобільні версії. Тому що втратити жирний шматок користувачів-клієнтів не хочеться нікому.
Коли Google помітив цей тренд, він почав підштовхувати веб-сайти до адаптації своїх ресурсів під маленькі екрани портативних дзвонилок. І в липні 2019 року перейшов на індексацію із пріоритетом мобільного контенту. Таким чином, місце у пошуковій видачі тепер визначає мобільна версія: її зручність, швидкість завантаження та релевантність вмісту.
Діє це правило як для нових або недавно доданих до індексу ресурсів, так і для сайтів, створених раніше. Якщо вас переводять на такий тип індексації, ви отримаєте повідомлення в Search Console.
Рис. 2 – Приклади неоптимізованих сторінок
Але трафік – це лише одна з причин, щоб адаптувати сайт під мобільні пристрої.
Друга причина – зручність. Без прив'язки до ПК будь-хто зможе відвідати сайт та знайти потрібну інформацію через маленький екран мобільного. Де б користувач не знаходився.
Щоб ваш сайт був зручний у використанні, Google дає такі рекомендації для мобільної версії ресурсу (для тих, що ранжуються з пріоритетом на мобільний контент).
Ви ж оптимізуватимете сайт під мобільні пристрої для людей?
Тому ловіть перелік вимог з боку користувачів, тобто ті нюанси, які допоможуть вам не втратити трафік, а збільшити його:
Краса, зручність та швидкість – ось що вимагають користувачі від мобільного сайту сьогодні.
Для реалізації мобільної версії сайту можна скористатися одним із 2-х способів:
Розберемо кожен пункт докладніше.
Власне – це ще один сайт, оптимізований під показ та взаємодію тільки з мобільними та планшетами. В адресі сайту перед його назвою через точку вказується m чи mobile.
Рис. 3 – Мобільні версії сайтів у пошуку
| Переваги | Недоліки |
|
|
Оптимізація мобільної версії сайту здійснюється окремо, а за загальним дизайном вона має запозичувати елементи або повністю копіювати зовнішній вигляд материнського ресурсу (для впізнаваності).
Крім зазначених недоліків, обидві версії можуть конфліктувати між собою. Щоб уникнути цього, використовуйте теги canonical та alternate. Вони допоможуть усунути дублі сторінок.
На основному сайті в тезі alternate потрібно вказати посилання на мобільну версію сторінки, таким чином зв’язуються сторінки мобільної та основної версії.
А тег canonical розміщується саме на мобільній версії із зазначенням основної версії сторінки.
Але Google не рекомендує створювати нову версію, а радить користуватися адаптивною версткою. При цьому старим сайтам легше заморочитися зі створенням окремої мобільної версії. Тому що робити адаптивну означає практично створювати сайт з нуля. Хоча, з погляду SEO, перспективніше.
Цей термін означає, що всі елементи вашого ресурсу змінюватимуть розмір залежно від девайса, з якого відбувається перегляд. Адаптація не урізує функції і може бути перевантаженою, тому що на дрібних екранах навігація буде складнішою, що зашкодить поведінковим факторам.
З іншого боку, це зручно через те, що всі популярні системи CMS пропонують адаптивні шаблони. Тому адаптувати сайт під мобільні пристрої можна онлайн.
Це означає, що десктопний сайт автоматично утискатиметься під потрібні розміри без серйозної участі розробника. Хоча, якщо сайт створюється вручну, вам доведеться задавати можливість масштабування також вручну.
Рис. 4 – Адаптивна верстка
| Переваги | Недоліки |
|
|
З одного боку, це рішення швидке і зручне, але воно не позбавлене недоліків.
Тому для стабільності та зростання зручності можна скористатися цими порадами:
Якщо сайт пишеться вручну, то доведеться для кожного елемента задавати параметри, які допоможуть елементам змінювати своє розташування та розмір залежно від ширини та висоти дисплея. У результаті результат може не влаштувати вас, тому подумайте, який із двох варіантів вам доцільніше.
Докладно про те, що таке AMP, які обмеження та переваги цей формат дає, писали у статті Що таке AMP-сторінки.
Тут згадаю, що попри швидкість завантаження та пріоритет у ранжуванні, такий спосіб прискорення сильно б’є за функціональністю. Як приклад, картинки повинні мати заданий розмір, на сайті може бути відсутня функція коментування, неможливо впровадити динамічні елементи тощо.
Якщо вам функціонал дуже важливий, то краще взагалі не вдаватися до AMP.
За окрему плату задачу оптимізації для мобільних можна довірити програмісту.
А якщо зайнятися цим самостійно, результат можна отримати за допомогою наступних інструментів:
Незважаючи на те, що адаптований під мобільний сайт допомагає залучати додатковий трафік, не всім галузям він необхідний.
Наприклад, при виборі нерухомості користуватися телефоном буде просто незручно. Щоб розглянути картинки та планування будівлі, знадобиться великий екран. Тому далеко не кожен сайт має робочий аналог для маленьких дисплеїв.
Мобільна версія надасть вам перевагу в таких сферах:
Як би не було, про створення адаптованого аналога основного ресурсу треба подумати вже зараз. Навіть якщо вам здається, що мобільна версія вашому бізнесу не потрібна.
Якщо ви вже створили оптимізовану під телефон версію сайту, то одразу ж проведіть перевірку оптимізації для мобільних телефонів інструменті від Google. Він покаже, наскільки вона зручна, й в чому помилки верстки.
Рис. 5 – Результат перевірки
Якщо стежите за роботою свого веб-сайту через Search Console, то є звіт про зручність користування на мобільних.
Він покаже, на яких сторінках є проблеми:
Рис. 6 – Search Console
У Хромі є емулятор, який допоможе перевірити, як сайт виглядатиме на мобільних за допомогою Chrome DevTools.
Або ж сайт Responsinator – ввів адресу й дивишся, як твій сайт виглядає на мобільних. Дуже зручно.
Рис. 7 – Емулювання малювання мобільної версії ITForce
Перевірка після адаптації існуючої верстки або створення окремого мобільного сайту є обов’язковою. Вона допоможе відкоригувати помилки та візуал, щоб вашій аудиторії теж сподобався результат.
Рекомендація від ITForce: З погляду просування у пошуку краще використовувати адаптивний дизайн, тому що це один сайт. Тобто ви отримуватимете за ним одну статистику.
За мобільною версією потрібен постійний контроль + це подвійна робота (впроваджувати нові опції доведеться відразу на 2 ресурси окремо).
Наша думка – мобільні версії в майбутньому перестануть використовуватися й залишиться лише адаптивний дизайн.
Ви вже підписані на нашу розсилку!
Підтвердіть свій email для завершення підписки.
Дякуємо! Скоро з вами зв'яжеться наш менеджер.