Shopware 5 & Modernizr

Shopware 5 Themes & Design
1

Hallo werte Community,

aktuell habe ich bei Shopware 5 folgendes Problem mit der Mordernizr Lib.

Ausgangslage:
Angenommen es gibt ein Logo in zwei Versionen (normale vs hohe Auflösung):

  • /frontend/_public/src/img/logos/LOGO.png
  • /frontend/_public/src/img/logos/LOGO@2x.png​

In der .tpl Datei wird auf die “normale” Version LOGO.png verlinkt.

Problem:
Wird die Seite mit einem Client der HiDpi unterstützt aufgerufen wird weiterhin die “normale” Version LOGO.png ausgeliefert.
Getestet mit Chrome Developer Tools.Custom-Device.Pixel Ratio: 2 und auf meinem Smartphone

Sollte Modernizr nicht automatisch prüfen ob der Client HiDpi unterstütz und dann, falls möglich, nach *@2x Versionen aller Bilder anfragen?

2

Hallo @AR0x7E7‍,

Modernizr ist eine Library, die nur eine Feature-Detection durchführt. Hierrüber wird z.B. geprüft ob der Browser „border-radius“ oder auch „localStorage“ unterstützt. Mit Retina / HiDP Images hat dies nichts zutun. Die Unterstützung hierfür ist direkt im Browser entweder per „img“-Element mit „srcset“-Attribut oder „picture“-Element. Zusätzlich verwenden wir das sogenannte Picturefill Plugin, um die Kompabilität von Retina-Images in nicht unterstützten Browsern zu gewährleisten. Für das Logo verwenden wir das „picture“-Element.

Viele Grüße,
Stephan Pohl  Shopware

1 „Gefällt mir“