Четверг, 07 Сентябрь 2017 17:14

Как сделать мобильную версию сайта

Автор

Оцените материал
(313 голосов)
Как сделать мобильную версию сайта Как сделать мобильную версию сайта

Основные способы создать мобильную версию сайта, их три...

Отдельный сайт;
Мобильное приложение;
Адаптивная вёрстка

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

Отдельный сайт

Первый способ сделать мобильную версию сайта - это сделать отдельный сайт для мобильных устройств. Для этого можно использовать домен третьего уровня, например, m.epicblog.net или просто директорию, например, epicblog.net/mobile - разницы нет. Это должна быть версия сайта полностью адаптированная под экраны мобильных телефонов и планшетов, под ширину экрана менее 620 пикселей. Также понадобится специальный скрипт, который будет автоматически определять ширину экрана пользователя и перенаправлять его на нужную версию сайта.

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

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

Мобильное приложение

Второй способ сделать мобильную версию сайта - это создать мобильное приложение сайта. Разработка мобильного приложения - удовольствие не дешевое! Есть множество онлайн сервисов-конструкторов, где можно создать не сложное мобильное приложение для сайта. Но эти сервисы, как правило, платные и обычно нет возможности создать мобильное приложение сразу под Android, iOS и Windows Phone.

В добавок Вам придется работать не только над сайтом, но и над мобильным приложением: обновлять информацию, добавлять новое, удалять старое и т.д.

Адаптивная вёрстка

Третий способ сделать мобильную версию сайта - использовать адаптивную вёрстку дизайна сайта. Для этого можно использовать CSS3 Media Queries - это когда в стилях дизайна сайта прописываются все возможные варианты разрешения экрана и как их отображать.

Метод адаптивной верстки является самым лучшим для создания мобильной версии сайта. На сайте EpicBlog.net используется именно этот метод.

Создание мобильной версии сайта с нуля - это очень не простой и долгий процесс. Необходимо протестировать сайт на разных устройствах, выявить и исправить все недочеты и ошибки. Для тестирования можно использовать "Режим адаптивного дизайна" в "Исследовании элемента" в браузере или Google сервис PageSpeed Insights

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

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

Всем удачи и добра!

Прочитано 469 раз

Поделитесь с друзьями этой статьей!

Макс Пуля

Приветствую! Присоединяйтесь к сообществу Epic Blog и выражайте свои мысли.

epicblog.net

Оставить комментарий