Тут така справа, Гугл скоро (за чутками - з 21 квітня 2015) почне дуже погано ранжувати сайти, які не пройшли перевірку в Google Webmasters на зручність перегляду на мобільних пристроївах.
Точно не зрозуміло, проблеми у сайту будуть тільки якщо він показується мобільним користувачам, або навіть тим, хто зайшов з ПК, тобто буде роздільна видача?
Суті це майже не змінює для сайтів у яких половина, або істотна частина, мобільного трафіку. Тому краще максимально швидко пройти перевірку.
Розповім як зробити так:
| до | після |
|---|---|
 |  |
- перша фішка, Яка допомогла вирішити питання без додаткових рухів тіла.
- другий момент, Якщо бачимо повідомлення «Інтерактивні елементи розташовані дуже близько один від одного». Показується в google.com/webmasters/tools/mobile-friendly.
Просто в стилях потрібного класу прописує побільше відступи для посилань і кнопок. Вистачає margin або padding від 5px.Іноді блок Adsense може створювати таку проблему. Можливо потрібно вставити блок побільше, або зі шрифтом побільше.
В robots.txt пропишіть рядок:
Allow: /wp-content/themes/Імя_Шаблона/style.css(Якщо файл зі стилями знаходиться за іншою адресою, то прописуємо його. Якщо файлів зі стилями кілька, то встромляємо рядки для кожного файлу.)
P.S. Спочатку я розраховую, що первинна була вами зроблена.
Добрий день друзі. Сьогодні я трохи відійду в сторону від рекламних інструментів і почну нову рубрику на блозі. Вона отримує назву «Вебмастерінг» і включатиме корисні матеріали на тему поліпшення прізводітельності і якості сайту, посадочних сторінок. А почну з огляду класного інструменту для перевірки сайту на мобільність.
Перевіряємо швидкість сайту разом з Google
Для цього гугл пропонує 2 інструменту.
# 1 PageSpeed Insights
Я думаю, ви добре з ним знайомі. Вставляєте посилання на свій сайт, тиснете кнопку «Аналізувати» і отримуєте результат у вигляді двох вкладок.
Вкладка «Для мобільних» включає звіт по швидкості завантаження сайту для мобільних пристроїв і - важливо! - оцінку зручностісайту для смартфонів. Вкладка «Для комп'ютерів» відповідно той же аналіз для робочого столу.
Найприємніше, що сервіс дозволяє завантажити оптимізованізображення, css і скрипти, щоб використовувати їх на своєму сайті. Ось така безкоштовна допомогавід Google.
Як видно з скріншоту, у мене серйозні проблеми з мобільною версією. А як йдуть справи у Вас?
# 2 Testmysite.Withgoogle
Насправді це той самий інструмент, просто обгортка у нього гарна. Я виявив цей сервіс днями і мене підкупила форма надання звіту.
Коли ви вставите посилання на сайт і натиснете «Перевірити», сервіс запропонує результат у вигляді повноцінного динамічного Лендінзі, на якому ємко і переконливо розповість, як йдуть справи з сайтом, і запропонує завантажити повний звіт.
Зрозуміло, я попросив повний звіт і через пару хвилин отримав його на пошту. Виглядає він толково, кілька екранів корисних інструкцій з посиланнями на конкретні матеріали:
Примітно, що якщо аналізувати один і той же сайт, то цифри за цими інструментами будуть трохи відрізнятися. Однак працюють вони на одній технології.
Ось так буквально за кілька секунд можна не тільки перевірити сайт на мобільність і перевірити швидкість завантаження - але і завантажити повноцінний звіт з оптимізованим контентом. Безкоштовно. від Google
Ну що, а як у вас справи з мобільністю?
Для своїх проектів ви, напевно, давно помітили, що кількість мобільних користувачівпостійно росте. У кого-то тенденція менш помітна, а на деяких проектах за кожен рік ця цифра збільшується в 2 рази і більше. За даними LiveInternet, в Рунеті зараз більше 50% трафіку припадає на мобільні пристрої. До речі, багато читачів цього блогу вже давно скаржаться, що тут немає мобільної версії 🙂 що буде, звичайно, виправлено в найближчому майбутньому.
Цей факт мобілізації не може ігноруватися і пошуковими платформами. Поступово вони дають переваги в мобільному пошуку тим сайтам, які адаптовані під пристрої користувачів.
Спочатку Google давав сайтам позначку в сниппета, що вони будуть коректно відображатися на мобільниках.
Також Google створив інструмент в допомогу веб-майстрам для перевірки коректності відображення сайту на мобільних пристроях:
https://www.google.com/webmasters/tools/mobile-friendly/
З 21 квітня Google запустив новий алгоритм, на заході його назвали Mobilegeddon. Тепер успішне проходження тесту на Mobile Friendly є одним з seo-факторів, що враховується гуглом. Поки що сильних змін у видачі не спостерігалося, але готуватися можна вже зараз.
Як же зробити сайт адаптивним з точки зору гугла? Секрет простий - потрібно поставити задачу вашим програмістам / верстальщикам. Ну а якщо немає часу чекати, то ... можна використовувати MobileCheat 🙂
Насправді це неперевірена технологія, невідомо до чого призведе в подальшому, тому використовувати тільки на свій страх і ризик. Як мінімум серію тестів можна тут провести.
Як обійти тест Google за допомогою MobileCheat
Необхідно зробити лише дві речі:
1. Додати в код мета-тег viewport.
2. Закрити роботу доступ до CSS-файл або папці, де вони лежать через robots.txt
Наприклад, так мій блог проходить тест за замовчуванням:
При закритті CSS картина змінюється:
Начебто на сайті нічого не змінилося, але результати тесту зовсім інші. До речі, на деяких сайтах сам люблю відключати CSS, щоб їх було зручніше переглядати і використовувати 🙂 тому, цілком оправаданная схема. Але представлена лише в ознайомлювальних цілях.
А що ви думаєте з цього приводу? Чи буде це Google розраховувати як у відповідь хід конем або він продумав все наперед і відразу поставить сайту шах і мат? 🙂
Вітаю вас, дорогі друзі!
Мобільні гаджети заполонили світ. Без телефону сьогодні навіть за хлібом не ходять.
В наш час Інтернет стрімко розвивається. Швидке зростання ринку мобільного Інтернетузмушує творців веб-ресурсів адаптувати свої сайти під даний типпристроїв.
Я веду до того, що якщо ви хочете, щоб ваш сайт був успішним і користувався популярністю, то слід подумати про те, як зробити його зручним для перегляду на всіляких гаджетах.
У даній статті я розповім вам, як перевірити сайт на мобільних пристроях за допомогою спеціальних сервісів. Я умовно розділив їх на дві групи: безкоштовні і платні.
Всі вони працюють практично за одним і тим же принципом:
- заходите на сайт розробника того чи іншого сервісу
- завантажуєте потрібне ПО
- запускаєте додаток
- і через деякий час мобільна версія вашого веб-сайту перед вами!
Існують сервіси, які можуть здійснити тестування вашого сайту в режимі онлайн.
Вибір, як завжди, за вами!
Безкоштовні
Mobile Friendly. Цей додаток створено компанією Гугл спеціально для того, щоб перевірити оптимізований веб-ресурс під смартфони та інші гаджети.
Responsinator. завдяки даному додаткуви легко зможете побачити, як виглядає сайт на Kindle, iPad, Android, iPhone.
Ipad Peek. Один з найбільш популярних безкоштовних інструментів тестування, за допомогою якого можна бачити відображення власного веб-сайту на айфоне і Айпад.
Opera Mini Simulator. Емулятор від компанії Opera містить вельми велику базумобільних гаджетів. Єдиним його недоліком можна вважати відсутність режиму онлайн, тобто для тестування вашого ресурсу вам доведеться завантажити і встановити потрібне ПЗ.
Gomez. Оцінює сумісність вашого ресурсу з мобільними пристроями по 30 параметрам, що дозволяє отримати найбільш повну оцінку. Для безкоштовного використання слід ввести свої контактні дані.
MobiReady. Відмінний інструмент для тестування, який оцінює адаптивність дизайну. Перевірка заснована на кращих стандартах W3C (Консорціуму Всесвітньої павутини).
Mobile Phone Emulator і Screenfly. Схожі сервіси, які теж дають можливість переглядати стан веб-ресурсу на екранах будь-яких гаджетів.
Платні
CrossBrowserTesting. Перевіряє на 130 різних браузерахі 25 операционках, включаючи: Blackberry, Android, iPad, iPhone. За його використання вам треба буде щомісяця платити по 29.95 $.
BrowserStack. забезпечує швидкий доступдо величезної бази. Варто до 19 $ за один місяць, але є і безкоштовна версія.
Browshot. Призначений для зняття з Android, iPad, iPhone. За п'ять скріншотів вам доведеться заплатити 1 долар.
Perfecto Mobile. Дає доступ до бази планшетів і стільникових телефонів, Що дозволяє вам бачити, наскільки якісна оптимізація на кожному типі пристроїв. За його використання потрібно платити до 15 доларів за добу.
Multi-Browser Viewer. Крос-браузерні додаток, що містить мобільні емулятори і браузери для проведення тестування в будь-якому форматі. Варто до 140 доларів, є і безкоштовна демо-версія.
DeviceAnywhere. Прекрасний інструмент, що дає можливість точково перевіряти веб-контент, тестуючи ресурс в реальному часі. Може бути як платним (по 100 доларів на місяць), так і безкоштовним.
Як бачите, програм і сервісів дуже багато, вибирайте найбільш зручний варіанті користуйтеся на здоров'я.
Мобільна версія для пошукових систем
Іноді сайт відмінно відображається на всіх мобільних пристроях, але пошуковики google і яндекс не визнають його мобільність. Просто у яндекса і google є ще додаткові вимоги до мобільної версії.
Перевірити адаптацію мобільної версії під гугл можна за допомогою сервісу Mobile Friendly. Його я вже згадував в списку безкоштовних інструментів.
А для яндекса є схожий інструмент в поки що тестується версії кабінету для вебмайстрів (https://beta.webmaster.yandex.ru/).
Підписуйтесь на новини блогу і ви ще багато цікавого і корисного дізнаєтеся. А поки прощаюся з вами, до зустрічі в новій статті!
З повагою! Абдуллін Руслан
Версії сайту - це не тільки можлива примха розробників, додаткова стаття витрат (або заробітку, якщо говорити про підрядників) і прояв турботи про відвідувачів ресурсу. Згідно з останніми заявами представників корпорації Google, сайти, які не відповідають вимогам адаптивного дизайну, будуть пессімізіровани в пошуку, що здійснюватиметься з мобільних пристроїв. Вітчизняна пошукова система Яндекс також випустила рекомендації "Як важливо бути мобільним" і запевнила, що, діючи заради зручності користувачів мобільних пристроїв, буде маркувати в пошуковій видачі мобільні версії і віддавати перевагу адаптивним сторінок.
Так, розробникам в обов'язковому порядкунеобхідно адаптувати сайти для смартфонів і перевіряти справність відображення ресурсу. В іншому випадку незабаром можна очікувати втрату значної частини трафіку, а значить, і потенційних клієнтів, адже нові алгоритми роботи від Google і "Яндекс" вже діють. перевірити мобільну версіюсайту можна різними способами: Зміною браузера при переході в режим розробника, за допомогою емуляторів мобільних пристроїв або веб-сервісів.
Дружелюбність сайту мобільних пристроїв
Адаптивність до мобільних пристроїв оцінюється за різними параметрами. Важливо перевірити мобільну версію сайту не тільки в плані коректного відображення, варто врахувати й інші фактори:
- відсутність анімації, "важкого" дизайну і картинок;
- швидкість завантаження ресурсу (повинна бути мінімальною);
- відсутність необхідності горизонтального прокручування;
- відсутність Silverlight-плагінів і Java-аплетів;
- проста навігація по сайту;
- в коді прописаний мета-тег viewport.
Якщо перераховані умови виконані, алгоритми найбільш поширених пошукових систем розпізнають веб-сторінку як придатну для мобільних пристроїв і підвищують позицію сайту у видачі по відношенню до ресурсів, які не адаптовані.
Реальне тестування на мобільних пристроях
Найзручніше протестувати мобільну версію сайту на реальних смартфонах. Даний спосіб дозволить провести випробування в реальних умовах. В ідеалі перевіряти веб-ресурс краще на декількох пристроях, але якщо бюджет проекту не передбачає витрати на придбання декількох смартфонів найбільш популярних моделей, досить буде і пристрої на базі Android або Apple.
Зміна розмірів вікна браузера
Найпростішим, але не оптимальним в плані перевірки, є зміна розмірів вікна браузера. Якщо сторінка зроблена за допомогою застосування технології перевірити мобільну версію сайту таким чином можна. Але ось в тих випадках, коли застосований окремий дизайн, ресурс потребує ясному вказівці того, що користувач прийшов зі смартфона, планшета або іншого мобільного пристрою. так, даний спосібдозволяє перевірити наявність мобільної версії сайту. А ось коректність відображення (в технічному плані) оцінити навряд чи вдасться.
Перехід в режим розробника в браузері
Більш оптимальний спосіб перевірити мобільну версію сайту (Google або "Яндекс", як втім і інші пошукові системивиділяють адаптивність в списку найважливіших факторів, що впливають на ранжування) - це перейти в режим розробника в браузері. Спосіб працює подібним чином з декількома браузерами:
- Mozilla: перейти в режим розробника можна, вибравши опцію "Адаптивний дизайн" в меню "Розробка"; натиснувши комбінацію Ctrl+ Shift + M; якшо по кнопці "Режим адаптивного дизайну" на панелі інструментів веб-розробника;
- Chrome: перехід в мобільний режимздійснюється натисканням F12, потім слід вибрати значок мобільної версії (смартфон в лівому верхньому кутку вікна, що з'явилося).
В Opera перехід в режим розробника для перевірки мобільної версії здійснюється натисканням комбінації Ctrl + Shift + i, але є й інший спосіб. Спеціальна версія браузера - Opera Mobile Classic Emulator - дозволяє різнобічно оцінити мобільний дизайн. Версії програми існують для основних операційних систем.
Емулятори мобільних пристроїв: Android Studio і Apple Xcode
Перевірити мобільну версію сайту ( "Яндекс" і Google) можна за допомогою емуляторів мобільних пристроїв, якими для Android і Apple є відповідно Android Studio або Apple Xcode.
Подібні інструменти досить точно відтворюють сайт в тому вигляді, як він буде виглядати на мобільних пристроях: в програмах встановлені найпоширеніші версії браузерів для мобільних пристроїв. Однак емулятори не враховують швидкість завантаження і деякі інші нюанси, спостерігати які можна в реальних умовах.
Для перевірки досить встановити одну з перерахованих вище програм на комп'ютер і відкрити сайт з емулятора.
Веб-сервіси перевірки мобільного дизайну
Існують і більш прості способиперевірити мобільну версію сайту. Наприклад, онлайн-сервіс Responsinator дозволяє оцінити коректність відображення ресурсу на мобільних пристроях і зручність користування сайтом з боку користувача. Ресурс відображає сайт в тому вигляді, як він виглядав би на шести різних пристрояхна базі Android або Apple і в декількох орієнтаціях.
Перевірка оптимізації веб-сторінок для мобільних пристроїв
Інші ресурси, що дозволяють перевірити мобільну версію сайту, додатково оцінюють адаптивність, а не тільки показують, як виглядала б майданчик на різних пристроях. Найавторитетніші сервіси: Google Mobile Friendly і "Яндекс вебмайстрів" (перевірка веб-сторінок). Оцінюють оптимізацію сайту для мобільних пристроїв також засіб перевірки Bing або, наприклад, Mobile Checker від W3C.
Все що потрібно від веб-майстри при оцінці версії сайту для мобільних пристроїв за допомогою онлайн-сервісів, так це ввести адресу ресурсу і дочекатися закінчення аналізу. Більшість вищевказаних сервісів перевіряють оптимізацію за параметрами доброзичливості до мобільних пристроїв, які були перераховані вище.
Отже, оцінити адаптивність веб-ресурсу можна кількома способами: починаючи від тестування на реальних смартфонах, планшетах або інших мобільних пристроях або зміни розмірів вікна веб-браузера, перевірки в емуляторах або в режимі розробника веб-браузерів і закінчуючи використанням сервісів від "Яндекс" і "Гугл". Перевірити мобільну версію сайту всебічно дуже просто, а це дозволить внести необхідні правки і поліпшити позиції сайту в пошуковій видачі.