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

duda-mobile

Приветствую Вас, Друзья!

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

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

Для сайтов, сделанных на движке WordPress, существует много плагинов, которые решают эту задачу. Об одном я уже рассказывал. Но все они, по каким-то причинам не подходили мне. Изучая эту тему, я обнаружил on-line сервис (конструктор адаптивного дизайна), с помощью которого, я реально, за несколько минут преобразовал один из своих сайтов в адаптивный ко всем устройствам ресурс. Этот конструктор существует давно, но почему-то я обратил на него внимание в последнюю очередь. Полученный результат вполне устроил меня. Теперь все по порядку.

Сначала минусы.

- Сервис буржуйский и нет перевода. Вся работа была сделана в браузере Google Chrome. Но даже при не совсем корректном  переводе, все понятно. Интерфейс простой, логичный и интуитивно понятный.

- В бесплатной версии конструктора есть ограничения.

- В шапке и подвале будет отображаться реклама этого сервиса. Если вас, как и меня, это не смущает, то больше минусов я не увидел.

adaptive-site

Главные плюсы.

- Как я понял, сервис применим к сайта с любой CMS.

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

duda-mobile-plugin

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

duda-mobile-support

и нашел ответ. Это не работает из-за некоторых плагинов или текущей настройки WordPress. Все очень просто. Нужно вставить код перенаправления в header.php сразу после тега <HEAD>

административная панель сайта - внешний вид – редактор – Header (header.php)

paste-code-duda-mobile

duda-mobile-code

Вот этот код:

<script src="http://static.dudamobile.com/DM_redirect.js" type="text/javascript"></script>

<script type="text/javascript">

DM_redirect("http://mobile.dudamobile.com/site/ВАШ САЙТ");

</script>

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

Как работать с сервисом.

- С начало нужно зарегистрироваться на нем. Регистрация стандартная.

- Нажимаем, «Создать мобильный сайт»

mobile-site-mobile-duda

- указываем адрес сайта и категорию

site-registration-in-duda-mobile

Нас перебрасывает в сам конструктор. Всего нужно сделать три шага.

1. Выбираем дизайн сайта. Много возможностей.

site-selection-style-duda-mobile

 2. Выбираем нужные инструменты. Настраиваем СЕО

site-selection-tools-in-duda-mobile

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

link-to-a-mobile-site-in-mobile-duda

Вот и все! Теперь у вас есть мобильная версия сайта. Кстати, статистика этого сервиса (конструктора) очень хорошая. Это внушает оптимизм.

Всем Здоровья и Благополучия!

С Уважением, Михаил!