Оптимизация сайта под мобильные устройства в 2017 году

Для мобильности любого сайта важна простота и комфортность пользователя при просмотре. Результаты поиска зачастую адаптированы и привязаны к месту, где находится сам пользователь. Из-за этого мобильный трафик называют региональным. Стоит отметить, что поиск обычный от мобильного отличается частотой запросов. При мобильном варианте запросы собираются отдельно. Отсюда следует, что и семантическое ядро также отличается от стандартного вида поиска информации. Проверить мобильную версию можно при помощи: Яндекс.Вебмастер, Google Webmaster Tools.

Как проверяется скорость загрузки мобильного сайта?

Для проверки скорости сайта необходимо воспользоваться такими инструментами:

Page Speed Insights – это основной метод, проверяющий не только корректность требований по отношению к пользователю, но и предоставляющий всю необходимую информацию для преобразования обычного варианта в мобильный.

pingdom.com - дает оценку скорости загрузки страниц из разных мест и регионов, дает подсказки и рекомендации по оптимизации ресурса.

Другие способы проверки мобильности сайта:

Fetch and Render. (он же Google-бот) помогает просмотреть сайт с помощью робота и увидеть результат мобильности ресурса со стороны системы поиска Google.
Google Mobile-Friendly Tools – сервис, позволяющий проверить мобильную пригодность вашей страницы. Также, используя его, можно увидеть и проанализировать дизайнерское оформление сайта, скорость загрузки и отображения информации.
W3 mobile checker – специальный инструмент, созданный в помощь разработчикам при усовершенствовании ресурса по требованиям мобильного типа.
Resizer – инструмент, который помогает проанализировать и проверить контент на любых устройствах.
Quirktools – это сервис, с помощью которого просматривается сайт на всех устройствах.

Методы и способы мобильной оптимизации

1. Мобильная версия сайта. Мобильная версия дает возможность изменять как код, так и URL в отдельности для оборудования. Изначально сервис определяет вид устройства, а после направляет на специальную страницу, которая работает с данным оборудованием. Преимущество в такой версии заключаются в том, что можно с лёгкостью внести правки, при этом, не изменяя основной сайт. Любая информация на мобильном сайте быстро загружается. Разобраться пользователю всегда просто, а работать одно удовольствие. Отрицательной стороной является момент ограничения контента из-за возможности дублирования.
2. Динамический показ (RESS — Responsive Design + Server Side). Имеет в наличии один URL, но разные коды. Поисковый робот сканирует HTML и CSS, чтобы выбрать лучший вариант для отправки на запрошенный URL сервис. Преимущества такой характеристики заключаются в том, что можно самостоятельно выбрать приложение и настроить для необходимого устройства. Отрицательная сторона заключается в сложности разработки.
3. Адаптивный дизайн. Используется только тогда, когда URL и код изменить нельзя. На всевозможные оборудования отправляется единый HTML-код, адаптирующийся по размерам экрана. Преимущества – лёгкий в использовании, не имеет необходимости изменять URL. Минус заключается в медленной работе во время загрузки.

Выводы поисковых систем по отношению работы мобильности сайта:

GOOGLE не выбирает системы с адаптацией, хотя и рекомендует адаптированный дизайн.
ЯНДЕКС положительно относится ко всем типам оптимизации и адаптирования. Предоставляет возможность веб-мастерам самостоятельно оптимизировать сайт. Для выбора наилучшего метода стоит определиться с заданиями пользователя на странице.

Оптимизация сайта под определённое мобильное устройство

1. Скорость загрузки должна быть до трёх секунд. Сервис Page Speed Insights поможет в данном случае сжать данные сайта, облегчить работу в нем и оптимизировать сайт под мобильный вариант. Здесь пользователь может использовать асинхронную загрузку скриптов, при этом оставаясь на сайте.
2. Запрещено блокировать JavaScript и CSS. Используя программу Google Search Console, можно проверить блокировку, чтобы в дальнейшем избежать низкого уровня и позиций в целом.
3. Отсутствие 404 ошибки. Программы Xenu, ScreamingFrog или Google Search Console помогут определить проблемы ошибки при сканировании. Для отсутствия дублирования мобильной версии и ведущего контента необходимо произвести правильную настройку индексации. В случае попадания мобильной версии в простой поисковик нужно воспользоваться кодом <link rel="canonical" href="http://www.site.com/page-1"/>, используя адрес m.site.com/page1. На главном сайте вводится код <link rel="alternate" media="handheld" href="http://m.site.com/page-1" />., используя адрес m.site.com/page1. На главном сайте вводится код . После введения система сама подбирает лучший URL вариант.
4. Правильно настроенный редирект на мобильном сайте позволяет выполнять переадресацию без ошибок при поиске. На одной странице должно содержаться до 5 редиректов, больше вариантов не выполняют поисковой системой индексацию.
5. Анимацию формата Flash и видео с проприетарным проигрывателем необходимо применять на теги HTML5. Благодаря этому в дальнейшей работе во всех браузерах не будет никаких проблем.

Accelerated Mobile Page. Что это?

AMP – это разработанный проект системы Google, имеющий доступный исходный код. Данная программа позволяет ускорить и улучшить работу мобильного поиска. Такая технология позволяет сделать проще мобильную страницу, устранить недостатки, сделать больше конверсию и монетизацию сайта. АМР известна благодаря облегченности и лучшей работе загрузки данных на мобильном оборудовании. Вся информация хранится в кеше поисковой системы и базируется на следующих компонентах:

AMP HTML. Считается основой HTML, имеющей расширенные пользовательские теги.
AMP JS. Она же основная библиотека JS, управляющая загрузкой ресурсов и отвечающая за раздачу пользовательских тегов.
AMP Cache. Другими словами это прокси-сервер, извлекающий MP HTML, производящий кэширование и повышающий скорость загрузки страниц.

Преимущества:

не требует индивидуальной конфигурации сервера;
контент доступен для сканирования.
Отрицательные стороны:
ограниченность;
использование одного JavaScriptа;
вероятность отклонений, ошибочных данных по отрицательным показателям посетителей;
индивидуально разработанная специфика в работе.

Для правильности отображения АМР необходимо на обычную страницу ввести:<link rel="amphtml" href="https://www.site.com/url/to/amp-version.html" />.

Как проверяется разметка страниц АМР?

Проверяется и создаётся правильность страниц с помощью Search Console Google. Она необходима для устранения всевозможных ошибок.

Выводы:

Обычная оптимизация сайта считается намного проще мобильной. Чтобы можно было работать на мобильном гаджете, сайт необходимо упростить, сделав его понятным и доступным. Но выполнить это трудно, так как вся информация обязана быть яркой, но быстрой в работе.
Если учитывать все вышеуказанные положительные и отрицательные стороны для оптимизации работы сайтов на мобильных устройствах, тогда есть возможность одновременно получить трафик и увеличить конверсию сайта, монетизируя его при этом. Это приведет к увеличению отдачи в данном бизнесе.

Без рубрики