0

Всем привет! Работаю над своим первым адаптивом, многих нюансов пока не знаю.

Вопрос следующий: насколько целесообразно использовать свойство display со значением none? Для примера: шапки для экранов шириной 320px и 1024px абсолютно разные. Я сделал 2 header-блока с соответствующей разметкой и стилями: по умолчанию шапка для 320px скрыта с помощью display:none и отображается только при соответствующем медиазапросе (а шапка для 1024px, соответственно, скрывается тем же свойством).

Так вообще делается или нужно идти другими путями?

Знаю, что можно использовать для этих целей JS, но вопрос актуален.

2 ответа 2

1

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

2
  • Спасибо! На скорость загрузки никак не влияет?
    – ucleacid
    10 янв 2017 в 3:59
  • @uncleacid Влияет. Но значительно или нет без кода сказать нельзя, но вам тут и не скажут. Не будете же вы приводить сюда весь проект. И в любом случае надо брать и измерять насколько значительно это влияние вам самим. 10 янв 2017 в 5:53
0

То есть получается что в html разметке существует одновременно две шапки, только одна из них выключена? Вообще так не делается, так как html грузится до css и получается, что у вас подгружается целый лишний блок, а это влияет на время загрузки сайта - следовалеьно на его seo. Лучше создать в css под определенные размеры медиазапросы и ими уже выключать не нужные элементы. А не дублировать шапки.

3
  • Да, в разметке две шапки. Дизайнеру, конечно, руки оторвать нужно за такое: если не знать, что это дизайн под два разных разрешения - не поймешь. Выглядит, грубо говоря, как два разных сайта, разве что цветовая гамма одна. Спасибо за ответ!
    – ucleacid
    10 янв 2017 в 3:56
  • Лишняя пара килобайт погоды особо не сделают, главное не увлекаться.
    – Gmikcon
    10 янв 2017 в 4:46
  • Don't repeat your self
    – Denisoed
    10 янв 2017 в 5:20

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.