Google проверка мобильной версии сайта за несколько секунд
Главная » Интернет и социальные сети
Автор Дмитрий Костин Просмотров 479 Опубликовано Обновлено
Доброго всем времени суток, мои друзья и гости моего блога. Сегодня у меня статья будет довольно короткая, но не теряющая своей актуальности в сегодняшний день. А именно хочу рассказать вам про такую вещь, как google проверка мобильной версии сайта. И может я бы даже не писал такую очевидную статью, если бы эта проверка недавно не поставила бы меня в тупик.
Проверка с помощью google
Раньше народ не заморачивался по поводу адаптивного дизайна или мобильной версии. Но потом, когда появилась информация о том, что поисковые системы будут понижать в выдаче сайты, не имеющие мобильную версию, то народ поднапрягся (как и в случае с HTTPS). Народ сразу стал заказывать мобильные версии у фрилансеров, некоторые ставили специальные плагины, которые могли работать криво.
И вот, когда кто-либо обзаводился адаптивной версткой или мобильной версией, то проверяли ее сразу на специальном сервисе гугла, который как раз смотрит, насколько ваша верстка соответствует требованиям. Сейчас интерфейс немного поменялся, но суть осталась прежней.
Чтобы проверить это дело у себя, вам нужно зайти на данный сервис — [urlspan]search.google.com/search-console/mobile-friendly[/urlspan]. После этого в строке URL введите адрес этого сайта и ждите. Через непродолжительное время вам выдастся вся информация о том, удовлетворяет ли ваш сайт требованиям гугла по мобильной верстке.
Что-то я не понял…
Я прекрасно знаю, что мой сайт адаптирован, тем более только недавно я подлатал верстку. Но недавно, ради прикола, я зашел на этот сервис, чтобы посмотреть, что скажет старина Гоша, и был сильно удивлен. Дело в том, что сервис выдал мне, что мой блог ни разу не адаптирован и плохо читаем для мобильных устройств.
Я никак не мог понять, в чем дело, поэтому полез искать решение в интернете.
И вот на одном сайте я его нашел. Оказывается всё дело было в файл robots.txt. У меня в нем черным по белому было написано, чтобы поисковики не индексировали файлы моей темы, поэтому он и не видел никакой мобильной версии.
После того, как я убрал одну строчку из роботса (Disallow: /wp-content/themes/моя тема), то сервис тут же определил, что моя мобильная версия в норме. Так что не переживайте, если вдруг у вас будет то же самое. Скорее всего вы просто не разрешили гуглу индексировать вашу тему.
Ну а на этом я пожалуй свою сегодняшнюю статью буду заканчивать. Надеюсь, она была для вас полезной. Как видите, google проверка мобильной версии сайта позволяет вам увидеть, насколько сайт подходит под его требования. Но на самом деле, уже редко встретишь сайт, который не имеет собственную мобильную версию или адаптивности. Пройдет еще немного времени, и все новые созданные сайты будут автоматически иметь SSL сертификат.
Спасибо вам за то, что читате меня. Я непременно буду снова ждать вас на страницах моего блога.
С уважением, Дмитрий Костин.
window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ renderTo: ‘yandex_rtb_R-A-188774-147’, blockId: ‘R-A-188774-147’ })})»+»ipt>»; cachedBlocksArray[108307] = «window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ renderTo: ‘yandex_rtb_R-A-188774-146’, blockId: ‘R-A-188774-146’ })})»+»ipt>»; cachedBlocksArray[185024] = «window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ renderTo: ‘yandex_rtb_R-A-188774-169’, blockId: ‘R-A-188774-169’ })})»+»ipt>»; cachedBlocksArray[119236] = «window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ renderTo: ‘yandex_rtb_R-A-188774-168’, blockId: ‘R-A-188774-168’ })})»+»ipt>»; cachedBlocksArray[132495] = «window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ renderTo: ‘yandex_rtb_R-A-188774-164’, blockId: ‘R-A-188774-164’ })})»+»ipt>»; cachedBlocksArray[119235] = «window.
Что такое AMP HTML и как проверить его внедрение
Использование мобильных устройств для выхода в интернет давно стало привычным делом: более половины запросов Google осуществляются именно со смартфонов. Главным приоритетом для пользователей и важным фактором ранжирования является скорость загрузки страниц.
В 2015 году Google представили формат страниц AMP HTML, который помогает уменьшить скорость их загрузки и облегчает работу разработчикам, так как при наличии AMP создание мобильной версии сайта становится необязательным.
В этом посте я расскажу, как внедрить AMP и проверить его правильность.
Что такое AMP HTML и для чего используется?
AMP (Accelerated Mobile Pages) HTML — технология ускорения мобильных страниц, которая позволяет создать их облегчённую версию, сохраняя лишь значимый контент. Для страниц в формате AMP HTML Google «урезает» 90% кода, за счёт чего вес страницы уменьшается, как и скорость загрузки. Это и является главным преимуществом AMP. Также благодаря внедрению AMP сайты получают следующие плюсы:
- увеличивается шанс попасть в «карусель» в топе мобильной выдачи;
- улучшается ранжирование;
- растёт мобильный трафик сайта.
Быстрой загрузке страниц также способствует предварительное кэширование на серверах Google. В мобильном поиске Google страницы с AMP-версиями помечены значком молнии.
В браузере AMP-версии выглядят так:
Кому нужно внедрять на своём сайте AMP HTML:
- издателям;
- рекламодателям;
- технологическим платформам (SSP, DSP, сервисы аналитики).
Требования к AMP HTML
Для применения технологии AMP необходимо учитывать следующие рекомендации:
- использование только асинхронных скриптов;
- размер изображений, рекламных баннеров и других визуальных элементов задаются в HTML-коде;
- размер стилей не превышает 50 КБ;
- произвольный JavaScript-код не применяется.
Google диктует следующие требования применения AMP:
- AMP-страницы должны соответствовать заявленным требованиям AMP Project.
- Контент на страницах AMP должен соответствовать контенту на полноценных версиях.
- URL AMP-страниц необходимо оптимизировать и делать понятными для посетителей.
- Для правильной работы страницы с технологией AMP необходимо проверять в сервисе AMP Validator.
- На AMP-версиях должны стоять атрибуты rel=canonical с ссылками на полноформатные версии. Пример ссылки на AMP-версию:
<link rel=”amphtml” href=”https://www.example.com/url/to/amp/document.
И с AMP-страницы должна стоять обратная ссылка:
<link rel=”canonical” href=”https://www.example.com/url/to/full/document.html”>
Как создать AMP-версию своего сайта
Создать AMP-версию каждой страницы можно вручную по готовым шаблонам или же настроить генерацию в системе управления контентом (CMS). Во многих CMS данная функция доступна «из коробки». На сайте AMP: Accelerated Mobile Pages Project вы можете ознакомиться с пошаговой инструкцией для создания страницы AMP HTML.
Следует отметить, что далеко не все страницы нуждаются в создании AMP-версии — в основном те, на которых размещён текстовый контент или новостные статьи.
Как проверить AMP-страницы
Способ 1
С помощью сервиса в Google Search Console. Для этого поместите URL в строку и нажмите «Проверить».
Дождитесь окончания анализа. Если на странице не внедрена технология AMP, вы увидите такое оповещение:
Если страница имеет AMP-версию, об этом сервис уведомит следующим сообщением:
Способ 2
С помощью краулера.
Мы покажем, как выполнить проверку с помощью Netpeak Spider. Программа даёт ссылки на AMP-версии страниц и определяет ошибку «Неправильный формат AMP HTML», если AMP-страницы не отвечают стандартам AMP Project.
Алгоритм проверки следующий. Отметьте пункт «AMP» в разделе «Параметры».
В адресную строку введите URL анализируемого сайта и нажмите «Старт».
По итогу сканирования перейдите к столбцу «AMP HTML» в таблице. Значение TRUE говорит о том, что у страницы есть AMP-версия, значение FALSE говорит об обратном.
Выгрузите отфильтрованные результаты, нажав «Экспорт» → «Результаты в текущей таблице» в главном меню программы или в правом верхнем углу окна, после чего передайте данные веб-разработчику.
Подводим итоги
На сегодняшний день адаптация страниц под мобильные устройства стала необходимостью для сайтов, которые хотят хорошо ранжироваться в выдаче. Одним из удобных методов оптимизации страниц под смартфоны является применение технологии AMP HTML, которая «облегчает» страницы, за счёт чего ускоряется их загрузка.
- Использование только асинхронных скриптов.
- Размер изображений, рекламных баннеров и других визуальных элементов задаются в HTML-коде.
- Размер стилей не может превышать 50 КБ.
- Произвольный JavaScript-код не применяется.
Для проверки правильности настроек отдельных страниц вы можете использовать сервис в Google Search Console. А с проверкой всех страниц сайта и поиском ошибок отлично справится краулер Netpeak Spider.
Результативное продвижение сайта в Днепре можно обсудить по контактам внизу страницы.
Сайт не оптимизирован для мобильных устройств? Вы можете попрощаться со своим рейтингом Google — Gist
Google внедряет индексацию «Mobile First» и как создать удобный для мобильных устройств сайт, который Google не ненавидит
В последние годы Google прилагает все больше и больше усилий, чтобы гарантировать, что все сайты являются мобильными.
Это имеет смысл, поскольку с 2009 года количество поисковых запросов с мобильных устройств постоянно растет, а в 2018 году они, наконец, превзошли поисковые запросы на настольных компьютерах. (Согласно отчету Statista)
Google Mobile Searchs
Google объявляет об индексации Mobile First26 марта 2018 года Google официально объявил, что будет использовать индексацию Mobile First. Это означает, что они будут индексировать веб-сайты на основе своей мобильной версии, а не версии для настольных компьютеров (как это делалось в прошлом). Это обновление появилось в то время, когда поиск с мобильных устройств становится большинством, а поиск с настольных компьютеров — меньшинством.
Google всегда стремился помочь как можно большему числу пользователей. Таким образом, с мощной тенденцией мобильного поиска они вынуждены адаптироваться к самым популярным средствам поиска.
Не повлияет ли сайт, оптимизированный для мобильных устройств, на мой рейтинг? С апреля 2015 года Google официально начал вознаграждать поисковый рейтинг сайтов, удобных для мобильных устройств, и наказывать сайты, не оптимизированные для мобильных устройств.
Исследование, проведенное Blue Corona (компания цифрового маркетинга), показало, что сайты, которые не перешли на мобильные платформы до обновления в 2015 году, получили значительный штраф за сокращение трафика на 50 %+. Это наказание наступило из-за того, что Google снизил свой рейтинг SEO, в результате чего меньше людей увидели и нажали на их сайт.
То же исследование показало, что в 2015 году 70% веб-сайтов на первой странице Google были оптимизированы для мобильных устройств. Из 70% мобильных устройств коэффициент конверсии, как правило, резко возрастал после перехода.
Одно из исследований компании HVAC в Аллентауне, штат Пенсильвания, показало, что через год после перехода на адаптивный мобильный сайт коэффициент конверсии вырос на 1750%. Несмотря на впечатляющий рост продаж, в эту статистику можно поверить, особенно для сайтов, привлекающих большую базу мобильных пользователей.
Что вообще означает «Для мобильных устройств»?Стоимость и преимущества сайтов, оптимизированных для мобильных устройств, очевидны, но что на самом деле означает быть «дружественными для мобильных устройств»? По данным Google, это означает, что ваш сайт:
- Не использует программное обеспечение, редко встречающееся на телефонах (например, Flash)
- Использует текст, который можно прочитать без увеличения.
- Автоматически настраивает содержимое веб-сайта, чтобы пользователи не т должны повернуть свой экран или увеличить.
- Размещает ссылки на достаточном расстоянии друг от друга, чтобы было легко щелкнуть нужную ссылку.
Если у вас есть веб-сайт и вы хотите проверить его на совместимость с мобильными устройствами, вы можете использовать Google «Тест на совместимость с мобильными устройствами». Если вам нужно внести изменения в свой веб-сайт, вы всегда можете установить адаптивную тему в WordPress или другой системе управления контентом.
Основываясь на блогах, которые публикует Google, мы можем с уверенностью предположить, что компании, которые не оптимизируют для мобильных устройств, увидят, что их рейтинг исчезнет. В то же время компании, которые на раннем этапе внедряют и используют преимущества мобильных сайтов, имеют и будут продолжать видеть более высокие рейтинги.
Как просматривать настольную версию любого сайта на мобильном телефоне
Сайты с дизайном, адаптированным для мобильных устройств, позволяют легко получить доступ к мобильной версии своих сайтов.
Почти все современные веб-сайты делают это.
Но иногда вам может понадобиться просмотреть или использовать настольную версию сайта. В таком случае, что вы можете сделать, особенно если ваш компьютер находится далеко?
К счастью, есть полезная настройка, позволяющая просматривать и получать доступ к исходной настольной версии любого веб-сайта на мобильном телефоне. В этой статье мы покажем вам, как перейти в режим рабочего стола при использовании предпочитаемого вами мобильного браузера на основе Chromium.
Как включить и отключить представление рабочего стола в браузере Chrome Mobile
Включение режима рабочего стола в мобильном браузере Chrome очень просто и может быть выполнено двумя способами. Вы можете установить вид рабочего стола по умолчанию для всех сайтов или для каждого сайта, который вы посещаете.
Как включить представление рабочего стола для всех сайтов в браузере Chrome Mobile
Чтобы сделать рабочий стол по умолчанию для всех сайтов:
- Откройте Chrome на своем телефоне.
- Нажмите кнопку с тремя точками в правом верхнем углу.
- Прокрутите вниз и нажмите Настройки .
- Прокрутите меню до самого конца и нажмите Desktop site .
- Теперь включите переключатель сайта Desktop , , и все готово.
Как включить представление рабочего стола для определенных сайтов в браузере Chrome Mobile
Вот как переключаться между мобильным и настольным представлениями в Chrome.
- Запустить Chrome.
- Перейдите на сайт, который вы хотите просмотреть в режиме рабочего стола.
- Нажмите кнопку меню с тремя точками в правом верхнем углу.
3 изображения
- Прокрутите меню вниз и коснитесь поля Desktop site .
Сайт перезагрузится в режиме рабочего стола.
Чтобы вернуться к мобильному представлению, просто снова нажмите кнопку меню с тремя точками и снимите флажок Desktop site . Мы рассмотрели, как использовать Google Chrome в качестве студента.
Как включить и отключить представление рабочего стола в браузере Edge Mobile
Вы также можете войти в режим рабочего стола в браузере Microsoft Edge. Вот как это делается:
- Запустите браузер Edge на своем телефоне.
- Нажмите кнопку меню с тремя точками в нижней части экрана.
- Нажмите Настройки .
- В опциях меню нажмите Общие .
3 изображения
- Нажмите Настройки отображения сайта .
- Выберите Показать рабочий стол по умолчанию . После выхода страница перезапустится, и вы сможете продолжить просмотр в режиме рабочего стола.
Чтобы вернуться к мобильному представлению, просто повторите шаги 1–5 выше и выберите Показать мобильный сайт по умолчанию .
Как включить и отключить представление рабочего стола в браузере Firefox Mobile
В настоящее время нет возможности включить представление рабочего стола для всех веб-сайтов в мобильном браузере Firefox. Чтобы вместо этого включить представление рабочего стола для определенного веб-сайта:
- Откройте Firefox на мобильном устройстве.
- На домашней странице Firefox или веб-сайте, который вы хотите просмотреть в режиме рабочего стола, нажмите кнопку с тремя точками в правом верхнем углу.
3 изображения
- Перейдите к пунктам меню и включите тумблер Desktop site . Сайт перезагрузится в режиме рабочего стола.
Чтобы вернуться к мобильному представлению, просто выполните описанные выше шаги в обратном порядке, и вы вернетесь к обычному виду.
Как включить и отключить представление рабочего стола на Brave Mobile
Если вы используете браузер Brave, вы также можете легко переключаться между мобильным и настольным представлениями.
Вы также можете сделать рабочий стол режимом просмотра по умолчанию.
Как включить представление рабочего стола для всех сайтов в Brave Mobile
Вот как установить вид рабочего стола по умолчанию для всех веб-сайтов:
- Запустите мобильный браузер Brave.
- Нажмите кнопку меню с тремя точками в правом нижнем углу.
- Нажмите Настройки .
- Прокрутите вниз и нажмите Настройки сайта .
- Прокрутите вниз и нажмите Desktop site .
- Включите переключатель сайта Desktop.
Как включить представление рабочего стола для определенных веб-сайтов на Brave Mobile
Чтобы включить представление рабочего стола для определенного сайта в Brave:
- Откройте браузер Brave на своем устройстве.
- Нажмите кнопку с тремя точками в правом нижнем углу экрана.
3 Изображения
- Перейдите к пунктам меню и установите флажок Desktop site . Сайт автоматически перезагрузится в режиме рабочего стола.
Сайт автоматически перезагрузится в режиме рабочего стола.Чтобы вернуться к мобильному представлению, просто выполните шаги, описанные выше, в обратном порядке. Мы рассмотрели причины перехода с Chrome на Brave.
Как включить и отключить представление рабочего стола на Vivaldi Mobile
Есть два способа включить режим рабочего стола в Vivaldi. Вы можете сделать это со стартовой страницы Vivaldi или с сайта, который вы хотите просматривать в режиме рабочего стола.
Как включить представление рабочего стола для всех сайтов в Vivaldi Mobile
Чтобы открыть Vivaldi в режиме рабочего стола со стартовой страницы:
- Откройте мобильный браузер Vivaldi.
- Если вы не попадаете на стартовую страницу по умолчанию, просто нажмите на значок Home . Вы попадете на домашнюю страницу Вивальди.
- Нажмите кнопку меню V в правом верхнем углу.
- В параметрах меню нажмите Настройки .
- Прокрутите вниз до раздела Веб-страницы и включите тумблер Всегда показывать рабочий стол .
Это установит вид рабочего стола в качестве настройки просмотра веб-сайта по умолчанию в Vivaldi.
Как включить режим рабочего стола для определенных веб-сайтов на Vivaldi Mobile
Если вы хотите просмотреть определенный веб-сайт на Vivaldi в режиме рабочего стола, сделайте следующее:
- Откройте Vivaldi на своем мобильном телефоне.
- Перейдите на конкретный веб-сайт, который вы хотите просмотреть в режиме рабочего стола.
- Нажмите кнопку меню V в правом верхнем углу.
- Прокрутите пункты меню вниз и установите флажок Desktop site . Сайт автоматически перезагрузится в десктопном режиме.
С помощью этой опции вы можете просматривать разные вкладки в разных режимах просмотра веб-сайта, некоторые в представлении для рабочего стола, а другие в представлении для мобильных устройств.
Независимо от выбранного вами метода, отключение режима рабочего стола — это один и тот же процесс. Это также быстро и легко. Для этого просто нажмите на кнопку меню V, прокрутите вниз и снимите Рабочий стол флажок.
Как включить и отключить представление рабочего стола в Opera Mobile
Также легко включить режим рабочего стола в браузере Opera. Как и Вивальди, вы можете сделать это двумя способами; либо через стартовую страницу, либо с любого веб-сайта.
Как включить представление рабочего стола для всех сайтов в Opera Mobile
Вот как включить представление рабочего стола для всех сайтов в Opera:
- Откройте Opera на мобильном устройстве.
- Нажмите на изображение профиля в правом нижнем углу экрана.
- Нажмите на значок шестеренки настроек .
- Прокрутите вниз до раздела Content и нажмите Агент пользователя по умолчанию .
- Выберите Рабочий стол .
После выхода все сайты по умолчанию будут отображаться в виде рабочего стола.
Как включить представление рабочего стола для определенных веб-сайтов в Opera Mobile
Чтобы включить представление рабочего стола для любого веб-сайта:
- Запустить Opera.
- Нажмите кнопку меню с тремя точками в правом верхнем углу.
- Прокрутите меню вниз и коснитесь переключателя Desktop site .
Чтобы вернуться к исходному мобильному представлению для любого из этих параметров, просто нажмите кнопку меню с тремя точками в правом верхнем углу и выключите переключатель Desktop site .
Наслаждайтесь любым видом, в любом месте, в любое время
Благодаря этим знаниям вы теперь можете легко переключаться между мобильным и настольным режимами во время просмотра любимых веб-сайтов. Все описанные выше способы работают для Android и iOS, где доступны соответствующие браузеры.