Successfully reported this slideshow.
Your SlideShare is downloading. ×

Jak nám responzivní web rozbil obrázky

Loading in …3
×

Check these out next

1 of 20
1 of 20

More Related Content

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Jak nám responzivní web rozbil obrázky

  1. 1. web rozbil obrázky @robinpokorny Jak nám responzivní
  2. 2. d1m22.deviantart.com <body> ! <img src=“charmander.jpg"/> ! </body>
  3. 3. Rob Gill
  4. 4. edge
  5. 5. responsiveimages.org
  6. 6. Výběr dle rozlišení zařízení
  7. 7. Výběr dle velikosti viewportu
  8. 8. 50% 100% 200% 400%25%
  9. 9. Výběr dle fyzický pixel CSS pixel
  10. 10. Art direction
  11. 11. <picture> v2
  12. 12. <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>
  13. 13. <source sizes=… srcset=… > <picture> v2
  14. 14. “<picture> je dnes vhodný k produkčnímu nasazení.” #10Tab Atkins @
  15. 15. much readywow such code very production so clever many usecases
  16. 16. http://m.Feedbando.com/rozbil shadehikari.deviantart.com <picture> Používej již dnes!

×