Отдельный мобильный сайт

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

Преимущества в данном случае таковы:

  • Автономность: разработчики могут вносить изменения отдельно в десктопную и мобильную версию;
  • Быстрое время загрузки: в случае создания сайта под мобильные устройства необязательно использовать сложную анимацию и фишки, разработчики могут оптимизировать сайт для мобильной аудитории;
  • Удобная навигация: сайт спроектирован с учетом задач аудитории с мобильных устройств.

Недостатки:

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

Адаптивный веб-дизайн

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

Если говорить об адаптивной верстке сайтов, то следует упомянуть, что в специализированных источниках часто используют разные названия или типы дизайна. И это несколько вводит в тупик, поэтому надо четко определиться с терминами. Общее, что их объединяет, — сайт подстраивается под любой размер экрана, а уже каким методом это выполняется, зависит от личных предпочтений и квалификации исполнителя.

Adaptive design (адаптивный)

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

Responsive design (отзывчивый)

Объединяет в себе черты «адаптивного» и «резинового» дизайна. Он подстраивается под любое разрешение экрана, как при «резиновой» верстке, но также перестраивает и порядок контентных блоков. Это наглядно показано на сайте liquidapsive.com. Понять суть этого принципа можно, выбрав тип дизайна (статичный, резиновый, адаптивный и отзывчивый) в правом верхнем углу и изменив размер окна браузера.

RESS

Этот метод, использующий программирование на стороне сервера, чтобы создать CSS и HTML для различных устройств: мобильные пользователи получают один набор кода, а пользователи десктопных компьютеров — другой. Таким образом, происходит оптимизация кода в зависимости от устройства, что значительно увеличивает скорость загрузки контента.

Есть и другие способы реализации, я выделил лишь основные. Непосредственно на реальных проектах мы предпочитаем использовать из каждого метода лучшее, комбинируя оптимизацию кода RESS и гибкость Resposive design.

Преимущества:

  • Один адрес у страницы: это положительно сказывается на шеринге страниц;
  • Наследственность: навигация, расположение контента похоже на всех устройствах, что положительно сказывается на адаптации пользователей к сайту Сохранность контента: контент в абсолютно полном объеме на всех устройствах;
  • Поддержка одного сайта: здесь все просто, вам не надо одновременно развивать несколько версий сайта;
  • Подстройка под любые устройства: грамотно спроектированный адаптивный дизайн подразумевает не только наличие мобильной версии, но и подстройку под такие устройства как ТВ, планшеты, игровые устройства (PSP);
  • Оптимизация под SEO и работу с поисковыми роботами: следует из наличия одной версии страницы, без ее дублирования и усложнения структуры сайта;

Недостатки:

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

Дата публикации: 16.03.2015
← Назад