- Навіщо оптимізувати мобільну версію сайту?
- Налаштуйте збір статистики і моніторинг позицій сайту
- Дайте зрозуміти пошуковим системам, що у вашого сайту є мобільна версія
- Налаштуйте індексацію мобільного сайту
- Перевірте мобільну версію сервісами пошукових систем
- Переконайтеся, що мобільна версія «легка» і швидка
- Зробіть сайт релевантним цільовим запитам
Наша команда-партнер Artmisto
У цій статті ми розповімо, як оптимізувати для пошуку мобільну версію сайту на окремому домені, наприклад, m.site.ru, що важливо врахувати для коректної індексації та ранжирування вашого мобільного сайту в пошуку і як уникнути поширених помилок.
Навіщо оптимізувати мобільну версію сайту?
Частка мобільного трафіку вже не перший рік перевищує частку трафіку з комп'ютерів:
- У травні 2015 року Google оголосив , Що в 10 країнах світу, включаючи США і Японію, частіше користуються його пошуком на мобільних, ніж на комп'ютерах.
- згідно дослідженню Яндекса, опублікованому навесні 2016 року, більше 50% його аудиторії використовує мобільні пристрої поряд з комп'ютерами, а майже 20% виходить в інтернет тільки з мобільних пристроїв.
Відповідно до цієї тенденцією змінюються алгоритми ранжирування:
- У квітні 2015 року Google почав викочувати по всьому світу апдейт алгоритму , Який враховує оптимізацію сайтів під мобільні пристрої при ранжируванні результатів в мобільному пошуку.
- Слідом за ним в лютому 2016 року Яндекс анонсував алгоритм ранжирування « Владивосток », Що враховує придатність сайту для мобільних пристроїв.
- У листопаді 2016 Google у своєму блозі для вебмайстрів опублікував запис про те, що починає тестування mobile-first індексу:
«Наші алгоритми в кінцевому підсумку будуть в основному використовувати мобільну версію контенту сайту для ранжирування сторінок з цього сайту, для розуміння структурованих даних і відображення фрагментів в наших результатах пошуку».
Мобільна версія сайту повинна бути оптимізована під цільові запити. Інакше ви можете втратити трафік з пошуку.
Налаштуйте збір статистики і моніторинг позицій сайту
Рекомендуємо встановити на мобільну версію сайту ті ж системи статистки (той же код лічильників), що і на десктопну версію. Якщо ви поставите на дві версії сайту різні коди лічильників Google Analytics і Яндекс.Метрики - отримаєте некоректні дані, тому що частина відвідувачів у вас буде порахована двічі.
Зареєструйте обидві версії сайту в Яндекс.Вебмастере і Google Search Console . Переконайтеся, що сервіси не видають помилок при скануванні і індексації мобільного сайту.
Відстежувати позиції сайту в мобільній видачі Яндекса вміє сервіс Топвізор .
Дайте зрозуміти пошуковим системам, що у вашого сайту є мобільна версія
У тезі <head> кожної сторінки основної версії сайту повинна містити посилання на відповідну їй сторінку мобільної версії. приклад:
<Link rel = "alternate" media = "only screen and (max-width: 640px)"
href = "http://m.site.ru/page/" />
Для Яндекса цього достатньо. Google ще рекомендує додати в тег <head> мобільних сторінок тег <link rel = "canonical">, який вказує на десктопну версію (Яндекс не враховує межхостовий canonical):
<Link rel = "canonical" href = "http://www.site.ru/page/" />
Важливо: ви пов'язуєте цими тегами конкретні сторінки, а не один сайт з іншим сайтом цілком. Не потрібно вказувати на всьому сайті посилання на головну сторінку мобільної версії, а в атрибуті canonical на всіх сторінках мобільної версії прописувати головну сторінку основного сайту. Це помилка! Кожній сторінці основного сайту повинна відповідати тільки одна мобільна, і навпаки.
Динаміка видимості мобільного сайту після «зв'язування» його з основною версією
Налаштуйте індексацію мобільного сайту
Мобільна версія на піддомені - це окремий сайт зі своїм robots.txt і своєї XML-картою сайту.
важливо:
- Чи не закривайте мобільну версію від індексації в robots.txt.
- У директиві "Host" файлу robots.txt мобільної версії вкажіть адресу саме мобільної версії, а не основного сайту.
- Чи не закривайте від індексації файли CSS, JavaScript, шрифти і зображення. Вони використовуються пошуковими системами для рендеринга сторінок сайту і оцінки їх придатності для мобільних пристроїв.
- Створіть файл з XML-картою мобільного сайту, вкажіть посилання на нього в robots.txt мобільного сайту і додайте в сервіси для вебмайстрів Яндекса і Google. Оновлюйте файл при створенні нових сторінок.
Перевірте мобільну версію сервісами пошукових систем
Ми не будемо детально розглядати, ніж повинна відрізнятися мобільна версія від деськтопной з точки зору дизайну і юзабіліті. Припускаємо, що ваші дизайнери вже зробили свою роботу. Що необхідно врахувати:
- Повинен бути зазначений тег <viewport>.
- Не повинно бути горизонтальної прокрутки.
- На мобільній версії не повинно бути Flash, Java (не плутайте з JavaScript) і Silverlight.
- Текст повинен зручно читатися з мобільних. Яндекс вимагає, щоб розмір шрифту був не менше 12px.
Настійно рекомендуємо уникати popup-елементів - спливаючих вікон, які закривають основний контент сторінки. Якщо ви все-таки вирішили залишити їх на мобільному сайті, обов'язково переконайтеся, що їх легко закрити.
Всю необхідну інформацію помістіть прямо на сайті і не змушуйте користувача завантажувати файли (прайс-листи в Excel, інструкції в PDF, відео і т.п.) - на смартфоні це робити незручно і у користувача може не бути необхідного додатку для відкриття вашого файлу.
Інструменти перевірки:
Зверніть увагу, що інструменти перевіряють не весь сайт, а одну конкретну сторінку. Тому перевіряйте всі основні шаблони. Наприклад, якщо у вас інтернет-магазин, то як мінімум варто перевірити головну, сторінку категорії, картку товару, контакти та інформацію про доставку.
Перевірка мобільних сторінок в Яндекс.Вебмастере
Перевірка оптимізації для мобільних від Google
Але навіть якщо Яндекс і Google не показали помилок, це не означає, що на реальних мобільних пристроях теж буде все в порядку. Необхідно перевірити основні шаблони сторінок як мінімум на iPhone і смартфоні під управлінням Android. Переконайтеся, що працюють всі форми (зворотний зв'язок, заявка на послугу, підписка на розсилку і т.д.) і не виникає проблем в процесі оформлення замовлення.
Переконайтеся, що мобільна версія «легка» і швидка
На жаль, не завжди і не скрізь доступний швидкий мобільний інтернет або Wi-Fi. Тому для мобільного сайту особливо важливо, щоб він швидко завантажувався і працював.
Перевірте свій сайт наступними сервісами:
- Google PageSpeed Insights - дає поради щодо оптимізації швидкості завантаження (стиску зображень, налаштуванні кешування і т.д.);
- Pingdom Website Speed Test - дозволяє оцінити швидкість відповіді сервера, скільки «важать» сторінки в мегабайтах (з урахуванням всіх скриптів і зображень) і які ресурси вантажаться найдовше.
Зробіть сайт релевантним цільовим запитам
В цілому основні методи оптимізації ті ж, що і для звичайного сайту:
- використовуйте ЧПУ - URL, що складаються зі слів, зрозумілих як користувачам сайту, так і пошуковим машинам.
- Теги <title> повинні відповідати змісту сторінок і вашим ключовим словам.
- На всіх сторінках повинні бути заповнені теги <meta name = "description">. Помістіть в тег привабливе для потенційного клієнта опис конкретної сторінки, а не сайту в цілому.
- Виділіть основний заголовок на сторінці тегом <h1>. Рекомендуємо не використовувати цей тег ні для чого іншого.
- Впровадити відповідну для вашого контенту мікророзмітки .
- Обов'язково вкажіть контактну інформацію - адресу, телефон, годинник роботи. Додайте карту проїзду.
- Тексти сторінок повинні відповідати цільовим запитам. Але враховуйте, що на екрані смартфона мало місця. Не лийте воду, позбудьтеся від усього зайвого, залиште тільки найголовніше.
Враховуйте, що в мобільному пошуку розстановка сил відрізняється від комп'ютерів - зі смартфонів пошук Google призводить значно більше трафіку (59,6%, по даними Яндекс.Метрики в липні 2017 року), ніж Яндекс (39,2%). На мобільному сайті не варто нехтувати елементами оптимізації, які працюють в Google, але не працюють в Яндексі. Зокрема, мікророзмітки.
Частка Яндекса і Google в мобільному пошуку - за даними Яндекс.Метрики
Після впровадження оптимізації і переиндексации сайту перевірте, як виглядає ваш сайт в пошуку. При необхідності скорегуйте елементи, які потрапляють в сниппет.
Пам'ятайте, що оптимізований мобільний сайт - ваше конкурентну перевагу. Не відкладайте оптимізацію мобільної версії (далі вже нікуди). Не втрачайте трафік і прибуток!
Навіщо оптимізувати мобільну версію сайту?Навіщо оптимізувати мобільну версію сайту?