Jak nám responzivní web rozbil obrázky

transcript

web rozbil obrázky@robinpokorny

Jak nám responzivní

d1m22.deviantart.com

<body> !

<img src=“charmander.jpg"/> !

</body>

Rob Gill

responsiveimages.org

Výběr dlerozlišení zařízení

Výběr dlevelikosti viewportu

50% 100% 200% 400%25%

Výběr dlefyzický pixelCSS pixel

Art direction

<picture> v2

<picture> !

<source media="(min-width: 40em)" srcset="big.jpg 1x, big-hd.jpg 2x”> !

<img src=“small.jpg" alt="Charmander" srcset=“small-hd.jpg 1024w, small.jpg 320w" sizes="(min-width: 20em) 33.3vw, 100vw” /> !

</picture>

<picture> v2

“<picture> je dnes vhodný k

produkčnímu nasazení.”

#10Tab Atkins @

much readywow

such codevery production

so clever

many usecases

http://m.Feedbando.com/rozbil

shadehikari.deviantart.com

<picture>Používej

již dnes!

Technology