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

Мистер Зэбиз24

Доброго времени суток, уважаемые читатели блога Thebizfromscratch! На связи, как всегда, мы – Андрей и Даша. Думаем из заголовка, уже стало понятно, что сегодня мы опять возвращаемся к блогосозданию и тема данной статьи: адаптация сайта под мобильные устройства или планшет. Как качественнее произвести оптимизацию? С помощью установки специального плагина или лучше залезть в код, а может…? Почему не сделали этого раньше? Давайте разбираться.

Почему не оптимизировали блог под мобильные устройства раньше?

     Во-первых, ещё в самом начале при выборе темы в WordPress, мы обратили внимание на такой параметр как адаптивный дизайн, благодаря которому, свой проект удобно читать/смотреть и на компьютере, и на планшете, и на телефоне. Тема сама подстраивается под любое устройство. И на самом деле, всё прекрасно видно и читабельно.

     Во-вторых, большинство блогеров достаточно негативно относятся к установке подобного рода плагинам (WPtouch, WP Mobile Detector, WordPress Mobil Pack, Jetpack и др.) так как есть вероятность, что они в процессе своей работы создают дубли страниц. А мы с вами в курсе, что дубли ооочень не нравятся поисковым ботам, которых начинающие вебмастера бояться, как огня! Мы смекнули и решили пока воздержать от использования плагинов.

     И вот живём себе спокойно, пишем статейки, публикуем их, следим за тем, как они смотрятся на мобильном… Нам всё нравилось! Но, не тут-то было!

     Каждый день мы проверяем статистику и отслеживаем продвижения нашего ресурса  с помощью Яндекс Вебмастера и Google Search Console (кстати, полезные штуки, советуем зарегистрироваться). И в один прекрасный момент сервис от гугла осведомил нас об ошибках на 16(!) страницах нашего сайта. Поначалу, мы немного испугались, ибо к созданию блога подходим очень внимательно и осторожно, успокоившись, стали разбираться в недочётах и… та-да! Ошибки связаны с удобством просмотра на мобильных устройствах:

  • ширина контента не соответствует области просмотра;
  • интерактивные элементы расположены слишком близко.

     И ведь все посты читабельны, все картинки – видно! Мы бы и рады были забыть о такой проблеме, мало ли, пусть сервис ругается, главное, посетителей и нас всё устраивает. Но оказалось, что данный недостаток существенно влияет на выдачу поисковой системы: гугл занижает наши позиции… а это, друзья, не допустимо, особенно для молодых проектов. Так что…взвесив все «за» и «против», решили мы установить плагин.

Установка плагина WP Mobile Detector

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

     Первым делом, после активации, мы прильнули к своим гаджетам и, мягко говоря, были не довольны увиденным…строчки, дизайн, картинки – поплыли. Зато гуглу всё пришлось по нраву! Что же делать? В код мы уж точно не полезем… с нашими знаниями программирования – это бесполезно. Как же быть в сложившейся ситуации?

Решение есть – редактируем файл Robots.txt

В самом начале поста, мы оговорились, что выбранная нами тема в WordPress имеет адаптивный дизайн, но Googlebot всё равно ругается и блокирует страницы. И тут до нас дошло…мы же сами запретили ему доступ к темам! А где прописываются правила для ботов? Правильно, в файле Robots.txt. Давайте внесём в этот файл немного изменений:редактируем роботс

Написали отдельные указания для Googlebot, в которых удалили вот эти строки:

/wp-content/plugins

/wp-content/themes

/wp-includes

Обратите внимание, для других поисковых роботов всё оставили без изменений.

     После сохранения вносимых изменений, мы проверили наш проект в сервисе Google…и, чудо! Проблема была успешно решена! Причём блог смотрелся одинаково красиво на любых устройствах.проверка удобства     Для более точной проверки советуем воспользоваться ещё одним сервисом от гугла – PageSpeed Insights, где вы сможете увидеть проблемы, которые нужно решить. Внимание стоит обратить на пункт – удобство для пользователей.ещё один сервис от гугл     И на сегодня мы заканчиваем, надеемся, что адаптация сайта под мобильные устройства больше не будет вызывать проблем. Желаем удачи и до новых постов.

С уважением, Андрей и Даша.


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

7 Комментарии

  1. Ксения

    Здравствуйте! Спасибо за статью! Но возник вопрос: не возникнет ли много «мусорных» страниц, дублей после открытия wp-content?

    1. admin (Автор записи)

      Здравствуйте, Ксения! Спасибо за вопрос! Таким же вопросом мы задавались при открытии этой папки. Проанализировав роботсы многих вэбмастеров и пообщавшись с опытными блоггерами, убедились что для гоши в основном нет никаких запретов. На такие дубли обращать внимание не стоит.
      Раз заговорили про дубли, то совсем недавно узнали про replytocom в комментариях и как к ним относится гоша со своим фильтром, вот каких дублей нужно бояться!

  2. Елена

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

  3. Валера

    Неужели все так просто, и в любую тему можно устанавливать плагин?

    1. admin (Автор записи)

      Да. Плагин можно установить в любую тему.
      Тут важно лишь то, чтобы он не ругался с самим WordPress, т.е. был совместим с движком

      1. Игорь

        Иногда плагины и между собой конфликтуют, не только с темой

  4. NN

    У ВАС НЕ ХВАТАЕТ СТР ПОДПИСКИ !

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *