[TYPO3-german] Responsive Images - Welche Rendering Methode?

[JCL - Johannes C. Laxander]

Hallo Jost,

danke für deine Tipps, die haben mir weitergeholfen. Ich hab nach ein wenig googlen noch dies hier gefunden: http://typo3blogger.de/responsive-images-typo3-6-2/

Nach diesem Beispiel habe ich es mal für mich unter TYPO3 6.2 getestet, und es funktioniert: http://demo62.jochla.de/content-examples/responsive-images.html. Ich denke das ist auch das was du machst. Jetzt geht es eigentlich nur noch darum, die richtigen breakpoints zu finden ;)

Gruß, Johannes.




> Jost Baron
> Gesendet: Freitag, 7. November 2014 14:23
> An: typo3-german at lists.typo3.org
> Betreff: Re: [TYPO3-german] Responsive Images - Welche 
> Rendering Methode?
> 
> -----BEGIN PGP SIGNED MESSAGE-----
> Hash: SHA1
> 
> Hi Johannes,
> 
> Für alte Browser gibt es meines Wissens nach keine Lösung 
> ohne JS, ausser über generierte Styles mit Mediaqueries (d.h. 
> inline-styles gehen nicht, da dort keine Mediaqueries erlaubt sind).
> 
> Egal welche Methode du nutzt für responsive Bilder, du 
> brauchst immer einen JavaScript-Polyfill, damit das in allen 
> momentan modernen Browsern funktioniert (wenn du nicht 
> irgendwelches User-Agent-Sniffing machen willst). Ich weiß 
> nicht, ob die vordefinierten Render-Methoden einen Polyfill 
> mitliefern, würde aber vermuten, dass das nicht der Fall ist, 
> denn die Polyfills gehen öfter mal nach Updates kaputt, vor 
> allem im Chrome.
> 
> 
> Nutzen tue ich momentan folgendes:
> 
> Für Bilder im Inhalt: <picture> mit srcset-Attributen 
> (ausschließlich für die device-pixel-ratio) in den <source>-Tags.
> 
> Für Bilder, die im Hintergrund über die ganze Bildschirmbreite gehen:
> <img> mit z.B. sizes="100vw" und srcset für 
> device-pixel-ratio und Breite.
> 
> 
> Gruß Jost
> 
> 
> On 11/07/2014 01:53 PM, JCL - Johannes C. Laxander wrote:
> > Hallo,
> > 
> > <picture> uns srcset-Attribute sind ja auch zwei Modi die in TYPO3
> > 6.2 implementiert sind. Frage: welches ist die "bessere" Lösung?
> > 
> > picturefill macht ja letztendlich nichts anderes, oder? Der Vorteil 
> > dabei, responsive Images sind aufgrund der jQuery 
> Funktionen auch mit 
> > älteren Browsern möglich. Nachteil: es wird JavaScript 
> benötigt. Für 
> > mobile Geräte ist sicher die rein CSS basierte Variante besser!?
> > 
> > Was ist Eure Meinung dazu?
> > 
> > Johannes.
> > 
> > 
> >> Jost Baron Gesendet: Donnerstag, 6. November 2014 18:06
> >> 
> > Hi Johannes,
> > 
> > ich nutze immer das hier:
> > 
> > https://github.com/scottjehl/picturefill
> > 
> > Das ist glaube ich mit keinem der eingebauten TYPO3-Modi 100%'ig 
> > kompatibel (dort gibt es sowohl <picture> als auch 
> srcset-Attribute).
> > 
> > Allerdings ist das aller Wahrscheinlichkeit nach sehr nah 
> an kommenden 
> > Browserimplementationen und Standards dran, der Chrome hat meines 
> > Wissens schon eine teilweise Implementierung davon.
> > 
> > Gruß Jost
> > 
> > On 11/06/2014 05:20 PM, JCL - Johannes C. Laxander wrote:
> >>>> Hallo,
> >>>> 
> >>>> mich würde mal interessieren, welche Kriterien / Argumente
> > für die in
> >>>> TYPO3 6.2 integrierten Rendering Methoden sprechen:
> >>>> 
> >>>> srcset picture data
> >>>> 
> >>>> Welche Methode ist unter welchen Bedingungen empfohlen?
> > Welche Methode
> >>>> wendet ihr an?
> >>>> 
> >>>> 
> >>>> Gruß, Johannes.
> >>>> 
> > 
> >> _______________________________________________ 
> TYPO3-german mailing 
> >> list TYPO3-german at lists.typo3.org 
> >> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
> >> 
> > 
> 
> -----BEGIN PGP SIGNATURE-----
> Version: GnuPG v1
> 
> iEYEARECAAYFAlRcx6EACgkQNme/yCvmvTLBfACfaDwGJ2DQfB0SOEGZg78aNFrT
> mlAAnjrpgeY7lhwUeGBY/FsZCi3A9ehm
> =siXb
> -----END PGP SIGNATURE-----
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>