Ко всем проектам

Адаптация сайта под мобильные устройства

25 лет компания «Чайка-Тур» занимается организацией туров в Германию. Здесь вам предложат полный комплекс услуг: разные виды туров, бронирование билетов и отелей, аренда автомобилей.

Задача:
адаптировать сайт под мобильные устройства.

Нам досталась непростая задача — адаптировать старый сайт со сложным функционалом и большим количеством интерфейсов. Ресурс содержит очень много разнообразной информации, отдельная усеченная мобильная версия такого проекта не лучший вариант — в перспективе это бы сулило увеличение трудозатрат на поддержку нескольких версий сайта. Кроме того, это не решило бы проблемы продвижения услуг компании в Интернете, сильно ограничило бы функционал ресурса мобильной версии.

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

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

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

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

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

 

В помощь при разработке туристического сайта:

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