Баннеры в мобильной версии

[pawana]

Здравствуйте.

 

Хочу услышать от знающих.

 

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

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

[anboza]

для того, чтобы грузилось только то, что нужно, необходимо делать несколько версий: для ПК, для планшета, для мобильного. через mobile-detect. Если вы делаете просто резинку и скрываете отображение стилями, то естественно, все грузится так же, просто не показывается.

второй вариант - грузить изображения, в соответствии с размером экрана отображения. Это можно сделать стилями, но дизайнер вам "спасибо" не скажет, так как ему придется готовить 3-4 формата, одной и той же картинки

Змінено 9 грудня 2019 користувачем anboza

[pawana]

Спасибо за совет, идея понятна.

[Blast]

19 часов назад, pawana сказал:

Здравствуйте.

 

Хочу услышать от знающих.

 

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

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

Может такое поможет https://habr.com/ru/post/237991/

можно делать примерно так:

<img data-src="/path-to-image.jpg">

а потом скриптом отслеживать попадает ли изображение в отображаемую область и если у него style.display != 'none' (который установится или не установится медиа-запросом), то копировать значение атрибута data-src в src

[AndreyQ]

16 часов назад, anboza сказал:

для того, чтобы грузилось только то, что нужно, необходимо делать несколько версий: для ПК, для планшета, для мобильного. через mobile-detect. Если вы делаете просто резинку и скрываете отображение стилями, то естественно, все грузится так же, просто не показывается.

второй вариант - грузить изображения, в соответствии с размером экрана отображения. Это можно сделать стилями, но дизайнер вам "спасибо" не скажет, так как ему придется готовить 3-4 формата, одной и той же картинки

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

[pawana]

12 часов назад, AndreyQ сказал:

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

Не об этом речь. Баннеров на главной может быть до одного метра (слайдер, к примеру), а 1 метр на нашем офигенном 4G... иногда бывает долго . Гугл очень сильно бьет по шапке за скорость загрузки на мобильных, да и не только в нем дело, у меня ~ 60% трафика с мобильных. По-этому сайт должен грузиться очень быстро.