Привет всем читателям форума Masterwebs.ru! В последнее время значительно возросло число пользователей мобильных телефонов, которые постоянно пользуются интернетом со своих устройств. Связанно это в первую очередь с развитием мобильного рынка в мире (большое разнообразие телефонов с большими экранами, с помощью которых стало удобнее пользоваться интрнентом). Это также связано и с социализацией интернета. Большое количество социальных сетей и социальных сервисов, начиная от Фейсбука и Вконтакте, заканчивая Твиттером и Инстаграмом, заставляют нас всегда быть на связи и держать руку на пульсе. Ритм жизни растет, поэтому для пользователя важно, чтобы зайдя в интернет с мобильного телефона, он получил всю необходимую информацию быстро и без лишних неудобств.

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

Что происходит сейчас? Сейчас, зайдя на сайт, не имеющий версии, адаптированной под мобильные устройства, посетители не получат ничего, кроме неудобств. Одни мелкий шрифт и горизонтальная прокрутка экрана чего стоят :wacko: По статистике, приведенной Google, более 60% посетителей больше не вернутся на такие сайты.

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

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

Испытывать различные сервисы и плагины я буду на своем любимом сео блоге. Не будем терять времени, начнем.Онлайн сервисы для создания мобильной версии сайта

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

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

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



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

Перейдя во вкладку Full, можно также добавить некоторые вкусности (причем некоторые из них только за деньги).
Далее, перейдя на третий шаг, нас просят выбрать, будем ли мы платить 9$ в месяц за использование этого сервиса или будем использовать его бесплатно. Тут уже выбор на ваше усмотрение. Основными минусами бесплатной версии являются реклама и использование поддомена, то есть мобильная версия вашего сайта будет располагаться на домене вида
 

http://mobile.dudamobile.com/site/ВАШ_САЙТ

Если вы выбираете бесплатную версию, то вводите ваши e-mail и пароль в форму ниже. На следующей странице будет написан адрес мобильной версии вашего сайта.

Теперь вам осталось сделать перенаправление с основной версии вашего сайта на мобильную, если посетитель зашел с мобильного устройства. Для этого необходимо между <head></head> на вашем сайте вставить следующий код
 

<script type="text/javascript" src="http://static.dudamobile.com/DM_redirect.js"></script><script type="text/javascript">DM_redirect(http://mobile.dudamobile.com/site/ВАШ_САЙТ);</script>

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

Также хочу посоветовать следующие сервисы:
mippin.com – имеет немного настроек; так же как и dudamobile имеет англоязычный интерфейс. Мобильные версии, созданные в mippin.com, будут открываться практически со всех мобильных устройств, так как информация там берется из rss канала.

mobify.com – еще один интересный сервис. Для того чтобы начать оптимизацию сайта под мобильные устройства, необходимо пройти регистрацию, но она быстрая и не требует подтверждения e-mail адреса. Также, если ваш блог работает на Wordpress, вам необходимо установить плагин WordPress Mobile by Mobify, для того, чтобы осуществлялось перенаправление на мобильную версию.
Все эти сервисы похожи между собой, поэтому нет смысла описывать подробно каждый из них. При желании можно найти подробную информацию в интернете.

Плагины Wordpress для создания мобильной версии сайта

Теперь перейдем к плагинам для движка Wordpress, с помощью которых можно реализовать мобильную версию блога.
Для того, чтобы установить плагин, кидаем папку с плагином по FTP в каталог wp-content/plugins на сервере, затем в админке, в меню Плагины активируем новый плагин.

Начну с плагина WordPress Mobile Pack. После установки, в меню Внешний вид админки появятся 3 новых пункта Mobile Theme, Mobile Widgets и Mobile Switcher.

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



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

Во вкладке Mobile Widgets можно выбрать виджеты, которые будут выводиться в мобильной версии.

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



После настроек, мой блог стал выглядеть так:


По-моему очень даже неплохой плагин, но требует определенных доработок в теме, чтобы удовлетворить все свои потребности =)

Следующий плагин – Wordpress PDA & iPhone. Его особенностью является отсутствие настроек, то есть после установки мобильная версия сайта сразу становится доступной. Также радует вполне сносный внешний вид сайта. Блог, после установки этого плагина выглядит так:


Еще один интересный плагин – MobilePress. Имеет минимум настроек, а именно выбор темы, выбор заголовка блога и его описания (если не вписывать название блога и описание, то они берутся из стандартных настроек Wordpress). Плагин готов к работе сразу после установки.

Темы оформления для него можно создавать самому, что позволяет полностью настроить вашу мобильную версию так, как хочется вам. Загружать ваши темы нужно в папку wp-content/mobile-themes. Вот так выглядит мой блог со стандартными настройками плагина, без каких либо дополнительных установок:



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

Вот, кстати, для сравнения, как стала выглядеть мобильная версия моего блога после установки и редактирования плагина MobilePress :




Вот такие средства можно использовать для того, чтобы оптимизировать ваш сайт или блог под различные мобильные устройства. Кстати, помимо оптимизации под мобильные устройства, необходимо также помнить и об оптимизации для ускорения работы сайта, ведь чем дольше загружается сайт, тем неудобнее приходится пользователю, особенно если он заходит на сайт через мобильный телефон. Для пользователей Worpdress есть отличный плагин - SSD Optimize WordPress, который ускоряет работу сайта, отключая некоторые ненужные функции.

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

Спасибо за внимание :) Удачи!

При поддержке: SeoPult - система автоматизированного продвижения сайтов и управления контекстной рекламой. Обсудить на форуме.