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


7 плагинов для мобильной оптимизации Вордпресс

7 плагинов для мобильной оптимизации Вордпресс

8 декабря 2014 3 524

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

Топ 10 продающих лендингов для Вордпресс

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

В WordPress с этой проблемой справиться гораздо проще нежели в любой другой CMS. Сразу стоит отметить: если ваш сайт пока на стадии разработки — обязательно заказывайте / покупайте только адаптивный (респонсивный) шаблон. Боюсь, что в 2015-ом без респонсива будет худо!

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

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

1. WPtouch

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

  Скачать

2. iThemes Mobile

Плагин аналогичен предыдущему — при всей своей казалось простоте, полностью оптимизирует ваш сайт под мобильные устройства. Имеет минимум самых основных настроек и включает в себя пакет готовых мобильных шаблонов. Также стоит отметить возможность создания собственных тем. Кроме этого, вы можете назначать разные темы для различных мобильных устройств вплоть до портативных игровых консолей. У плагина iTheme Mobile имеется расширенная платная версия.

  Скачать

3. Duda Mobile Website Builder

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

  Скачать

4. Any Mobile Theme Switcher

Очень простой плагин, полезность которого просто зашкаливает. Суть его заключена в том, что плагин активизирует разные темы для разных девайсов. К примеру, вы можете определить 3 темы: сложную, попроще и максимально простую. И настроить их таких образом, что сложная тема будет активизироваться только для пользователей, зашедших с персональных компьютеров или лэптопов, та, которая попроще — для планшетов и таблетов, а самая аскетичная для мобильных телефонов. Кроме того, вы можете пойти дальше и назначить конкретные темы для пользователей iPhone, Android, Windows Mobile, Blackberry, Opera Mini и т.д.

  Скачать

5. Mobile Smart

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

  Скачать

6. WP Mobile Edition

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

  Скачать

7. WP Mobile Detector Mobile Plugin

WP Mobile Detector определяет мобильного пользователя и активизирует для него одну из мобильных тем плагина. На данный момент имеется девять предустановленных тем. У плагина также имеется платная расширенная версия, которая позволяет избавиться от навязчивой рекламы, а также появляется возможность определения конкретных устройств и ведение статистики.

  Скачать

В качестве заключения

Если вы ищете простое решение для корректного отображения сайта на мобильных устройствах, бесплатная версия WPtouch доступная в репозитории WordPress — будет отличным выбором. Если вы хотите просто активизировать мобильных пользователям более легкую тему — Theme Switcher вам обязательно поможет. Расширенная версия WPtouch и его альтернатива от iTheme — просто фантастический вариант для разработчиков. Оба плагина имеют широчайший набор возможностей и техническую поддержку.

Всё самое новое и интересное я публикую в своём Телеграм-канале. Подписывайтесь!

danilin.biz

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

Я уже рассказывал насколько просто создать мобильную версию сайта или блога на платформе Blogger.Однако, вебмастера - профессионалы предпочитают пользоваться WordPress.То, что бурно развивающийся рынок смартфонов диктует новые условия, ни у кого не вызывает сомнения.Какие же плагины помогут Вам оптимизировать и оказать дополнительную помощь в бесплатной раскрутке  сайта на WordPress под мобильные устройства? Для начала наглядно покажу разницу между обычным сайтом и его мобильной версией.Как говорят:"Лучше один раз увидеть, чем несколько раз услышать".Такова специфика человеческого восприятия.Для сравнения  возьмем один из популярных и известный многим вебмастерам и сеошникам блог "Mashable" Разница Разница существенная и к тому же следует учитывать размер экрана смартфона, обычно составляющая 600 пикселей.К плагинам, которые помогут создать мобильную версию сайта можно отнести:
  1. Wapple Architect - стандартный плагин для WordPress.Он поддерживает AdMob и Google Adsense и позволяет сохранить текущую структуру URL вашего сайта, вместо того, чтобы создать новый поддомен для мобильной версии.Бесплатен и полностью работоспособен - то что и требуется большинству вебмастеров.К преимуществам относится то, что он сохраняет стиль Вашего сайта, а не приводит его к единому мобильному стилю.Wapple Architect
  2. WPtouch - еще один очень популярный плагин для WordPress, позволяющий полностью настроить мобильную версию сайта под свои нужды.Позволяет подбирать темы и использовать AJAX - эффекты при просмотре с помощью iPhone, IPod Touch, Android, BlackBerry и Palm.WPtouch
  3. WordPress Mobile Pack - превращает обычные сайты в их мобильную версию легко и быстро и предлагает широкий спектр настраиваемых функций.Кроме стандартных функций, при помощи этого плагина Вы также сможете просматривать мобильную аналитику.Также включает в себя мобильный переключатель для выбора темы в зависимости от типа пользователя, выбор мобильных тем, дополнительные виджеты, устройство адаптации и мобильную панель управления, чтобы пользователи смогли редактировать сайт или писать новые сообщения.WordPress Mobile Pack
При использовании этих трех основных бесплатных плагинов, Вы сможете получить дополнительный и весьма ощутимый эффект в бесплатной раскрутке сайта или блога.Существует еще ряд дополнительных моментов, которые следует учитывать при создании и раскрутке мобильной версии Вашего сайта и блога.

Обо всем этом я писал не раз и еще не раз напишу в своих уроках самостоятельного обучения seo ведь тема актуальная и нужная.Надеюсь, что и Вы мне подскажете, что Вас волнует и раздражает.Буду рад помочь.

Пусть меня побьют защитники животных, но это забавно..

knight19661.blogspot.com

Способы оптимизировать WordPress блоги под мобильные устройства

О популярности и доминировании менеджера содержимого WordPress спорить никто не станет. На данный момент WordPress это самое простое решение для любого человека, кому нужен простой, но довольно функциональный Интернет дневник или онлайн блог.

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

Благодаря успешному развитию мобильных технологий, количество пользователей, которые заходят в Интернет при помощи мобильных устройств (будь это смартфон, обычный телефон или высокотехнологичный девайс как Apple Ipad или Amazon Kidle) увеличивается в геометрической прогрессии. Именно поэтому все, кто проведут правильную оптимизацию своих WordPress блогов под мобильные устройства, могут рассчитывать на меньший процент отказов посетителей. Лично я давно присмотрел себе сотовые телефоны HTC (sotmarket.ru) и хочу стать обладателем одного такого дивайса, поэтому решил рассмотреть тему оптимизации детально.

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

WordPress Mobile Pack представляет собой полный набор инструментов для того, что помочь мобилизовать Ваш WordPress сайт и блог. Главные преимущества плагина:

— WordPress Mobile Pack тестировался на всех версиях WordPress начиная от 2.5.1 и заканчивая 3.0.

— Посетители сайта могут использовать простой интерфейс для изменения обычной версии сайта на мобильную и наоборот.

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

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

Детально про плагин: http://wordpress.org/extend/plugins/wordpress-mobile-pack/

WPtouch это простой и элегантный, но мощный мобильный шаблон для вашего сайта. Установив его Вы сможете предоставить пользователям возможность переключатся между Вашей текущей темой и шаблоном WPtouch. Так же, WPtouch был тестирован с такими девайсами как iPod touch, iPhone, платформами Android mobile devices, Palm Pre/Pixi и BlackBerry OS6 и может быть локализирован на любой язык (для этого надо создать файл локализации).

Детально про плагин+шаблон: http://wordpress.org/extend/plugins/wptouch/

И еще, как было обещано, 2 красочные мобильные WordPress темы:

WordPress Mobile Theme это бесплатный шаблон от BlogOhBlog, такими функциями как: возможность выбора цветовой гаммы, настройка ширины шаблона и автоматическое создание иконок для каждой статьи.

Детально про шаблон: http://www.blogohblog.com/wordpress-mobile-theme/

Möbius — это популярный бесплатный WordPress шаблон, оптимизированный для мобильных устройств. Для активации полной функциональности шаблона должен быть установлен плагин WordPress Mobile Pack. При создании шаблона Möbius использовалась технология jQuery, он поддерживает новейшие мобильные ОС и отлично работает с Firefox, Safari, Chrome, Opera, Internet Explorer 6.0 и далее.

Детально про шаблон: http://www.mobilizetoday.com/freebies/mobius

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

ezarabotok.info

Адаптировать сайт wordpress — ТОП

Здравствуйте !

