+7 (8352) 37-40-01 +7 (495) 975-91-27 +7 (843) 207-03-17 +7 (831) 231-06-21 8 800 77 55 127

Рекомендации по созданию мобильных сайтов под Google Mobile Friendly

11 Мая 2016

С момента оглашения корпорацией Google нового алгоритма ранжирования прошел ровно год.

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

Сейчас все поисковые запросы с мобильных телефонов и планшетов обрабатывает Mobile-Friendly. Еще с момента запуска, разработчики уверяли, что алгоритм работы изменить результаты выдачи более чем на 10%, в соотношении с черно-белыми алгоритмами. И вот уже на протяжении года мы ведем контроль над своими ресурсами, к счастью, изменений никаких замечено не было.

Ответы на самые распространенные вопросы по Mobile Friendly:

Какие цели преследовали разработчики в процессе внедрения Mobile-Friendly: усложнить рабочий процесс сео-специалистам или направить сетевой бизнес в русло контекстной рекламы?

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

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

Если у вас есть мобильная версия сайта, то обязательно нужно проверить следующие пункты:

  1. Размер шрифта – крупный и хорошо читабельный;
  2. Размер клавиш – большой, чтобы по ним мог попасть даже мужчина, а не только девушка своими тонкими пальчиками;
  3. Блоки страницы – должны иметь правильное и удобное расположение с точки зрения юзабилити;
  4. Контент – минимум текстовой информации, больше изображений видео и прочих информативных элементов.

1. На что в большей степени оказывает влияние Google Mobile Friendly?

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

google-mobile-friendly-update.jpg

2. Как определить, относится ли мой сайт к Mobile-Friendly?

В этом вопросе не должно возникать каких-либо трудностей. Корпорация специально для владельцев ресурсов разработала Mobile-Friendly Test. Он поможет определить уровень комфорта серфинга страниц сайта с портативных устройств.

Есть еще один верный способ проверки. Для этого нужно найти его в выдаче и проверить наличие пометки «Для мобильных устройств». Если вы являетесь счастливым обладателем подобной строчки, то можете быть уверены в том, что Google положительно расценивает ваш сайт и видит его адаптированным.

Mobile-Friendly-Label.png

Также как и со стандартными версиями, мобильную версию нужно протестировать на скорость загрузки. Сделать это можно при помощи сервиса PageSpeed Insights, который предлагает все тот же разработчик. Здесь вам предложат пройти три тестирования, однако даже при положительных результатах сразу же отметайте мысль, что вы находитесь в топе выдач. Это обусловлено тем, что сам по себе Mobile-Friendly представляет лишь один аспект ранжирования, поэтому остальные нюансы должны быть тоже учтены.

3. Что делать, если сайт до сих пор не оптимизирован, неужели все труды пошли насмарку?

Здесь можно дать однозначный ответ и окончательно успокоить владельцев неадаптированных ресурсов. Ваши труды будут оценены по достоинству. Усовершенствованный алгоритм ранжирования работает в реальном времени, поэтому существует вероятность, что пометка о принадлежности сайта к мобильным, просто еще не появилась. Однако это никак не снизит номер поисковой выдачи сайта, главное, чтобы страницы были адаптированы. Иногда может потребоваться на определение принадлежности около 3 суток.

Также не стоит забывать о том, что Mobile-Friendly – это лишь малая часть крупного механизма ранжирования и остальные детали никуда не исчезли, поэтому сайт не понизится в выдачах, если вы его конечно правильно оптимизировали.

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

4. Что делать с сайтами, у которых несколько сотен, а то и тысяча страниц?

Здесь нужно выделить главные страницы, которые несут особую важность и могут предоставить посетителям максимально полную информацию о вас, как о партнере. Именно с них нужно начинать процесс адаптации. Кстати, на этом моменте многие ошибочно думают, что «Главная» страница таковой и является. Это не всегда так, анализируйте и смотрите, с каких страничек вы получаете больше кликов, продаж и прочих действий клиентов.

5. А можно страницу адаптировать частично?

К сожалению или счастью, но подобная опция отсутствует. Поисковик воспринимает страницу как целостный элемент.

6. Хочу сделать сайт Mobile-Friendly, с чего мне начинать и стоит ли?

Если хотите – то конечно стоит, тем более что прогресс не стоит на месте, и в скором времени мы все перейдем на серфинг страниц через мобильные или портативные устройства. Поэтому нужно шагать в ногу со временем и не отставать от тенденций.

В нашей компании, Вы можете заказать адаптивный сайт и мы его разработаем в кратчайшие сроки.

7. Каково влияние нововведения на трафик рекламы от Google?

Абсолютно никакого влияния, система обрабатывает исключительно поисковые запросы.

8. Это последнее новшество от корпорации или мы еще много чего увидим нового?

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

3 способа создания страницы Mobile-Friendly

А теперь разберем три основных способа, которые помогут адаптировать страницу сайта.

Способ №1 – адаптивный дизайн

Реализовать его можно путем внедрения адаптивных css стилей и команды @media, предназначенной для задания параметров, размеров, положения элементов на страничке. В некоторых случаях еще понадобится помощь Java скриптов.

responsive_web_design.jpg

Плюсы адаптивного дизайна:

  1. Однотипная структура всех страниц;
  2. Идентичное отображение контента;
  3. Ссылки из одного источника без поддоменов.

