Як готувати контент для сайту?
22.09.2018

Як досягти успіху в mobile-first index?

На сьогоднішній день впровадження нових технологій пошуковими гігантами часто залишається непоміченим навіть для досвідчених власників сайту. Тим не менш, звістка про перехід на mobile-first index модель точно не буде новиною навіть для тих, хто не має прямого відношення до створення сайтів . З моменту появи перших повідомлень про подібний хід з боку Гугл серед майстрів виникло чимало суперечок, оскільки кожен мав свою точку зору щодо необхідності та актуальності такого кроку.

Анонс переходу відбувся у 2016 році, коли компанія Google запустила тестування моделі. Але вже сьогодні вона на повну силу використовується при складанні сторінок видачі. Багато експертів зазначають, що таке рішення було лише питанням часу. З цієї причини уважні власники ресурсів вирішили створити мобільні версії, щоб не залишитися біля розбитого корита після впровадження нового алгоритму. Але під уважними не мається на увазі більшість.

Підхід для того, щоб відповідати новій моделі ранжиру, кожен вибирав самостійно. Так і з’явилося безліч мобільних версій, для яких використовувався піддомен. Чому ці користувачі вважали, що подібний підхід у цій ситуації кращий за інші, залишається загадкою. Щоб позбавитися міфів та основних питань, що виникають у власників сайтів після впровадження mobile-first index, ми підготували цю статтю.

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

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

Що таке mobile-first index?

Перше, про що не слід забувати, це унітарний підхід компанії Google до всіх сайтів. Пошуковик не займається створенням окремого індексу для користувачів мобільних пристроїв. Індекс є одним для всіх користувачів. Змінюється тільки користувач, який більше не буде робочим, а стане мобільним. Нагадаємо, що раніше при використанні мобільного девайсу користувачеві демонстрували результати пошуку з відповідного індексу. Якщо він користувався ПК, те й видача вибудовувалася з урахуванням десктопних результатів.

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

Як увійти до мобільного індексу?

Responsive Web Design

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

На сьогоднішній день існує кілька доменів, для адаптації яких користувалися динамічним показом. Більшість сайтів, які відповідають новому пошуковому алгоритму, були створені з використанням адаптивного дизайну. Сама компанія Google рекомендує майстрам даний метод. Також є чимало прикладів сайтів, що ґрунтуються на піддоміні, про що ми говорили вище. Динамічний показ – велика рідкість, тому розглядати його немає великого сенсу, а два інші варіанти оптимізації варто вивчити детальніше.

Нюанси адаптивного дизайну

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

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

Все це змушує багатьох власників переходити на адаптивний дизайн, а не використовувати інші варіанти оптимізації.

Мобільна версія інтернет-сайту

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

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

Чому віддати перевагу?

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

Щоб відповідати поточним вимогам нового алгоритму, власник сайту має подбати про створення мобільної версії або провести адаптивну верстку. Без цього закріпитись у топі буде практично неможливо. На місце в ранжирі впливає і те, як швидко сайт завантажується. Для перевірки швидкості можна використовувати Google Analytics, у якому є відповідний інструмент. Проте, лише з його результати орієнтуватися годі було.

UsabilityЯк зробити юзабіліті правильним?

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

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

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

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

Тим не менш, багато хто залишається прихильниками мобільних версій, тому для них є кілька додаткових вимог. Для початку слід перевірити наявність тега rel=”alternate”, який слідуватиме на відповідну сторінку. Цей тег дозволить роботу знаходити контент, який пройшов оптимізацію для користувачів смартфонів. Також слід використовувати тег rel=”canonical”, у якому вказується посилання на сторінку звичайної версії сайту. Для ресурсу на піддомі слід використовувати такий самий контент, що і для основної версії сайту.

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

Що таке AMP?

Ця технологія сьогодні застосовується для того, щоб підвищити швидкість завантаження сторінок. Вона використовується не тільки пошуковою системою Google, але й рядом інших:

  • Baidu;
  • Twitter;
  • Pinterest.

mobile-first-indexЯкщо ж розглядатиме саме Google, то перехід на застосування AMP відкриває можливість отримати більш високу позицію в ранжирі, а також забезпечити моментальне завантаження ресурсу. Прискорення відбувається завдяки тому, що відомості перенесені до Google і їхнє завантаження на сайт відбувається безпосередньо звідти. До того ж для таких сторінок застосовується докорена версія HTML, що дозволяє суттєво полегшити ресурс. Якщо порівнювати ранжування сторінок з AMP і без даної технології, останні виявляться нижче.

Розмітку для цієї технології слід проводити в JSON-LD. Вона включає зображення для попереднього перегляду з описом і датою створення сторінки. Щоб уникнути дублювання, у подібних сторінках слід скористатися тегом rel=”canonical”. Щоб перевірити видимість нової версії, достатньо відвідати Webmaster Tool і вибрати відповідний розділ пристроїв. Після завершення сканування отримуємо цікаву інформацію. Така процедура виконується всім сторінок ресурсу.

Резюмуючи викладене вище

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

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