Мобильная версия сайта. Рекомендации перед внедрением.

Выделяют обычно 3 основные технологии разработки мобильной версии сайта:

  • Отдельная мобильная версия сайта

  • RESS (Responsive Design + Server Side)

  • Адаптивный дизайн

Отдельная мобильная версия сайта. Как вы уже знаете, это когда сайт лежит на отдельном поддомене (например, m.vk.com). Ее основные достоинства – легкость в изменениях, которые никак не затрагивают основную версию сайта, из-за чего в мобильную версию легко вносить изменения. Также, удобство пользователя – мобильная версия сильно упрощена под мобильные устройства, дизайн выполнен соответствующе. И конечно, быстрота работы, так как, в общем-то сама цель мобильной версии – чтобы она удобно и быстро работала на малых скоростях мобильного интернета.

Теперь о недостатках. Несколько адресов, адрес обычного сайта + адрес мобильной версии, простой пример – вы с мобильного устройства скопировали адрес ссылки на мобильную версию и отправили другому пользователю, который открыл ее на десктопе. Соответственно, открывается мобильная версия, и, как правило, приходится удалять букву «m» с точкой из адреса. Это не столь большая проблема, но, все же, порой с адресами выходит путаница. Помимо прочего, для SEO несколько адресов являются сложностью, приходится правильно расставлять, скажем так, приоритеты – какие страницы поисковику показывать или скрывать от индексации. Ну и, безусловно, мобильная версия сайта ограниченна по функционалу по сравнению с полноценной, что порой может быть существенным неудобством.

RESS (Responsive Design + Server Side). Суть всей технологии в том, что на стороне сервера определяется с какого типа устройства пользователь обратился к сайту, и, в зависимости от этого, предоставляем ему тот или иной контент (шаблон). Также, если человек зашел со смартфона под ОС Android – предоставляем ему ссылку Google Play, или на AppStore, если речь об iOS.

Недостатки данного варианта – сложность в разработке и возможные ошибки в определении устройства (тут все зависит от ручной настройки порядка определения).

Адаптивный дизайн. Получается, это один сайт с дополнительными версиями (под смартфоны и планшеты). Вариант избавляет от ненужных редиректов и не нагружает дополнительными проблемами SEO-специалистов, в отличие от мобильной версии. Также, это очень удобно для разработки, есть наборы инструментов для создания адаптивного дизайна, например, Bootstrap и MDL. Но, в то же время, адаптив медленно грузит страницы, ведь основа сайта делается для ПК, отсюда картинки большого размера, сложный фон и так далее. Также, сложно правильно структурировать контент.

Чтобы понять, какой вариант выбрать, необходимо взглянуть на последние тенденции развития интернета, ведь осенью 2016 года количество людей, заходящих в интернет в основном со смартфонов превысило количество пользователей десктопов. Поэтому мы рекомендуем известный ныне принцип MobileFirst – делаем сначала мобильную версию, а потом десктопную.
У него есть 3 требования, которые необходимо выполнять:

  1. Показывать самое важное содержание в первую очередь.

  2. Вебсайт должен быть легковесным и оптимизированным.

  3. Вебсайт не должен загружать больше ресурсов, чем требуется пользователю для получения нужной информации.

В заключение хотелось бы добавить, что технологии активно развиваются, и в данный момент адаптивный дизайн – самое оптимальное решение для веб-проектов, потому как разрабатывать и обслуживать отдельную мобильную версию не совсем удобно. У адаптивного дизайна больше плюсов, а перечисленные минусы легко решаются, например, таким фреймворками как https://getmdl.io, где можно грамотно размещать информацию и есть технологии, которые позволяют снизить объем трафика на странице.

Дата публикации

31 января 2017

Расскажите о вашей задаче