11 Reaktionen zu “Adaptive Images in TYPO3 integrieren”

Kommentare abonnieren (RSS) oder TrackBack URL

Hi,
I have a problem with adaptive-images and htaccess file. When I insert the:
RewriteRule ^.*\.(jpg|jpeg|png|gif)$ adaptive-images.php [L]
line to file all images from site disapering…

I have installed TYPO3 4.7.8 and insert standard htaccess file.

What I’m doing wrong?

Adrian am 27. Februar 2013 um 22:38

Do you add the chache folder ‚ai-cache‘ and is it writable? Are the PHP errors in the error log?

Sven Wolfermann am 28. Februar 2013 um 09:02

Hi,
I have ai-cache folder and yes – it is wtritable (777).
In my log I have lots of this error:
Core: Error handler (FE): PHP Warning: strpos() [function.strpos]: Empty delimiter in /home/my_folders/public_html/typo3_sites/test-site/typo3conf/ext/adx_less/Classes/Hooks/Pagerenderer.php line 21

But I don’t think that is the problem

Adrian am 28. Februar 2013 um 18:17

Hallo,
bei der „Umsetzung in TYPO3“ fehlt noch ein Hinweis, was mit „lib.adaptive-images“ geschehen soll. Muss ich das nicht innerhalb „tt_content.image.20“ zuweisen?

Sven Burkert am 22. April 2013 um 11:44

also bei mir funktioniert die JQuery/typoscript Lösung schlichtweg nicht. Mir leuchtet ebenfalls nicht ein, warum lib.adaptive-images nicht noch irgendwie eingebunden wird.

Jan am 23. April 2013 um 12:39

Danke, Sven, für diese schöne Zusammenstellung für / aus TYPO3-Sicht! Ergänzend möchte ich mir an dieser Stelle erlauben, auf mein gerade veröffentlichtes Projektchen „squeezr“ hinzuweisen. In Bezug auf die Behandlung von Bildern hat mir das oben beschriebene „Adaptive Images“ Modell gestanden, weshalb sich Funktionalität und Einsatz weitgehend decken. Ich war allerdings bemüht, ein paar „Schönheitsfehler“ von AI zu korrigieren, darunter z.B.
– die Tatsache, dass bei AI wirklich *jedes* Bild von PHP behandelt wird, selbst ein solches, das zuvor bereits generiert und gecachet wurde,
– dass AI nur mangelhaft mit den HTTP-Headern arbeitet, die ein Browser braucht, um die Bilder ordentlich lokal zu cachen (mit fatalen Folgen: Bilder, die überhaupt nicht skaliert werden brauchen, werden vom Browser niemals gecachet, und alle anderen erst beim dritten statt beim zweiten Aufruf …),
– u.s.w.

Anders als bei AI findet bei squeezr die Definition der Breakpoints nicht serverseitig, sondern beim Client statt, also im JavaScript bzw. im HTML-Quellcode. Trotzdem ist der Einsatz von squeezr vergleichbar einfach wie oben beschrieben. Daneben plane ich, demnächst eine entsprechende TYPO3-Extension zu veröffentlichen, die einem die Installation und Konfiguration erleichtert / abnimmt.

Neben der Behandlung von Bildern kümmert sich squeezr auch um die Reduktion von überflüssigem CSS, indem er bereits auf dem Server CSS3 Media Queries auswertet und für das jeweils genutzte Gerät irrelevante Passagen entfernt (und optional auch CSS-Minifizierung anwendet). Ausführliche Infos sowie den Download (aktuell in der ersten Beta) gibt’s unter

http://squeezr.it

bzw. bei GitHub unter

https://github.com/jkphl/squeezr

Ich würde mich sehr über Tester und Feedback jeder Art freuen!

Schließlich darf ich noch unterstreichen, was Sven bereits in seinem Artikel dargestellt hat: Serverseitige Lösungen wie Adaptive Images oder squeezr sind keine langfristigen Lösungen für das Problem responsiver / adaptiver Bilder, auch wenn sie für den Moment einfach und effektiv funktionieren mögen. Es sollten vielmehr die diversen Initiativen zur Entwicklung geeigneter Standards unterstützt werden, z.b. die „Responsive Images Community Group“ (http://responsiveimages.org) oder ganz aktuell die entsprechende Appelle an die Browserhersteller (https://bugzilla.mozilla.org/show_bug.cgi?id=870022 oder https://code.google.com/p/chromium/issues/detail?id=233751).

Joschi Kuphal am 29. Mai 2013 um 23:04

@Lösung über

Das alt Tag des Bildes wird nicht überausgegeben.

soma am 28. August 2013 um 13:30

Sorry @Lösung über noscript
Das alt Tag des Bildes wird nicht übergegeben.

soma am 28. August 2013 um 13:33

Hallo soma! Puh, stimmt. Kann ich auf die Schnelle gar nicht lösen. 🙁

Sven Wolfermann am 28. August 2013 um 15:28

Hallo Sven,
ist es vielleicht möglich ein data-alttext=“your alt text“ in das noscript via TypoScript einzufügen und das dann mit jquery weiterzugeben -> alt=“‚ + $(this).attr(‚data-alttext‘) + ‚“

Es wird auch kein Link weitergereicht, wenn dieser im BE gesetzt ist.

soma am 29. August 2013 um 12:20
Trackbacks & Pingbacks

[…] Ein Problem im Responsive Webdesign ist es weiterhin Bilder in optimierten Bilddimensionen zur Verfügung zu stellen.  […]

Pingback von Adaptive Images in TYPO3 integrieren | Web & CMS | Scoop.it am 28. Februar 2013 um 20:41
Ein Kommentar hinterlassen


 Name


 Mail (wird nicht veröffentlicht)


 Website

Bitte beachten sie, dass ihr Kommentar möglicherweise erst freigeschaltet werden muss.

Kategorien

Archiv (Quick)

Dezember 2016
M D M D F S S
« Nov    
 1234
567891011
12131415161718
19202122232425
262728293031