Портфолио | Дизайн
Дизайн

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



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

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

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

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

Решит ли проблему мобильная версия сайта

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

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

Кроме того, если сделать мобильную версию сайта на отдельном поддомене и не принять специальных мер, могут появиться страницы с разными адресами URL и одинаковым содержимым. Это может привести к проблемам с поисковым продвижением сайта из-за склейки страниц.

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

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

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

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

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

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



Плагин адаптивного дизайна

Саймый простой способ установить на сайт вашего интернет-магазина адаптивный дизайн — приобрести у нас плагин адаптивного дизайна.

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

Установить плагин адаптивного дизайна можно в административном сайте вашего интернет-магазина.

Откройте магазин сейчас