На сьогоднішній день кількість користувачів з мобільних пристроїв значно перевищує кількість користувачів з персональних комп’ютерів та ноутбуків. Згідно з статистикою сервісу Semrush кількість користувачів на мобільних пристроях в 3 рази більша, ніж кількість користувачів настільних пристроїв:
Щоб ваш сайт сподобався пошуковій системі, він повинен коректно відображатися та функціонувати на мобільних пристроях. Ще у листопаді 2016 пошукова система Google перейшла на Mobile First індексацію — це означає, що пошукові боти сканують та аналізують у першу чергу саме мобільну версію сайту, її характеристики та зручність, тому якщо ви не займаєтеся мобільною версією сайту, високих позицій у вас не буде.
Як перевірити зручність мобільної версії сайту?
Існує кілька способів і сервісів, які дозволяють перевірити відображення сторінок сайту на різних мобільних пристроях. Зараз я розповім про те, як ними користуватися, а також надам посилання на сервіси SEO аналітики, які допоможуть знайти очевидні помилки в мобільній версії вашого сайту.
Перевірка за допомогою інструментів браузера
На сьогоднішній день в будь-якому сучасному браузері є можливість перевірити адаптивність сайту. Я покажу, як це зробити на прикладі найпопулярніших браузерів.
Google Chrome
Для того, щоб перевірити, як відображається сайт на телефоні за допомогою Google Chrome, потрібно відкрити інструменти розробника. Це можна зробити або за допомогою комбінації гарячих клавіш:
- Ctrl + Shift + I для Windows;
- ⌘ + Option + I для MacOS.
Або за допомогою інтерфейсу налаштувань, для цього потрібно відкрити меню, навести курсор на Додаткові інструменти та вибрати Інструменти розробника у випадаючому меню.
Коли ви це зробите, на екрані з’явиться консоль, де буде видно HTML-код поточної сторінки, приклад:
Для того, щоб переглянути відображення сайту як на телефоні, необхідно натиснути на іконку з зображенням планшета та телефона (іконка знаходиться ліворуч поруч з вкладкою Elements):
У верхній частині з’явиться випадаючий список з телефонами, які доступні для перегляду сайту.
Firefox
Гарячі клавіші для відкриття інструментів розробника ідентичні як в Google Chrome. Також можна відкрити інструменти розробника натиснувши правою кнопкою миші по екрану та обравши пункт меню Дослідити:
Також є відмінність у розташуванні іконки включення відображення адаптивної версії сайту, тут вона знаходиться праворуч:
Онлайн сервіси для перевірки адаптивності сайту
Сервісів для перевірки адаптивності сайту існує величезна кількість, серед них можу виділити наступні:
iloveadaptive
Інструмент, який дозволяє перевірити відображення на багатьох пристроях, в тому числі на великих моніторах для персональних комп’ютерів, що дуже зручно, оскільки у інструментах браузера цього немає. Також є можливість одночасної перевірки сторінок на декількох пристроях. Приклад:
Bing Mobile Friendliness Test
Дозволяє перевірити сайт від пошукової системи Bing; результат аналізу відображається у вигляді висновку (самостійно тестувати за допомогою цього інструменту неможливо). Приклад:
Висновок
Для того, щоб мати хороші позиції, важливо мати адаптивний сайт з коректним функціоналом. У цій статті я описав базові способи перевірки того, як відображається сайт на мобільних пристроях, завдяки чому можна самостійно перевірити адаптивність сайту своїми руками та знайти помилки, які потрібно виправити. Сервіс Mobile-friendly від Google вже недоступний, тому необхідно перевіряти сайт самостійно. Якщо ви хочете отримати консультацію або замовити аудит з юзабільності та адаптивності мобільної версії вашого сайту — звертайтеся до онлайн-чату на сайті або в Telegram.