Адаптивная верстка сайта на Wordpress

На сегодня адаптивную верстку имеет доля 10-20% всех сайтов. 21 апреля 2015 года Google «обрадовал» веб-мастеров, занимающихся сайтостроением, и владельцев ресурсов сообщениями на почту, где сервис предупреждал о неудобстве использования для мобильных устройств. И дальше следовало, что поисковая система отказывается от индексирования таких страниц. Для многих это стало частичной потерей потока посетителей из мобильного интернета.

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

Что такое адаптивная верстка для мобильной версии?

Адаптивная верстка представляет из себя обычный веб-дизайн, умеющий подстраиваться под любое разрешение экрана, в т.ч. для mobile, чтобы пользователю было удобно просматривать страницы ресурса. Как вариант решения проблемы - создать мобильную версию сайта.

Работа над созданием адаптивного веб-дизайна начинается с проверки на сервисах Google. Обычно сервис выдает перечень доработок, которые необходимо выполнить для перехода на мобильную версию. При адаптивной верстке на WordPress изменения вносятся в css-файлы, а внутри header.php в части head прописывается мета-тег с атрибутом viewport, позволяющий подстроить содержимое интерфейса под размер экрана.

Удобство этого метода – не нужно создавать новый сайт, следить за наполнением, заново проводить seo-оптимизацию. Однако, возникают проблемы с отображением в разных браузерах, элементы в некоторых из них начинают «ехать». Требуется тонкая настройка css стилей.

Плагины на WordPress для адаптации сайта

Специально для WordPress создатели разработали бесплатные плагины, помогающие перейти, например, MobilePress, Duda Mobile Website Builder. Их можно скачать с официального сайта.

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

Адаптивные шаблоны WordPress

Найти качественные адаптивные шаблоны для веб-мастера не займет много времени, однако потребует знания основ HTML и CSS. Шаблон для работы легко скачивается и переделывается на свое усмотрение.

Достоинства:

• Легко установить и настроить. При желании можно найти даже премиум-шаблоны бесплатно;
• Проверенные шаблоны поддерживают кроссбраузерность;
• Огромное количество в интернете;
• Не потребуется много времени, чтобы перейти на адаптивный дизайн.

Недостатки:

• Придется полностью менять старый на новый;
• Внутри встречаются закодированные ссылки автора или на другие сайты.

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