WEBP Bilder innerhalb von OXID EShop einbinden

  • Post Category:OXID

Performance matters, so lautet die Hauptaussage im Bereich E-Commerce seit Jahren. Damit Webseiten und Online Shops auch über mobile Netzwerke schnell und effizient geladen werden können, wurde von Google ein neues Grafikformat entwickelt.

WebP wurde zuerst im Jahre 2010 vorgestellt und ist mittlerweile in vielen Browsern nutzbar. Um Grafiken im WebP Format durch den OXID EShop ausliefern zu lassen, genügen ein paar Zeilen, die zusätzlich in die .htaccess Datei im source Verzeichnis des Shops eingetragen werden müssen.

    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{REQUEST_FILENAME} (.*)\.(jpg|png)$
    RewriteCond %1\.webp -f
    RewriteRule ^(.*)\.(jpg|png)$ $1.webp [L,T=image/webp]

Diese Zeilen fügt man vor

    RewriteCond %{REQUEST_URI} (\/out\/pictures\/generated\/)
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule (\.jpe?g|\.gif|\.png|\.svg)$ getimg.php [NC]

in die .htaccess ein.

Als erstes wird geprüft, ob der Brower in seinem Request mitteilt, dass er das Format webp akzeptiert. Sollte dieses der Fall sein, wird geprüft ob die angeforderte Ressource vom Dateityp JPEG oder PNG ist. Trifft beides zu, erfolgt nun noch eine kurze Prüfung, ob die angeforderte Datei auch im Format webp in dem entsprechenden Verzeichnis vorhanden ist. Ist auch diese Prüfung erfolgreich, wird intern der Request auf die webp Variante umgeschrieben, und im Response noch der Dateityp image/webp gesetzt. Das Umschreiben erfolgt NUR intern und nicht per 301/302 HTTP Status Code.

Wie man nun die entsprechenden Bilder in webp konvertieren kann, beschreiben wir in dem folgenden Blog Eintrag.

https://www.twisted-brains.org/oxid-bilder-im-format-jpeg-png-nach-webp-konvertieren/