Мобільне SEO допомагає зробити сайт зручним на смартфонах і помітним у мобільній пошуковій видачі. Воно поєднує роботу з контентом, відображенням сторінок, швидкістю та доступністю елементів керування.
За даними, наведеними в джерелі у квітні 2024 року, на мобільні пристрої припадало 58% світового вебтрафіку, хоча частка істотно відрізнялася залежно від галузі. На той час Google завершив перехід на індексування з пріоритетом мобільної версії, а 12 березня 2024 року показник Interaction to Next Paint (INP) замінив First Input Delay (FID).
Чому мобільне SEO важливе
Пошукова оптимізація для мобільних пристроїв вирішує ті самі завдання, що й традиційне SEO: допомагає користувачам знаходити відповідний контент. Але додатково доводиться враховувати розмір екрана, спосіб відображення сторінки, швидкість завантаження та зручність взаємодії.
Під час індексування з пріоритетом мобільної версії Google орієнтується на мобільну версію сайту. Тому проблеми з відображенням і доступністю контенту на смартфоні можуть ускладнити індексування ще до того, як почнуть працювати алгоритми ранжування.
Частка мобільної аудиторії залежить від галузі та наміру користувача. Наприклад, на B2B-сайтах може переважати десктопна аудиторія, а для великих покупок користувачі можуть віддавати перевагу комп’ютеру. Перш ніж визначати пріоритети, варто вивчити власні дані.
Як визначити частку мобільного трафіку
У Google Analytics 4 можна переглянути розподіл користувачів за категоріями пристроїв. В інтерфейсі, описаному джерелом станом на березень 2024 року, для цього пропонувалося відкрити Reports, натиснути значок Insights і в розділі Suggested Questions вибрати Technology, потім Top Device model by Users і пов’язаний результат Top Device category by Users. Звіт використовував діапазон дат, вибраний у GA4.
Інший варіант — звіт у Looker Studio: додати сайт як джерело даних, вибрати Device category як вимір і 30-day active users як показник, а потім підібрати відповідний тип діаграми. Додаткові виміри допоможуть порівняти сторінки, країни та пошукові системи за часткою мобільних користувачів. Назви розділів і порядок дій стосуються інтерфейсів, описаних у 2024 році.
Як перевірити зручність сайту на мобільних пристроях
Google видалив інструмент перевірки зручності для мобільних пристроїв із Search Console у грудні 2023 року. На момент публікації джерела для перевірки залишалися доступними інші інструменти.
Тест Bing перевіряв, зокрема, налаштування viewport, відповідність вмісту ширині екрана, читабельність тексту та розмір інтерактивних елементів. Розширення Lighthouse для Chrome оцінювало продуктивність, доступність і SEO; звіт також можна було запустити на вкладці Lighthouse в інструментах розробника Chrome, вибравши режим Mobile.
PageSpeed Insights аналізує сторінку за вказаною URL-адресою та включає до звіту показники Core Web Vitals. WebPageTest.org допомагає візуально вивчити процеси завантаження та знайти операції, які його затримують. В інструментах розробника Chrome можна перемикатися між представленнями для комп’ютера та мобільного пристрою.
Автоматичні звіти корисно доповнити перевіркою на власному смартфоні: чи швидко відкривається сайт, чи можна знайти важливу інформацію, прочитати текст і додати товар у кошик. Аналізуючи звіти, зверніть увагу на розділи продуктивності та доступності: вони допоможуть сформулювати завдання для розробників.
Вибір способу відображення сторінок
Два поширені підходи — адаптивний дизайн і динамічна видача. За адаптивного дизайну CSS і гнучка верстка підлаштовують розташування та розміри елементів під екран, його орієнтацію та роздільну здатність. Для доставки контенту також можуть використовуватися CDN і сучасні формати зображень. Саме цей підхід джерело називає рекомендованим Google.
За динамічної видачі сайт показує різні фіксовані макети залежно від пристрою, наприклад окремі версії для комп’ютера, смартфона та планшета. Такий підхід дає більше контролю над вмістом кожної версії, але менш ефективний. Серед інших варіантів джерело згадує прогресивні вебзастосунки та окремий мобільний сайт із власною URL-адресою; останній підхід у статті не рекомендується.
INP: чутливість сторінки під час взаємодії
FID вимірював затримку між першою дією користувача та початком обробки відповідних подій браузером. INP оцінює чутливість протягом усього часу роботи зі сторінкою, а не лише під час першої взаємодії.
За порогами, наведеними в джерелі, INP менш як 200 мс вказує на добру чутливість, від 200 до 500 мс — на потребу в поліпшенні, а понад 500 мс — на низьку чутливість.
Наведення курсора та саме прокручування не входять до розрахунку INP. Водночас натискання клавіш, які запускають обробники подій, можуть враховуватися. Прокручування здатне вплинути на показник опосередковано: наприклад, дозавантаження додаткових матеріалів може зайняти основний потік і сповільнити реакцію на наступні дії користувача.
Причинами низької чутливості можуть бути тривалі завдання JavaScript, великий DOM і складні обробники подій. Джерело звертає увагу на DOM, починаючи приблизно з 1500 елементів: що він більший, то більше роботи може знадобитися для відображення сторінки та реакції на дії. Ресурсомісткі обчислення або синхронні мережеві запити в обробниках також здатні затримувати візуальний відгук.
Для розв’язання проблеми джерело пропонує, зокрема, розбивати довгі завдання JavaScript на коротші за допомогою Scheduler API та перевіряти показники INP за географічними регіонами за допомогою treo.sh. Це може допомогти визначити, де чутливість викликає найбільші труднощі.
Зображення та спливні елементи
Зображення мають підходити для екранів різного розміру, роздільної здатності та орієнтації. Серед рекомендацій джерела — адаптивні зображення, відкладене завантаження, стиснення з використанням WebP і додавання зображень до карти сайту. Водночас важливо враховувати і якість зображення, і вплив на швидкість сторінки.
Нав’язливі міжсторінкові елементи та спливні вікна можуть закривати основний контент. Джон Мюллер із Google відзначав особливу увагу до першої взаємодії користувача після переходу з пошуку. Не кожне спливне вікно вважається проблемним, але джерело зараховує до нав’язливих вікна, які закривають більшу частину сторінки, не підлаштовуються під мобільний екран або не дозволяють користувачу їх закрити. Також згадуються вікна, що з’являються без дії користувача, як-от прокручування або натискання.
Структуровані дані та мобільна видача
Мобільна пошукова видача включає не лише звичайні посилання, а й локальні блоки, товарні оголошення, відео та інші формати. Структуровані дані допомагають пошуковим системам розуміти інформацію на сторінці й можуть використовуватися для розширених результатів.
За допомогою JSON-LD можна розмічати дані про організації, товари та послуги за словником Schema. Для сайтів на WordPress існують плагіни, які автоматично додають розмітку. Сама наявність розмітки не означає, що розширений результат обов’язково з’явиться у видачі.
Текст та елементи керування
На невеликому екрані довгі абзаци читати складніше, тому джерело рекомендує лаконічні формулювання, короткі заголовки та зручний для читання розмір шрифту. За можливості можна запропонувати темний або приглушений режим, щоб знизити навантаження на очі.
Посилання, пункти меню, поля форм і кнопки мають бути достатньо великими та розташовуватися так, щоб на них було зручно натискати. За даними джерела, звіт Lighthouse звертає увагу на області натискання менші за 48 × 48 пікселів, а також на елементи, які перекриваються або закриті іншими частинами сторінки. Особливо важливо перевірити навігацію та кнопки купівлі в інтернет-магазині.
Що поліпшувати насамперед
Якщо мобільна версія потребує масштабування та горизонтального прокручування для читання, почніть із відображення сторінок: решта поліпшень не усуне цю базову проблему. Потім перегляньте довгі абзаци та зручність читання, оптимізуйте зображення й переконайтеся, що посилання та кнопки придатні для натискання.
Структуровані дані джерело ставить після цих завдань: розширені результати можуть допомогти залучити переходи з пошуку, але спочатку користувачу потрібно забезпечити доступний і зручний сайт. Вибираючи конкретні роботи, орієнтуйтеся на дані про аудиторію та проблеми, виявлені під час перевірок.
Коментарів поки немає. Почніть обговорення.