Сегодня я наглядно расскажу и покажу как самостоятельно адаптировать сайт wordpress под мобильные устройства. На самом деле делается это очень просто, не нужно быть профессиональным веб-мастером или кем-то ещё, немного внимания, немного терпения и всё получится, не вы первый и не вы последний. Благодаря встроенной системе плагинов на wordpress, многое что можно замутить на своём сайте, было бы желание.

Адаптировать сайт под мобильные устройства, вам поможет плагин — Wiziapp. Данный плагин хорош тем, что его очень просто настроить, настроек не много и они простые, ломать голову не придётся. Так же вам на выбор 7 бесплатных мобильных тем, выбирайте любую и пользуйтесь на здоровье. Установить данный плагин вы сможете прямо из своей админ-панели wordpress. Перейдите по вкладке: Плагины — Добавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте открывшийся плагин.

 

18-10-2015 18-42-40

 

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

 

18-10-2015 18-43-06

 

Разберём настройки:

General Settings.

— Display Mode, чтобы активировать мобильную тему сайта для всех мобильных устройств, выберите значение — Normal (Active for all mobile visitors).

— Home Screen shortcut icon, здесь можно загрузить иконку приложения для вашего мобильного сайта. Размер 1024 на 1024 пикселей, PNG файл.

— Home Screen icon title, здесь можно указать название вашего сайта. Рекомендуется использовать до 10 символов.

— Navigation, выберите меню для вашего сайта. Если у вас нет меню, то вы можете создать меню, нажав на вкладку — here.

— Google Analytics, если вы используете гугл аналитику, то вы можете указать здесь свой идентификатор отслеживания.

 

18-10-2015 19-06-31

 

Далее, спуститесь в самый низ страницы, здесь можно настроить рекламу — Google Adsense для вашего мобильного сайта. Если вы не используете рекламу от гугл, то можете пропустить данные настройки.

Ad space.

— Footer ad URL tag, укажите здесь тег для вашего объявления.

— Google Adsense Publisher ID, здесь вам нужно указать — идентификатор издателя Adsense. Те кто использует на своём сайте рекламу от гугл, должны понимать о чём здесь идёт речь. Вы найдете идентификатор издателя Adsense в своём Google аккаунте Adsense — настройки аккаунта, вкладка — учетная запись информационный раздел. Введите полный код.

— Google Adsense Slot ID, укажите здесь свой идентификатор слота. Чтобы получить идентификатор слота, вы должны войти в свою учетную запись, добавить новый рекламный блок, Размер “320×50”. После того, как вы сохраните новый рекламный блок или просто просмотреть уже существующий, пожалуйста, нажмите кнопку “Получить код” и вы должны найти в коде “google_ad_slot”, пожалуйста, введите здесь его числовое значение.

— iFrame ad URL tag, укажите здесь тег iFrame с URL объявлений.

— iFrame ad width, здесь можно указать ширину для рекламного объявления.

— iFrame ad height, высота рекламного объявления.

 

18-10-2015 19-29-49

 

Далее, в верхнем меню, перейдите на вкладку — Themes. Здесь вам нужно выбрать тему для вашего мобильного сайта. У вас на выбор 7 тем, чтобы установить тему, жмите на вкладку — Активировать. Чтобы просмотреть тему, жмите на вкладку — Просмотреть.

 

18-10-2015 19-50-29

 

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

 

18-10-2015 20-00-35

 

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

 

При создании новой записи на сайте, у вас будет возможность создавать — Push-уведомления. Например если кто-то добавит ваш сайт в виде приложения на домашний экран мобильного, то он будет получать от вас Push-уведомления.

 

18-10-2015 20-16-56

 

Для создания Push-уведомлений, у вас на странице создания записи появится специальный блок, где вам нужно поставить галочку и добавить в поле текст уведомления.

 

18-10-2015 20-20-05

 

 

На этом у меня всё, остались Вопросы ? что-то не понятно ? пишите в Обратную связь, либо оставляйте комментарии к данной записи. Я всем отвечу, до новых встреч ! Ещё один простенький — Плагин мобильной версии wordpress, адаптирует сайт под мобильные устройства, ничего сложного.

 

info-effect.ru

info-effect.ru

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

