Logo

Как адаптировать сайт под мобильные устройства

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

Например, поисковик Гугл просто и ясно говорит, что теперь в результатах поисковой выдачи он будет учитывать, насколько хорошо сайт будет виден на мобильных устройствах. Т.е. в связи стем, что всё больше пользователей работает в интернете теперь не со стационарных компьютеров, а с мобильных устройств (планшетов, мобильных телефонов) деваться не куда — нужно сделать свой сайт (блог) хорошо видимым на мобильных устройствах.

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

И тут есть два варианта:
Создайте свой блог с нуля, чтобы он был доступным для мобильных устройств.
Если вы хорошо разбираетесь в создании веб-сайтов, при создании блога, примите во внимание следующее:
1. Размер экрана
Понятно, что размер экрана мобильного телефона намного меньше, чем в ноутбуке, и многие WAP браузеры просто демонтируют каскадную таблицу стилей (CSS), из-за чего страница отображается в виде текста. Это не совсем эстетично. Что вам нужно сделать, так это убедиться в том, что у вас есть мобильная версия вашего сайта, которая не содержит изображений и максимизирует функциональность вашего сайта.
2. Действующий код
Убедитесь в отлаженности кода вашего веб-сайта, так как мобильные поисковые машины не в состоянии переварить неправильный код.
3.  Следуйте традиционным и лучшим SEO практикам
Пишите краткие, сжатые заголовки постов на блоге, так как именно они будут тем, что мобильный пользователь сначала видит и что заставит его щелкнуть по названию статьи.
Убедитесь в том, чтобы URL структура была как можно более простой. Это означает, что вашим посетителям будет легче ввести адрес вашего сайта или блога.
Используйте лучшую платформу для вашего блога –WordPress

Адаптируем с помощью плагина

Имеется отличный сервис от Google -PageSpeed Insights, который позволяет посмотреть, как виден сайт на мобильниках. В соответствующую строку вводим название сайта и видим результат. Вот, как выглядит сайт на котором вы находитесь, без мобильного варианта, т.е. ничего не менялось.

Сайт не адаптирован

И как тут работать? Мелкий шрифт, плохо видно… А как пальцем нажимать на сенсорном экране? В общем — всё плохо.

В качестве альтернативного варианта, если вы уже используете WordPress на своем сайте или блоге, вы просто можете установить плагин WP Mobile Detector Mobile Plugin.

В панели управления перейдите в раздел Плагины,затем Добавить новый введите в поиске «WP Mobile Detector Mobile Plugin», как показано ниже, и следуйте инструкциям.

1. Введите плагин, который вы ищите
2. Выберите нужный и нажмите кнопку установки.
3. Ваш плагин должен начать автоматическую установку, которая позволит вам потом его активировать. После активации плагина заходим в Google -PageSpeed Insights и видим уже другую картинку:

Мобильная версия сайта

Вот теперь всё видно и понятно. Кстати, данный плагин может менять темы оформления. Для этого в панели управления в левой колонке найдите WP Mobile Detector  и в контекстном меню выберите Mobile Themes, откроется страница на которой Вы можете сменить мобильную тему.

Кстати сказать, что при проверке в сервисе Google -PageSpeed Insights разных тем, был совершенно разный результат по оптимизации. Т.о. изменяйте темы и смотрите, что говорит этот сервис от Гугл.

Стоит сказать, что данный плагин не единственный, который решает подобные задачи адаптации. Есть например, MobilePress или WordPress Mobile Pack. В общем пробуйте, какой Вам больше понравиться
Так как все больше и больше людей, хотят получить доступ в интернет через свои мобильные устройства, очень важно, чтобы наши блоги были готовы к этому. Если вы уже пользовались другими мобильными плагинами WordPress, которые вы нашли полезными, пожалуйста, расскажите о них в своих комментариях.

Похожие записи

3 комментария

  1. Helen:

    У меня свой кулинарный блог, который я веду с 2014 года. Сделать его мне помог сделать мой знакомый, он мне все настроил, мне оставалось только загружать на блог новые рецепты. Блог сделан на Вордпресс. Сначала я вела его для души, радовалась посещаемости в 300 человек, но эта цифра за последний год так и не изменилась. Я стала читать советы по раскрутке блога и повышению посещаемости, и одним из советов было сделать сайт адаптивным под мобильные устройства. Но так как шаблон был старенький и не с официального сайта Вордпресс, то он не поддерживал мобильную версию. Сервис Гугла очень на меня ругался)) Менять шаблон я очень не хотела, а знакомый, который помогал мне с сайтом, давно переехал в другой город и связь с ним потерялась. Я пробовала установить плагин, который вы рекомендуете — WP Mobile Detector Mobile Plugin, но из-за него у меня перестал работать плагин похожих записей Contextual Related Posts. Отключаю плагин мобильной версии — плагин похожих записей опять работает! Никто в интернете мне так и не подсказал что делать, все пишут что у них все хорошо… Пришлось обращаться за платной помощью, там мне все сделали за 2 дня. Теперь у меня не только сайт красиво выглядит если зайти с мобильного, но и начала повышаться посещаемость! За месяц она стала 400 человек, из них новые посетители были именно со смартфонов и планшетов! И сервисы Яндекса и Гугла больше не ругаются что сайт не оптимизован под адаптивные устройства! Поэтому если у вас такая же, как у меня проблема, то лучше обратитесь к профессионалам. Нашла сайт, где мне помогли, вот ссылка — вдруг кому пригодится:

    Ответить
  2. Helen:

    У меня свой кулинарный блог, который я веду с 2014 года. Сделать его мне помог мой знакомый, он мне все настроил, мне оставалось только загружать на блог новые рецепты. Блог сделан на Вордпресс. Сначала я вела его для души, радовалась посещаемости в 300 человек, но эта цифра за последний год так и не изменилась. Я стала читать советы по раскрутке блога и повышению посещаемости, и одним из советов было сделать сайт адаптивным под мобильные устройства. Но так как шаблон был старенький и не с официального сайта Вордпресс, то он не поддерживал мобильную версию. Сервис Гугла очень на меня ругался)) Менять шаблон я очень не хотела, а знакомый, который помогал мне с сайтом, давно переехал в другой город и связь с ним потерялась. Я пробовала установить плагин, который вы рекомендуете — WP Mobile Detector Mobile Plugin, но из-за него у меня перестал работать плагин похожих записей Contextual Related Posts. Отключаю плагин мобильной версии — плагин похожих записей опять работает! Никто в интернете мне так и не подсказал что делать, все пишут что у них все хорошо… Пришлось обращаться за платной помощью, там мне все сделали за 2 дня. Теперь у меня не только сайт красиво выглядит если зайти с мобильного, но и начала повышаться посещаемость! За месяц она стала 400 человек, из них новые посетители были именно со смартфонов и планшетов! И сервисы Яндекса и Гугла больше не ругаются что сайт не оптимизован под мобильные устройства! Поэтому если у вас такая же, как у меня проблема, то лучше обратитесь к профессионалам. Нашла сайт, где мне помогли, вот ссылка — вдруг кому пригодится:

    Ответить
  3. Helen:

    Ой, извините! Мой комментарий не появился, я его опять отправила вам и появилось оба. просто хотела помочь с проблемой и поделиться опытом…

    Ответить

Добавить комментарий

Ваш e-mail не будет опубликован.