Loading...
ЗМІСТ
Ми живемо у світі цифрових технологій, де користувач стає все більш вимогливим. Завдання кожного бізнесу задовольнити запит споживача, чого хоче й Google.
З кожним роком збільшується кількість людей, які використовують свої смартфони або планшети для доступу до всесвітньої мережі Інтернет (на даний момент мобільний трафік становить 55% від загальної кількості по всьому світу). Google реагує на зміни ринку та впроваджує Mobile First Indexing. Що це та як адаптувати сайт під мобільні пристрої читайте у цій статті.
Давайте згадаємо…
Перш ніж розпочати розгляд основних питань, пропонуємо трохи поринути в історію впливу мобільної версії в пошуковій системі Google.
У 2015 році Google анонсував та запустив mobile-friendly. Цей алгоритм ставив питання: чи пропонує ваш сайт хороший користуватський інтерфейс на невеликому екрані?
Основні вимоги алгоритму mobile-friendly до веб-ресурсів:
- адаптивний дизайн. Незалежно від розміру екрана, користувач може спокійно переглядати сайт, картинки, текст і т.д. Коли існуючий сайт не може бути адаптований під мобільний пристрій, варіант рішення – окрема мобільна версія сайту, яку можна розмістити на субдомені. Такий сайт повинен мати власний HTML-код. Приклад чудового мобільного сайту:
Приклад того, як не треба робити:
- відсутність програм, які рідко зустрічаються на мобільних пристроях. Яскравим прикладом є Flash;
- клікабельність. Посилання повинні бути розміщені на такій відстані, щоб натискаючи на одне з них, користувач не зачіпав інші, що розміщені поруч.
Великі бренди, які постійно відвідують клієнти, створюють для зручності мобільні додатки. Наприклад, Rozetka, Joom, Amazon та інші:
У середині 2015 року більш ніж у 10 країнах світу (таких, як США, Японія, Австрія, Канада, Великобританія) мобільний трафік перевищив десктопний. А наприкінці цього року був запущений проект AMP – Accelerated Mobile Pages. Цей проект реалізовувався за підтримки партнерів Google із DNI. Digital News Initiative – проект для створення партнерських зв’язків між Google та видавцями в Європі, для підтримки високоякісної журналістики за допомогою технологій та інновацій.
“Інтернет-гігант завжди “хотів бути другом і партнером” новинної індустрії”, – сказав Карло Д’Асаро Біондо, президент EMEA зі стратегічних відносин.
DNI має три основні напрямки: розробка, дослідження та навчання, а також інноваційний фонд. Постійно розробляються продукти, що збільшують трафік, участь аудиторії та доходи. Наприклад, YouTube Player для видавців (скорочення складності та посилення контролю), Project Shield (захист сайтів новин від атак DDoS), AMP. Суть останнього проекту полягала в тому, що веб-сторінки та оголошення, опубліковані у форматі AMP з відкритим вихідним кодом, завантажувалися майже миттєво на мобільних пристроях.
4 листопада 2016 – анонсовано майбутній запуск mobile-first індексу. Mobile-first означає, що за умовчанням ранжуватиметься мобільна версія сторінок. Причиною цього введення є те, що більшість людей шукають інформацію в пошукових системах через мобільні пристрої.
Жовтень 2017 – розпочалося тестування mobile-first. За допомогою цього тесту Google не тільки аналізує, наскільки релевантна мобільна версія, але й створює нові класифікатори. Джон Мюллер пояснив, що ці внутрішні класифікатори призначені для виявлення наявності або відсутності десктопної та мобільної версії сторінки. Таким чином, можна побачити, чи є якісь спільні проблеми та які зміни потрібно внести.
З 10 січня 2017 року Google знижує в мобільній видачі сторінки сайтів, які зловживають міжсторінковою рекламою та спливаючими вікнами. Якщо ваш банер закриватиме основний контент, з’являтиметься відразу після прокрутки сторінки до кінця, розгортатиметься на весь екран і зникатиме лише завдяки штучному закриттю, то ви опинитеся у списку «заборонених».
Чи готовий ваш сайт до Mobile First?
Якщо ваш сайт використовує адаптивний дизайн та правильно реалізує динамічний показ, то ви можете не турбуватися. Решті варто прислухатися до кількох порад від Google:
- Мобільна версія сайту повинна містити якісний контент, який доступний з комп’ютера (текст, відео, зображення).
- Десктопна та мобільна версії сайту повинні використовувати однакову семантичну розмітку та структуровані дані.
- Тайтли і мета-описи мають бути рівнозначні в різних версіях сайту. Це означає, що мобільні заголовки можуть бути більш короткими, але інформація та основний посил мають бути однаковими.
- Сайти, які використовують окремі URL-адреси, повинні залишити існуючі атрибути rel=canonical і rel=alternate. Це стане орієнтиром для відображення релевантних результатів користувачам пошуку.
- Якщо використовується атрибут rel=hreflang, мобільний URL повинен вказувати на мобільну версію сайту, а десктопні на десктопні.
- Перевірте, щоб хост-сервери, на яких розміщений сайт з мобільною версією, розташованою на окремих сторінках, мали достатню потужність і змогли витримати потенційне підвищене навантаження при скануванні. До сайтів із адаптивним дизайном це не відноситься.
- Twitter Cards, OpenGraph та інші соціальні метадані повинні бути в обох версіях сторінки.
- Десктопна версія сайту індексуватиметься, навіть після появи та впровадження mobile-first.
- Після активного застосування індексу mobile-first прихований у вкладках і під посиланнями, такими як “Натисніть, щоб прочитати”, контент оброблятиметься аналогічно видимому за умовчанням.
Корисні сервіси
Варто звернути увагу на деякі важливі нюанси, які будуть враховуватися пошуковою системою при ранжуванні вашого сайту. Адже саме вони можуть стати причиною падіння сайту у видачі або навпаки залучити більше цільової аудиторії.
Google PageSpeed Insights
Перевірте, чи швидко завантажуються мобільні сторінки, адже швидкість впливає на зручність взаємодії з вашим сайтом. Чим довше завантажується сторінка, тим більше шансів, що її закриють. На графіку, взятому у колег з Promodo, ви можете побачити залежність між показником відмов і середнім числом переглядів від часу завантаження.
Для перевірки варто скористатися сервісом Google PageSpeed Insights.
Ви побачите швидкість завантаження сторінок як на мобільних пристроях, так і на комп’ютерах, а також отримайте рекомендації щодо її оптимізації. Варто врахувати, що необхідно протестувати різний тип сторінок, оскільки, наприклад, категорії можуть не мати помилок, а сторінки товарів – бути з помилками.
Панель розробника Google Chrome
Далі веб-сайт можна протестувати за допомогою браузера Google Chrome. Для цього натисніть «F12» або комбінацію «Ctrl+Shift+i». Відкриється панель розробника. Потім натисніть кнопку Toggle device toolbar (Ctrl + Shift + M) і перевіряйте відображення вашого сайту на різних пристроях.
Mobile-Friendly Test від Google
Для аналізу того, як виглядає ваш сайт на мобільних пристроях може допомогти сервіс Mobile-Friendly Test:
Сервіси оптимізації зображень
Зображення та інші елементи мають бути оптимізовані під мобільні пристрої. Немає певних правил, яким має бути зображення для мобільного пристрою. Найпростіше, що можна зробити – стиснути зображення. Існує безліч інструментів, які дозволять стиснути зображення без видимої втрати якості. Наведемо приклад найпопулярніших:
При виборі зображень рекомендується векторний формат, оскільки якість такої картинки не залежить від масштабу.
Видаліть XML-розмітку, оскільки вона може містити непотрібні метадані і налаштуйте стиснення GZIP для SVG-ресурсів.
Якщо у вас є растрові зображення, тоді видаліть непотрібні дані (відомості про камеру, дату, геодані тощо). Для цього можна скористатися відповідними утилітами: Jpegtran, Optipng, Pngcrush.
Коли на сторінці досить багато дрібних графічних елементів використовується CSS для завантаження зображень.
Google Search Console
Обов’язково на постійній основі відстежуйте помилки в Google Webmaster Tool. Зайшовши у вкладку «Пошуковий трафік», виберіть «Зручність перегляду на мобільних пристроях».
Далі перевірте в Google Search Console, як робот бачить ваш ресурс. У розділі “Подивитися як Googlebot” ви зможете побачити, як відображається ваш сайт на різних пристроях. Перед скануванням необхідно забезпечити доступ до всіх вбудованих ресурсів на вашому сайті. “Googlebot” допоможе зрозуміти, як відбувається сканування сторінок сайту.
Висновки
Mobile-first індекс – це мобільна революція та розпал великих змін, ігнорувати які ми не рекомендуємо. А як підготувати свій сайт до цих змін, постаралися розповісти у цьому матеріалі.
