Ru | Eng

Мы занимаемся созданием
и продвижением веб и мобильных решений

закрыть

Оставить заявку

Оставить заявку

Проблематика разработки мобильных сайтов

17.06.16
Share:

Мобильная версия или адаптивный сайт?

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

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


Различность платформ, устройств, браузеров.

Большое количество различных мобильных устройств с разными размерами экранов порождает проблему корректного отображения мобильной версии на всех этих экранах. Мобильные сайты, которые хорошо выглядят и работают к примеру на ios устройствах, могут не так хорошо отображаться на андроидах. Особенно проблемы появляются на старых версиях андроидов с нестандартными разрешениями экранов. Кроме того, некоторые элементы интерфейса на некоторых платформах могут не срабатывать. Например, тач слайдеры и некоторые js модули не работают на вин фонах. Масла в огонь подливает несовершенство мобильных браузеров. И если в последнее время флагманы мобильного браузинга safari, android browser, chrome делают все чтобы максимально удовлетворить потребности мобильных серферов,  то у explorerа, opera mobile, firefox это получается не так хорошо.


Тестирование мобильных сайтов.

Если вы прочитали предыдущий абзац, то вы наверное представляете сколько проблем ложиться на плечи тестировщиков мобильных сайтов. Часто приходиться замечать, что мобильный сайт хорошо выглядит и работает всего лишь на 2-3 устройствах, на других же есть явные баги и проблемы. Очевидно, что такой мобильный сайт был протестирован только на личных устройствах разработчиков, а как он выглядит на других устройствах, никто особо не смотрел.

Вопрос  - «как протестировать мобильный сайт, так чтобы выявить проблемы на всех сразу устройствах и браузерах?» - остается риторическим. Теоретически могут помочь симуляторы устройств, которые не сложно найти в интернете. Но, практически они только усугубляют проблемы. Ведь ориентируясь на симулятор, мы так и не знаем, как на самом деле сайт работает на устройстве. Отображение на симуляторе очень часто не соответствует отображению на реальном смартфоне или планшете.  Самый оптимальный вариант - тестировать только на реальных устройствах. Конечно, не реально протестировать  на абсолютно всех смарфтонах, но если выделить группы смежных по характеристикам устройств, то можно обойтись 10-15 моделями, тестирование на которых даст примерно 90% соответствие с реальными показателями.


Интеграция мобильной версии с CMS.

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

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

Этот способ иммет право на жизнь, но у него есть некоторые недостаки:

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

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


Мобильная версия для всех устройств.

Перед тем как делать мобильную версию сайта рекомендуется провести небольшой анализ поведения пользователей заходящих на ваш сайт с мобильных устройств. Это даст много полезной информации. Особенно следует обратить внимание на соотношение заходов с планшетов и смартфонов. Ведь, зачастую мобильная версия делается только под смартфоны, а на планшетах - или открывается десктопный сайт или растягивается смартфонная версия. И тот и тот способ как вы понимаете не есть оптимальным. Наилучшим решением будет создание мобильно-адаптивной версии, где будет учтена адаптация верстки в зависимости от устройства (или размера экрана). Фактически проектируется 2 вида мобильный и планшетный (можно больше, если учитывать смену ориентации устройств) и соединяются в единой верстке. Получается одна мобильная версия, но адаптированная для использования и на смартфонах и на планшетах.

 

Share:
Комментарии