На данный момент смартфон имеет почти каждый человек. Больше 50% пользователей интернета посещает сайты с помощью мобильных устройств. Поэтому оптимизация под все виды устройств очень важна для успешности сайта.
Способы оптимизации под мобильные устройства
Адаптивный дизайн — очень популярный способ оптимизировать сайт. Он подходит для небольших проектов (лендинг, блог).
Чтобы облегчить работу можно использовать шаблоны. Это самый легкий способ при разработке сайта. Нужен только скрипт, который определит ширину и высоту экрана устройства и подставит определенный шаблон.
Готовые темы и плагины, которые упрощают работу — самый удобный из вариантов для сайтов на WordPress и прочих CMS.
Конструктор веб-страниц — простой способ создать сайт без знаний верстки и языков программирования.
Мобильная версия на отдельном субдомене — самый сложный вариант, который используют крупные сайты, такие как интернет-магазины с большим выбором, социальные сети.
Адаптивный дизайн
Именно этот способ рекомендует компания Google, ведь благодаря ему ресурс имеет похожий вид с основной (десктопной) версией. Элементы в зависимости от ширины и высоты девайса будут уменьшаться по вертикали. Крупные блоки и секции сайта нужно скрывать или делать их более компактными.
Это делается с помощью CSS. Можно использовать библиотеку стилей bootstrap, с помощью которой использовать систему сеток, или медиа-запросы (CSS3 Media Queries).
Оптимизация на WordPress
В этой системе управления можно выбрать оптимизированную тему или поставить плагин для адаптации. Учитывая разрешение экрана устройства, верстка меняет свой размер. Шапка сайта заменяется выдвигающимся со стороны меню, которое имеет иконку «гамбургер» (три горизонтальные линии). Блоки с права, которые не вмещаются, переносятся вниз.
Для более качественного вывода данных может быть заказана разработка мобильных приложений, профессионалы выполнят разработку оперативно и согласно договора.
Конструкторы сайтов
Кто не имеет знаний HTML и CSS могут воспользоваться конструктором, в котором можно «нарисовать» сайт и код будет автоматически появляться. После, нужно лишь скопировать готовый код, если нужно опубликовать сайт под своим доменом. Таких сервисов очень много. Есть и бесплатные, и за которые нужно платить. Но не всегда можно достичь идеального результата, используя конструктор. Ведь написанный самостоятельно код легче корректировать и меньше вероятность, что уже похожий дизайн сайта существует.
Мобильная версия сайта на субдомене
Поисковики рекомендуют создавать мобильную версию на втором домене, используя одну базу данных с родительским. Если пользователь зашел с мобильного устройства, то он автоматически перенаправляется на поддомен. Эта версия будет быстрее загружаться, так как меньше по весу и имеет простой дизайн.