Разные подходы в разработке сайтов с поддержкой мобильных устройств

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

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

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

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

Если для сайта создается отдельная мобильная версия, то такая версия, как правило, размещается на поддомене основного сайта. Перенаправление пользователей, заходящих на сайт с мобильных устройств, при этом осуществляется чаще всего автоматически в зависимости от присвоенного значения User-agent.

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

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

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

Преимущества и недостатки адаптивного дизайна сайта

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

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

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

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

Например, как известно, псевдоселектор CSS :hover, часто используемый при создании выпадающих меню на сайтах, на мобильных устройствах с сенсорными экранами не работает, и если для отображения сайта на таких устройствах не задать отдельные правила демонстрации меню, то в таком случае работать эти меню просто не будут.

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

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

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

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