Телефон:
График работы:

с 09:00 до 21:00 без выходных

Быстрая заявка
Главная \ Новости \ Создание mobile-friendly сайта

Создание mobile-friendly сайта

« Назад 28.05.2015 02:20

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

Адаптивный веб-дизайн

mobile-friendly-website_blogРекомендовано Google как изначальный шаблон, так как HTLM-коды и URL одинаковые на любом устройстве, а сайт автоматически подгоняется под экран.

Плюсы:

  • Одинаковые URL для всех девайсов упрощают индексацию и распространение между пользователями;
  • Автоподстройка не только текста, но и меню, расположения и т.д.;
  • Как альбомный, так и книжный разворот;
  • лучше производительность, быстрее загрузка.

Минусы:

  • Долго создается (с учетом всех типов устройств);
  • Требователен к оформлению и оптимизации (меньше http-запросов, сжатые изображения, минимум CSS и Java Script).

Динамическое отображение

Одинаковые URL, но разные HTML (сервер сам определяет тип браузера).

Плюсы:

  • Отображение контента с учетом типа устройства;
  • Проще изменить макет/наполнение для отдельного типа устройств без влияния на остальные;
  • Лучше, быстрее загрузка;
  • Аналогично адаптивным, одинаковые URL упрощают обмен ссылками.

Минусы:

  • Обновление одной страницы требует обновления других;
  • Сервера не всегда точно определяют девайс и дают ему неправильную ориентацию;
  • Разная подгонка = разное отображение, необходима проверка на различных экранах (что довольно сложно и долго).

Раздельные URLgoogle-mobile-friendly-label

Некоторые сайты умеют определять тип устройства и перенаправляют его на URL с соответствующим кодом.

Плюсы:

  • Большая гибкость настроек (отдельные URL для отдельных девайсов);
  • Гибкий макет, изменение отдельно для каждого устройства.

Минусы:

  • Много URL = перенаправление для каждого типа девайсов. Требуется проверка корректного перенаправления при получении ссылок с моб. устройства на ПК;
  • Больше времени на управление и обновление;
  • Нужна 2-сторонняя аннотация для связи моб. контента и ПК;
  • Требуется правильная точная настройка сайтов для ПК и моб. устройств, иначе посетители запутаются.

Что будет с сайтами, кооторые используют поддомен для моб. пользователей?

Спустя короткое время по введению отметок «Mobile-Friendly» в выдаче моб. девайсов возникло немало сайтов-поддоменов с префиксом «m.», при том, что явных причин на повышение их популярности не наблюдалось. Судя по всему, отдельный поддомен для моб. девайсов являлся одним из критериев, на основе которых проверялась дружелюбность сайта. Естественно, Google не отказывается от своих утверждений о том, что адаптивный дизайн экономически выгодней, эргономичней и привлекательней, но факт в том, что внимание на этом больше не акцентируется. Так что сохраняйте спокойствие — несмотря на то, какая технология применялась вами для поддержки моб. юзеров, Google оценит ее.

Оптимизация

Есть три правила, подходящие для любого способа создания:

  1. Сигнал для Google оповестит о мобильном формате или соответствующей странице.
  2. Все ресурсы должны быть удобны для ботов, особенно это касается файла robots.txt – он обеспечивает ботам доступ к файлам отображения. Нет доступа – нет маркировки.
  3. Используйте только доступные моб. устройствам элементы, иначе сайт окажется внизу списка или получит предупреждение.

Как распознать, является ли сайт дружественным к моб. устройствам?

Google создал спец. инструмент, способный дать внятные ответы для отдельно взятых адресов. Все страницы получают оценку в индивидуальном порядке, потому оценка ресурсов большого объема может стать адским трудом. Вместо этого лучше взять смартфон и запросить выдачу по «site:mysite.com» — лейблами будут обозначены страницы, подходящие для моб. девайсов.

Следует помнить, что сайт либо подходит смартам, либо нет. Вариант, при котором страница не полностью поддерживает моб. стандарты, исключен. Кроме того подтверждено, что лейбл добавляется во время индексации страницы, а не прикрепляется к адресу на постоянной основе. Благодаря этому можно обнаружить проблемные страницы, доработать их и подождать следующего индексирования роботами для полноценного возврата в выдачу. Анализ дружелюбности делается моментально — в тот миг, когда страница вносится в индекс, статус поддержки моб. девайсов уже установлен, ни малейшей паузы между этими действиями нет.

Любопытно, что окончательные результаты тестирования инструментом иногда расходятся с фактическим мнением поисковой системы. К примеру, одна страница сумеет получить утвердительную оценку и получить лейбл в выдаче, но одновременно не пройти проверку инструментом. Попробуйте испытать изменения с использованием sitemap и Webmaster Tools, совершая индексирование страницы мануально — это поможет заметно ускорить процес проверки.

Кроме того, есть ряд требований для пометки сайта как адаптированного под моб. девайсы:

  1. ПО сайта должно быть совместимым с моб. девайсами;
  2. Текст читается без масштабирования, минимальный размер – 12 пикселей, минимум картинок;
  3. Информация не выходит за пределы экрана;
  4. Ссылкам отведено достаточно места (минимум 48 dp), пространство между ними – не меньше 8 dp.
  5. Легкая навигация без мыши или стилуса, кнопки разворота меню, минимум всплывающих окон.

Более подробно на http://www.seonews.ru/analytics/9-faktov-o-mobile-friendly-algoritme-google/#comments

Как моб. трафик меняется в зависимости от запросов? Можно ли определить, какова доля моих ключей, обеспеченных моб. пользователями?

Любые запросы поисковика являются важными для Google. Компания делает все для умения распознавать желания пользователей, их приоритеты. Результатом простых запросов все больше оказывается обычный информационный блок — даже не требуется перехода на какие-либо сайты. До этого подобная техника применялась лишь на моб. девайсах, сейчас — даже на десктопах, при этом по внушительному числу запросов. По факту, Google повернул информацию с сайтов против них же.

Google увеличил перечень тематик, которые обрабатываются его роботами. Стало больше и «спонсорских» результатов, отображенных в выдаче на Android. Выдача по запросам авиабилетов, бронировки и описания гостиниц, аудио и ТВ-шоу переполнена заранее купленными результатами и блоками, загоняюшими лимитированную выдачу далеко на нижние позиции. Большинство оптимизаторов уже подтвердили, что последним способом получения кликов по некоторым моб. запросам стала реклама огромной стоимости.

Дать ответ, какую часть из всего числа запросов ключа занимают моб. юзеры, довольно сложно. Остается задействовать Webmaster Tools для фильтрации ключей по типу девайса, либо Google Analytics. Остальные методы, с большой вероятностью, не дадут никакого результата — лишь Google знает о собственных пользователях достаточно для предоставления эффективных данных.

Хак теста

Количество моб. пользователей, по данным LiveInternet, уже составляет больше половины трафика и продолжает расти. Естественно, это не прошло мимо внимания поисковиков, потому преимущество отдается адаптированным под мобильные девайсы сайтам. Гугл сперва делал пометку «Для мобильных» в сниппетах, но чуть позже компания создала для вебмастеров инструмент, который поможет проверить правильность отображения сайта на моб. девайсах - https://www.google.com/webmasters/tools/mobile-friendly/.

Для обхода теста был создан хак MobileCheat – простой и эффективный. Нужно сделать только 2 действия:

  1. Добавить в код метатег viewport ()
  2. Запретить роботу доступ к CSS-файлам или папке с ними через robots.txt.

Но помните – в Google работают не простые «юзвери», и скорее всего, они уже думают над решением проблемы.

Частые ошибки моб. сайтов

  • Медленная загрузка – не учитывается разница скорости загрузки с мобильных и ПК. Для оптимизации следует:
    1. устранить блокировку Java и CSS;
    2. сжимать картинки, уменьшить коды, больше использовать кэш браузера;
    3. не использовать редирект на целевую страницу.
  • Блокировка файлов CSS, Java, картинок для проверки ботами снижает рейтинг и мешает индексированию. Прогоните robors.txt через Robots Testing Tool, проверьте сайт при помощи mobile Friendly Test и Fetch as Google – это даст необходимую информацию для корректировки.
  • Путанные ссылки требуют внимательной проверки – мобильные для мобильных, ПК для ПК. Особенно касается поддоменов и подкаталогов мобильных версий.
  • «Проблема 404», когда мобильное устройство попадает на ПК-сайт и не может его отобразить. Устраняется правильным редиректом.
  • Недоступный контент или ошибки, которые «лечатся» использованием HTML5, универсальным плеером и транскриптами видео.
  • Промежуточные страницы негативно скажутся на посещаемости и индексации, лучше использовать баннер.
  • «Кривой» редирект часто отправляет мобильных юзеров на ПК-сайты и наоборот, при этом кидает на homepage. Лечится через Google Webmaster – Ошибки сканирования.

Mobile Usability Tool как универсальный помощник

Для использования нужна верификация – она даст возможность выбрать Mobile Tool из выпадающего списка, увидеть отзывы посетителей, получить юзабилити-инфо по всему сайту и пройти по ссылкам для локализации проблем. Плюс появится информация по каждой странице отдельно и ссылка на нужный для решения инструмент.

 


Комментарии


Комментариев пока нет

Добавить комментарий *Имя:


E-mail:


*Комментарий:


Гарантированное увеличение продаж с помощью продвижения сайтов и контекстной рекламы

График работы:

с 09:00 до 21:00 без выходных

Телефон:
©Продвижение сайтов
Яндекс.Метрика