Optimizacija-sajta-dlja-mobil'nyh-ustrojstvЗдравствуйте друзья! Официальный блог Inside AdSense - Russia опубликовал очередную статью из серии - как увеличить популярность веб-сайта и укрепить лояльность его посетителей, используя ключевые данные из отчетов Google Analytics. Первую статью - Данные AdSense в Google Analytics начинающим, Вы можете прочитать здесь. Вторая запись называется : Оптимизация сайта для мобильных устройств с помощью Google Analytics. Я всегда распространяю новости от AdSense, публикуя их в своих блогах, так как, слово Google AdSense пахнет деньгами. Хотя говорят, что деньги не пахнут, пахнут, да ещё как. Согласны? Вот текст советов для нас.

Оптимизация сайта для мобильных устройств с помощью Google Analytics

Популярен ли ваш сайт среди пользователей мобильных устройств? Современные люди все чаще просматривают веб-сайты на мобильных устройствах, и анализ статистики таких посещений становится все более важен. Google Analytics позволяет получать такие данные для мобильных сайтов и приложений, в том числе о количестве просмотров с планшетов и телефонов с веб-браузером (как простых, так и смартфонов). Рассмотрим несколько советов по увеличению популярности сайта на мобильных устройствах с использованием данных Google Analytics.

1. Определяйте суммарную доходность мобильного приложения с помощью Google Analytics

AdSense-Google-Analytics

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

2. Убедитесь, что сайт одинаково хорошо воспринимается на всех устройствах

Optimizacija-sajta-dlja-mobil'nyh-ustrojstv Статистика Google Analytics по мобильным устройствам доступна на вкладке "Отчеты" в разделе "Аудитория". Данные можно просмотреть по регионам, чтобы узнать, откуда поступает трафик, и спрогнозировать его изменения. А такие сведения, как показатель отказов, типы устройств и длительность посещений, позволяют проанализировать сайт и сделать его одинаково удобным на компьютерах и на небольших экранах.

3. Составьте разные стратегии для разных устройств и определите цели монетизации мобильной версии своего сайта

Optimizacija-sajta-dlja-mobil'nyh-ustrojstv

Единых правил разработки стратегии не существует, но для успеха мобильного сайта очень важно четко сформулировать цели. Например, это может быть определенное количество посещений или привлечение новых пользователей. Если ваш контент предназначен для жителей определенного региона, имеет смысл адаптировать дизайн мобильного сайта с учетом его специфики. Цели сайта должны учитывать потребности пользователей. В отчетах Google Analytics указывается, сколько посещений получено с мобильных устройств и сколько – с компьютеров. Эту информацию можно использовать при разработке стратегии. Если вы хотите разместить объявления на сайте, предназначенном для мобильных устройств высокого класса, используйте рекламные блоки AdSense для контента.

Чтобы помочь издателям оптимизировать сайты для мобильных устройств, мы создали сводку Mobile Key Metrics Dashboard (Ключевые показатели мобильных устройств). Загрузите ее и выберите профиль, который нужно импортировать. Эту сводку можно открыть в любой момент, выбрав ссылку "Сводки" на вкладке "Отчеты" в своем аккаунте Google Analytics.

В конце этой серии, мы будем записывать видео с ответами на наиболее часто задаваемые вопросы и поделиться им на Google+ 12 марта. На следующей неделе мы расскажем о том, как повысить лояльность пользователей, используя статистику Google Analytics.

Автор: Джемаль Бююкгёкчесу (Cemal Buyukgokcesu), специалист по Google Analytics.

Блог Inside AdSense - Russia, почтовая рассылка.

Понравилась статья? Поделись с друзьями!

wordpressmania.ru

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

Приветствую Вас, мой Друг!

В этой статье мы поговорим с Вами об оптимизации страниц блога для мобильных устройств. Эта проблема сегодня, я уверена, волнует многих блоггеров.

Содержание этой статьи:

Сервис Google Webmaster

С 21 апреля 2015 года компания Google начала отдавать предпочтение в своей поисковой выдаче сайтам, адаптированным под мобильные устройства. Поэтому я не осталась равнодушна к судьбе моих сайтов и приняла решение исправить все недостатки отображения страниц моих сайтов на тех же смартфонах.

