Сегодня многие интернет-пользователи посещают сайты с мобильных устройств. Причем количество таких посетителей постоянно растет, так что вопрос корректного отображения страниц на компактном экране стоит как никогда остро. Что лучше: создавать специальные мобильные версии сайтов, или делать ресурсы самостоятельно адаптирующимися под смартфоны и планшеты?
Адаптивный дизайн
Для создания дизайна, автоматически подстраивающегося под экран, применяется CSS3 Media Queries.
Преимущества методики:
- Не требуется дополнительный URL для мобильной копии сайта, что удобно и для разработчиков (при обслуживании, продвижении), и для пользователей ресурса (посещающих его, как с мобильных, так и стационарных устройств).
- Простота разработки. Адаптивный дизайн избавляет от необходимости создания, по сути, второго сайта.
Недостатки
Основной недостаток — массивность страниц и медленная загрузка. При адаптации под маленький экран на странице сохраняются все элементы, включая embedded-карты, рекламные и информационные ролики, различные калькуляторы, меню с анимацией и т.д.
Их загрузка (а страницу приходится обычно загружать полностью) доставляет ряд неудобств. При этом цели, с которыми посещают сайт с мобильных и стационарных устройств, несколько отличаются. Большинству пользователей смартфонов интересен далеко не весь материал, размещенный на полноценной версии сайта, поэтому и загружать лишние объекты нет никакой необходимости.
Второй недостаток — отсутствие выбора. При наличии у сайта мобильной версии пользователю предоставляется возможность загружать, как «легкий», упрощенный во всех отношениях вариант, так и полноценный. Если сайт адаптивен, такой возможности нет.
Мобильная версия
Представляет собой урезанную версию сайта, лишенную тяжеловесных, а также непопулярных среди пользователей смартфонов и планшетов, графических, функциональных элементов.
Основные преимущества:
- Простота поддержки. Мобильная версия – это отдельный сайт для смартфонов и планшетов, на котором можно осуществлять любые изменения, независимо от основного ресурса.
- Удобство для пользователя. Легкие, быстро загружающиеся страницы и только самый необходимый функционал. Это особенно актуально при медленном интернет-соединении.
- Возможность загрузки как мобильной, так и полноценной версии.
Недостатки:
- Разные URL-адреса. Это создает дополнительные хлопоты разработчикам и неудобства пользователям (в случае, если нет автоматической переадресации при заходе с мобильного устройства). Без грамотного использования мета-тегов rel=«alternative» и rel=«canonical» могут возникнуть проблемы с поисковиками, обнаружившими дублирующийся котент.
- Необходимость урезать контент при создании мобильной версии может негативно отобразиться на общей информативности и функциональности ресурса. Поскольку оба варианта имеют как преимущества, так и недостатки, выбор для каждого конкретного случая следует осуществлять в индивидуальном порядке. «Легкие» сайты стоит адаптировать, для крупных порталов — создавать мобильные версии
Узнать подробнее о поисковом продвижении сайта в МОССЕО:
Вопросы и ответы: адаптивный дизайн и мобильная версия
Что такое адаптивный дизайн и какие у него преимущества?
Для создания дизайна, автоматически подстраивающегося под экран, применяется CSS3 Media Queries. Главное преимущество в том, что не требуется дополнительный URL для мобильной копии сайта, а это удобно и разработчикам при обслуживании и продвижении, и пользователям, которые заходят как с мобильных, так и со стационарных устройств. Кроме того, адаптивный дизайн прост в разработке, потому что избавляет от необходимости создавать, по сути, второй сайт.
Какие недостатки есть у адаптивного дизайна?
Основной недостаток состоит в массивности страниц и медленной загрузке. При адаптации под маленький экран на странице сохраняются все элементы, включая embedded-карты, рекламные и информационные ролики, калькуляторы и меню с анимацией, а страницу приходится обычно загружать полностью. Второй недостаток: отсутствие выбора. Если у сайта есть мобильная версия, пользователь может загрузить как легкий вариант, так и полноценный, а при адаптивном дизайне такой возможности нет.
Что такое мобильная версия сайта и чем она удобна?
Мобильная версия представляет собой урезанную версию сайта, лишенную тяжеловесных, а также непопулярных среди пользователей смартфонов и планшетов графических и функциональных элементов. Это отдельный сайт, на котором можно осуществлять любые изменения независимо от основного ресурса, что упрощает поддержку. Страницы легкие и быстро загружаются, остается только самый необходимый функционал, что особенно актуально при медленном интернет-соединении. Кроме того, можно загрузить как мобильную, так и полноценную версию.
Какие недостатки у мобильной версии и как сделать выбор?
У мобильной версии разные URL-адреса, что создает дополнительные хлопоты разработчикам и неудобства пользователям, если нет автоматической переадресации при заходе с мобильного устройства. Без грамотного использования мета-тегов rel=«alternative» и rel=«canonical» могут возникнуть проблемы с поисковиками, обнаружившими дублирующийся контент. Кроме того, необходимость урезать контент может негативно отразиться на информативности ресурса. Выбор следует делать индивидуально: легкие сайты стоит адаптировать, а для крупных порталов создавать мобильные версии.
