victory_vas
@victory_vas

Как лучше верстать адаптивный сайт, когда на мобильных скрывается много контента?

Всем привет.
Предстоит верстать новый сайт. Ситуация такова, что по макетам на планшетах и мобильных гораздо меньше контента по сравнению с десктопом. Убираются несколько слайдеров, много фотографий и некоторый функционал.
Задумалась над тем, что не хотелось бы грузить лишний код и фотки на мобильных, а потом скрывать типа display: none. Как тут лучше приступить к разработке? Может какую-то библиотеку посоветуете, или какой-то особенный подход. Просто не разбираюсь, к сожалению, в таких моментах адаптивной верстки - обычно все блоки как-то перестраивались, но не пропадали совсем.
  • Вопрос задан
  • 489 просмотров
Пригласить эксперта
Ответы на вопрос 3
PavelMonro
@PavelMonro
Скрывается любым классом по условиям по сути .hidden-md, hidden-xs и другие в бутстрап например.
А вот чтобы не загружалось то тут только уже либо Js, jQuery либо php, определять что это смартфон, после поставить условия что такие то блоки не подгружаем
Ответ написан
Urvin
@Urvin
Это двойная работа, и при изменениях все равно что-нибудь похерится и сломается.
Стоит ли экономия свеч?
Ответ написан
Смысл адаптивного сайта в том, что он дает одинаковые возможности (функционал, контент и т.д.), одновременно обеспечивая наилучший пользовательский опыт на любом устройстве.

Если зайдя с телефона я не могу что-то увидеть/прочитать/сделать на сайте - это проблема.

В таких случаях следует делать отдельно большую/тяжелую/функциональную версию и отдельно легкую/урезанную мобильную. С возможностью нажать "показать полную версию" даже если пользователь зашел с телефона.

Помимо UX есть и техническая сторона.
Адаптивный сайт не требует каких-то особых оптимизаций. Спрайты, свг-иконки, минификация, структура, грамотный js код и т.д. - это уже по дефолту должно делаться.
Но есть момент с контентом: адаптивные изображения, адаптивные изображения в css (фоны например).
Все поскрывать можно. Но вот картинки с display: none; все равно на данный момент грузятся во многих браузерах.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы