Мобильное доминирование: 5 советов по оптимизации

Аудитория пользователей мобильных устройств стремительно увеличивается. По прогнозам Google в 2014 году свыше 1 миллиарда человек будут «серфить» в интернете при помощи мобильных устройств. А общее количество смарфонов в мире к 2018-у году достигнет трех миллиардов, планшетов к тому времени будет насчитываться около одного миллиарда. Все это отразится на дизайне и функционале сайтов, те, у кого не будет мобильной версии, потеряют значительную часть посетителей.
Уже сейчас в Google заявили, что вскоре обновят алгоритмы для поиска через мобильные устройства. После их запуска при поиске со смартфонов, сайты без мобильной версии или же сайты с ошибками в ее настройке будут получать низшие позиции, чем те, у кого она работает правильно. В официальном блоге перечислены основные ошибки и указано, как их исправить.

5 шагов оптимизации мобильных сайтов:

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

Мобильное доминирование: 5 советов по оптимизации 2

Согласитесь, воспринимается не очень легко, и на это есть две основные причины: испорченная верстка и перегруженность информацией, из-за которой нужно скролить страницу (перематывать вниз). К тому же такая страница будет долго загружаться из-за веса картинок, более 60% пользователей закроют ее, если время загрузки превысит 5 секунд. 2 Выберите вариант мобильной версии. Сейчас Google поддерживает три варианта мобильных сайтов:

Сайты с адаптивным веб-дизайном. Адаптивный веб-дизайн означает, что на всех устройствах открываются одни и те же URL. Код HTML при этом не меняется, а адаптация страницы к определенной платформе обеспечивается за счет разметки CSS.
Сайты, которые на любых платформах задействуют один и тот же набор URL, но при этом обычным компьютерам и мобильным устройствам динамически предоставляется разный код HTML (и CSS).
Сайты, которые предоставляют разные URL обычным компьютерам и мобильным устройствам. По сути, необходимо делать два варианта сайта или целевых страниц.

Мы рекомендуем использовать сайты с адаптимным веб-дизайном. 3 Создайте мобильную версию Для создания мобильной версии ознакомьтесь с рекомендациями Google. Мы предлагаем вам список сервисов, которые ускоряют процесс: Для тех, у кого нет опыта работы с HTML5 и CSS или времени:

MoFuse – простой в использовании сервис для быстрого создания мобильной версии.

Плагины для WordPress и других CMS:

WPtouch Pro 3 – фантастический плагин, доступный пользователям WordPress.org, с помощью которого можно автоматически создать мобильную версию сайта.
Mippin — бесплатный сервис, который за несколько минут превратить ваш сайт в приложение.
MobiSiteGalore — вам понадобится не более 15 минут, чтобы создать мобильную версию вашего сайта.

Инструменты для дизайнеров:

Mobify – бесплатный сервис, с помощью которого люди, владеющие HTML и CSS, легко изменяют и оптимизируют сайт под мобильные устройства. Подходит для работы с WordPress, Drupal, ExpressionEngine и другими, с хорошо сформированным HTML кодом. Для использования расширенной версии придется платить абонентскую плату.
iWebKit – инструмент для созданий мобильных приложения адаптированных под iPhone.

4 Разберитесь в мобильном дизайне

Пользователи не любят прокрутку, поэтому размещайте самую важную информацию вверху страницы. Большой объем информации, разбейте на несколько блоков и поместите на отдельных страницах.
Сделайте кликабельный телефон, с автоматическим набором номера. Если пользователь захочет вам позвонить, ему придется искать способ записать номер, но зачем? Достаточно одного клика и он звонит вам.
Внимательно и еще раз внимательно отнеситесь к изображениям, они ваше преимущество и угроза. Картинки привлекают внимание, но в то же время утяжеляют страницу и могут «поломать» адаптивный дизайн. Поэтому сжимайте картинки и задавайте размер изображений в процентах, а не пикселах.
Сделайте призыв к действию видимым на всех типах устройств. Размещайте кнопки слева вверху страницы. И еще дайте пользователем возможность перейти на полную версию сайта.
Также актуально на сегодняшний день создание мобильного приложения, которое позволит пользователю более быстро и удобно получать информацию, чем листание страниц. К тому же получить оффлайн доступ к некоторой информации, требующей разового обновления.

5 Проведите SEO оптимизацию

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

О психологии пользователя:

При работе с мобильными пользователями стоит учитывать, что:

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

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