Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
OPEN
WEB
SPACE
RESPONSIVE IMAGES
FÜR DESIGNER,
EIN BLICK AUF SRCSET
Lukas Kerecz
FORMLOS Berlin
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE
Lukas Kerecz
B.A. Kommunikationsdesigner, Dipl. Volkswirt
zehnjährige Erfah...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE
https://www.flickr.com/photos/unwiredben/2922315952 https://www.flickr.com/...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE
http://en.wikipedia.org/wiki/File:Vector_Video_Standards2.svg
FRAGMENTIERUNG
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“
https://www.flickr.com/photos/96802003@N07/11968027233
Ein...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“
https://www.flickr.com/photos/96802003@N07/11968027233
Ein...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“
https://www.flickr.com/photos/96802003@N07/11968027233
Ein...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“
https://www.flickr.com/photos/96802003@N07/11968027233
Ein...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“
https://www.flickr.com/photos/96802003@N07/11968027233
Ein...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“
Einzeln für alle!
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“
https://twitter.com/danscotton/status/184672861158518785
Ei...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“
https://twitter.com/danscotton/status/184672861158518785
Ei...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEWAS NUN?
https://www.flickr.com/photos/helga/3952984450
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEYEAH!
SRCSET
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEPIXELDICHTE
1x
2x 1.6x
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACESRCSET!
<img
srcset=“small.jpg 1x,
medium.jpg 1.6x,
large.jpg 2x“
src=“small...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
<img
srcset="large.jpg 1024w,
medium-crop.jpg 640w,
small-cr...
LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACERESSOURCEN & WEITERE INFOS
http://sjhcockrell.com/writing/2013/john-cleveley...
Nächste SlideShare
Wird geladen in …5
×

Responsive Images für Designer! Ein Blick auf "srcset" (Open Web Space . Juli 2014)

1.881 Aufrufe

Veröffentlicht am

Responsive Images für Designer! Ein Blick auf "srcset" (Open Web Space . Juli 2014)
www.open-web-space.de

Veröffentlicht in: Design
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Responsive Images für Designer! Ein Blick auf "srcset" (Open Web Space . Juli 2014)

  1. 1. OPEN WEB SPACE RESPONSIVE IMAGES FÜR DESIGNER, EIN BLICK AUF SRCSET Lukas Kerecz FORMLOS Berlin
  2. 2. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE Lukas Kerecz B.A. Kommunikationsdesigner, Dipl. Volkswirt zehnjährige Erfahrungen im Web-Bereich FORMLOS Berlin Branding & Interface Design Dozent design akademie berlin Webdesign & Webdevelopment
  3. 3. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE https://www.flickr.com/photos/unwiredben/2922315952 https://www.flickr.com/photos/miniyo73/8371683905 DAS PROBLEM
  4. 4. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE http://en.wikipedia.org/wiki/File:Vector_Video_Standards2.svg FRAGMENTIERUNG
  5. 5. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“ https://www.flickr.com/photos/96802003@N07/11968027233 Einer für alle!
  6. 6. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“ https://www.flickr.com/photos/96802003@N07/11968027233 Einer für alle!
  7. 7. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“ https://www.flickr.com/photos/96802003@N07/11968027233 Einer für alle!
  8. 8. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“ https://www.flickr.com/photos/96802003@N07/11968027233 Einer für alle!
  9. 9. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEAKTUELLE „LÖSUNG“ https://www.flickr.com/photos/96802003@N07/11968027233 Einer für alle! 2048 x 1638 Pixel 2.609 kB = 2,49 MB
  10. 10. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“ Einzeln für alle!
  11. 11. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“ https://twitter.com/danscotton/status/184672861158518785 Einzeln für alle!
  12. 12. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEBESSERE „LÖSUNG“ https://twitter.com/danscotton/status/184672861158518785 Einzeln für alle! min. 19 Versionen
  13. 13. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEWAS NUN? https://www.flickr.com/photos/helga/3952984450
  14. 14. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEYEAH! SRCSET
  15. 15. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACEPIXELDICHTE 1x 2x 1.6x
  16. 16. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACESRCSET! <img srcset=“small.jpg 1x, medium.jpg 1.6x, large.jpg 2x“ src=“small.jpg“ alt=“Much Venice - very wow!“ />
  17. 17. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
  18. 18. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
  19. 19. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“
  20. 20. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACE„ART DIRECTION“ <img srcset="large.jpg 1024w, medium-crop.jpg 640w, small-crop.jpg 320w" src="small-crop.jpg" alt="Much Venice - very wow!" />
  21. 21. LUKAS KERECZ × FORMLOS BERLIN × OPEN WEB SPACERESSOURCEN & WEITERE INFOS http://sjhcockrell.com/writing/2013/john-cleveley-responsive-news/ http://vimeo.com/99683665 http://ericportis.com/posts/2014/srcset-sizes/ http://www.smashingmagazine.com/2014/05/14/responsive-images-done-right-guide-picture-srcset/ http://www.matthew-steele.com/responsive-images-picture-srcset/ http://picture.responsiveimages.org/

×