После диагностики своих блогов на сервисе Google Webmaster Tools (инструменты для веб-мастеров), в своем профиле я получила результаты анализа на совместимость их с мобильными устройствами. И вот что я увидела…

Проверив домен http://deklife.ru Google выдал мне вот такую картинку  с четырьмя проблемами отображения блога на смартфонах и айфонах.

  • Контент шире экрана
  • Значение метатега viewport не задано.
  • Интерактивные элементы расположены слишком близко
  • Слишком мелкий шрифт

Ну, тут все понятно. Просто этот домен является зеркалом моего основного домена https://deklife.ru, который я недавно перевела на SSLзащищенный сертификат и плюс еще активировала на нем плагин WPTouch.

Обязательно почитайте мою Пошаговую Инструкцию со скриншотами по бесплатному переводу сайта на «https». Уверена, она Вам очень понравится и пригодится в работе с блогом.

На зеркале своего блога я до этого вообще ничего не делала для оптимизации сайта под разные мобильные гаджеты. Вот Гугл и возмутился…

А после установки на основной домен блога умного плагина по мнению Гугл все нормализовалось.

Сервис Yandex Webmaster

Практически тот же результат после проверки сайта был и на сервисе Yandex Webmaster.

Было обнаружено правда три ошибки. Но их нужно было как-то решать. Свои рекомендации Яндекс выдал мне в таком виде.

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

  1. С помощью плагина WPtouch Mobile;
  2. Вручную прописывая html-коды.

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

Полное и правильное название этого чудо-плагина WPtouch Mobile Plugin.

Скачать его дистрибутив Вы можете на официальном сайте WordPress: wordpress.org/plugins/wptouch/ (скопируйте ссылку и вставьте ее в адресную строку своего браузера).

Как установить и активировать плагин WPtouch Mobile на свой блог
  • Скачайте файл с архивом плагина себе на компьютер по ссылке с официального сайта WordPress;
  • Зайдите в админке WP в раздел Плагины, затем- Добавить новый;
  • Загрузите файл плагина на свой сервер из админки своего блога, с помощью ftp-клиента FileZilla или на своем хостинге;
  • Активируйте плагин.

После загрузки и активации плагина на сервер в меню слева в Амин-панели Вашего блога появится кнопка WPtouch. Нажмите на нее и выберите Настройки. Появится страница с настройками по умолчанию.

Ничего не меняйте, оставьте все как есть. Но если Вам потребуются более расширенные настройки сайта для мобильных устройств, то Вы можете обновить плагин до Pro-версии. Но это уже платная услуга.

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

Двум моим блогам настройки ПО УМОЛЧАНИЮ вполне помогли. Проверив оба сайта на специальных сервисах я успокоилась. Там было все ОК!

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

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

Проверьте видимость Вашего сайта на смартфоне с помощью трех сервисов.

Сначала войдите на сайт этого сервиса Google:

www.google.com/webmasters/tools/mobile-friendly/

Введите там адрес Вашего блога в поле для проверки и нажмите на кнопку Analyze. Если с Вашим сайтом все хорошо, то Google выдаст такую надпись.

Второй сервис Google для проверки мобильности сайта PageSpeed Insights

developers.google.com/speed/pagespeed/insights/ 

Внизу этой страницы я скачала zip-архив с рекомендациями по исправлению небольших косяков на моем сайте. Внутри архива Google было три папки с изображениями, текстовым файлом со ссылками на не оптимизированные страницы и папка с файлами js.

Будет время-разберусь с всем этим хозяйством. А пока плагин WPtouch Mobile неплохо справляется со своими обязанностями. Главное- мои посты на смартфонах читать МОЖНО и вполне удобно.

Третий вебресурс для проверки сайта: www.cy-pr.com

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

Как видно на скриншоте, с моим блогом все чики-пики кроме табуляций, лишних пробелов и переносов в html-кодах. Это и не удивительно, что-то же должно быть не так. Тем более, что я обожаю ковыряться в кодах и модернизировать свой блог.

Думаю, что это не критичные погрешности. А вот что касается метатега viewport, то тут уже проблемка посерьезнее. И нужно ее как-то решать.

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

Для чего нужен метатег «viewport» и куда его вставить

Давайте разберемся теперь с этим метатегом. Для чего Google и Yandex так упорно требуют его присутствие в html-коде нашего сайта.