Минусы адаптивного дизайна:

  1. Долго и сложно выполнять верстку;
  2. При неправильном подходе ресурс станет непритязательным для посетителей;
  3. Увеличивается время загрузки сайта;
  4. Сложная отладка.
Напомним, что заказать адаптивный сайт Вы можете в нашей компании, обратившись к менеджеру, по любому удобному каналу связи.

Способ №2 – динамический показ

Таким методом можно выполнить необходимую адаптацию на самом сервере.

Плюсы:

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

Минусы:

  • может произойти перегруз сервера;
  • сервер будет содержать слишом много лишних файлов;
  • верстать сайт придется с самого начала.

Способ №3 – мобильный поддомен

При реализации этого способа ваш сайт будет иметь собственный поддомен в формате «m.site.com».

Плюсы мобильного поддомена:

  1. Преимущество здесь единственное, но оно существенное. У разработчиков появится шанс создать сайт от первой до последней буквы, что поможет исключить нежелательный контент, и ускорит загрузку.

Минусы мобильного поддомена:

  1. Ссылки на идентичные страницы будут отличаться;
  2. Произойдет дублирование информации;
  3. Придется связывать свой сайт в стандартной и мобильной версиях так, чтобы поисковая система смогла его определить как ваш.

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

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

  • нужно быть уверенным в четком понимании сути вопроса;
  • уметь рассказывать специалисту свои желания;
  • правильно выполнить проверку готовой работы.

1. Определяем функциональные особенности

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

На следующем этапе нужно определить количество и список желаемых страниц. Здесь же нужно продумать элементную составляющую (отчего можно отказаться во благо уменьшения веса сайта и ускорения загрузки).

Несколько советов:

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

Если нет четкого представления, то можно позаимствовать идею у ресурсов, которые вам симпатичны.

2. Разрабатываем дизайн

Если вам очень хочется самому потрудиться над созданием дизайна, то поможет в этом сервис Moqups. С его помощью за 20 минут можно примерно накидать, как будет выглядеть ресурс в будущем.

adaptivniy_dizayn_sayta.png

Несколько советов:

  • делайте сайт таким образом, чтобы он корректно грузился на устройства, параметры дисплея которого минимум 320 px;
  • расположение навигационных элементов должно быть удаленным, чтобы случайно не цеплять не нужные опции;
  • отключите прокрутку сайта в ширину;
  • размер используемого шрифта равен 12 px.

3. Скорость загрузки сайта

Этот момент является чуть ли не самым основным в процессе разработки. Время, за которое открывается ресурс на устройстве, зависит от веса контента на страницах (нужно брать маленькие картинки), не подключать много модулей и скриптов. Если прислушаться к специалистам Google, то оптимальным будет размещение дополнительных модулей и стилей по всей страничке, так при загрузке не будет сбое отображения контента.

Также нужно правильно разработать и заполнить файл robots.txt, он, кстати, и поможет заблокировать ненужные элементы. Не забывайте о том, что опция кеширования браузером также увеличивает скорость загрузки, сделать ее можно в своем аккаунте используемого хостинга в настройках сервера.

Несколько советов:

  • лучше использовать векторные иконки;
  • нужно использовать Google PageSpeed Insights для показа тяжелых элементов.

Если вам нужно поработать с картинками, воспользуйтесь следующими сервисами:

  • Jpegtran – делает картинку меньшим весом и без метаданных;
  • Pngquant – уменьшит картинку и уберет несколько цветов;
  • Pngcrush, Tinypng – сожмет картинку без потери качества;
  • Jpegmini – сервис облачного типа для уменьшения веса изображений на 25%.

4. Оцениваем готовый сайт

Когда работа сделана, нужно подвести итоги:

  • сделать первичную оценку: удовлетворительно или не удовлетворительно;
  • далее потребуется быстрое тестирование;
  • для детального оценивания воспользоваться нужно Google PageSpeed Insights;
  • проверить наличие надписи «Для мобильных устройств».

Продолжаете терять трафик и продажи из за отсутствия адаптива?

Мы знаем об адаптивных сайтах всё и умеем их готовить!

Оставьте заявку и мы бесплатно рассчитаем стоимость всех необходимых работ
Последние записи
Анализ контекстной рекламы с гарантией результата
16 Ноября 2016
Раскрутка интернет-магазина: 4 пути в ТОП
14 Ноября 2016
Как получить максимальную конверсию с Яндекс Директа
11 Ноября 2016
21+ приём работы в Excel для SEO специалиста + бонус
9 Ноября 2016
SEO Conference 2016: итоги и обзор лучших докладов
4 Октября 2016
Подписка на новости
Полезные статьи о лидогенерации и интернет-маркетинге 4 раза в месяц
Оформление запроса
Отправьте нам запрос и наши консультанты в ближайшее время свяжутся с Вами.
Корпоративный сайт
Комплексное продвижение
Интернет-магазин
Контекстная реклама
Поддержка и развитие сайта
Поисковое продвижение

Оформление запроса
Отправьте нам запрос и наши консультанты в ближайшее время свяжутся с Вами.
Готовое решение (интернет-магазин)
Комплексное продвижение
Готовое решение (корпоративный сайт)
Контекстная реклама
Поддержка и развитие сайта
Поисковое продвижение
Регистрация на семинар
Для того, чтобы зарегистрироваться оставьте свои контактные данные.
Баннер на На-связи.ru
На сайте 1С-Битрикс
Из социальных сетей
Из рассылки 1С-Битрикс
По приглашению «KISLOROD»
Баннер на Mail.ru