Мета-тег viewport был введен компанией Apple для корректировки отображения страниц сайта на мобильных устройствах. Как говорит в своих инструкциях Google, мета-тег «вьюпорт» должен обязательно присутствовать в блоке «head».

Чтобы выполнить рекомендацию Гугла зайдите в свою Админку WordPress, в меню слева нажмите на Внешний вид, затем на Редактор.

Справа в списке файлов Темы выберите файл header.php и проверьте, есть ли там у вас между тегами «head» и «/head»  что-то типа этого кода:

<meta name=»viewport» content=»width=device-width»>

или как в моем шаблоне: (этот вьюпорт оказывается у меня есть в коде хейда!)

<meta name=viewport content=»width=device-width, maximum-scale=1.0″>

В первом случае метатег viewport прописывает то, что просмотр контента стандартный-происходит только «подгон» по ширине мобильного устройства. А во втором (моем) мета-теге еще и стоит ограничение на максимальный масштаб=1.0.

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

Мой сайт с мобильных устройств читать можно. А с мелочами я может быть разберусь со временем.

Если мой пост был Вам полезен, напишите об этом в поле для комментариев. Будет интересно всем!

И конечно же, по традиции — подпишитесь на новости этого блога, если он Вас зацепил.

С уважением, Елена Контиевская

Петух — символ Нового 2017 года, встречайте!:) Приколы с петухом в главной роли))

deklife.ru

наконец-то появилась мобильная версия сайта!

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

Вы хотите обновить дизайн своего блога ? Тогда посмотрите русские шаблоны wordpress, многие из них также оптимизированы под мобильные устройства.

Привет, друзья! Я думаю, что Все вы, как и я же, получали письмо от Google, который гласит:  наш сайт не оптимизирован для мобильных устройств:

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

 

На данный момент Google пока никак не пессимизирует сайты, которые не адаптированы под мобильные устройства. Но я более чем уверен, что в скором времени Гугл начнет учитывать этот фактор. Именно поэтому сейчас самый крупный поисковик в мире заставил всех зашевелиться.

Еще: вы, наверное, прекрасно понимаете, что если не оптимизировать сайт под экраны с меньшим разрешением, то процент отказов будет больше с мобильных устройств, а это все скажется на поведенческих факторах, как для Google, так и для Яндекса. А это уже сейчас влияет на позиции сайта.

Как узнать, оптимизирован ли сайт под мобильные устройства? Очень просто. У Google есть специальный сервис для этого, вот ссылка на него: https://www.google.com/webmasters/tools/mobile-friendly/.

Вводим адрес нашего сайта и видим сообщение:

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

Или вот такое сообщение:

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

Да-да, как вы поняли из скриншота выше, наконец-то у моего блога появилась мобильная версия сайта. Многие меня просили сделать это. Я все откладывал и откладывал, да и занятие это, как я думал, довольно дорогое. Запрашивал цены у проггеров - все говорили, что будет стоить более $100. Поэтому я вообще забил на эту тему.

Потом я вспомнил про своего хорошего товарища, коллегу - Виталия - mojwp.ru. Я часто обращаюсь на его блог, если нужно что-то добавить, что-то подпилить. А вот сам Виталий оказывает еще и различные услуги, причем за АДЕКВАТНЫЕ цены, что довольно редко встретишь. Попробовал написать ему, он согласился взяться за эту работу и сделал мобильную версию моего сайта за явно меньше $100. Тут цены для каждого индивидуальные, все зависит от Вашего ТЗ, требуемого функционала. Я выпросил у Виталия скидку для моих читателей, если ему сообщить код "wpnew" он обещал сделать скидку 10%, как для своих. Если интересно, писать ему сюда admin(собака)mojwp.ru.

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

Огромная просьба, попробуйте, пожалуйста, зайти на мой блог с мобильного телефона и напишите в комментариях: все ли удобно, все ли хорошо, может есть какие-то идеи, что-то улучшить/доработать? Очень важны ваши мысли. Спасибо заранее!

P.s. Для вас важно положение в обществе? Тогда вам скорее всего нужны красивые мобильные номера для того, чтобы произвести впечатление. Удивите своих окружающих.

Подпишитесь на бесплатные уроки

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

wpnew.ru