Hallo zusammen, habe mir in PS6 eine Logo erstellt und auch in der dementsprechende Auflösung als jpg abgespeichert. Dann das Logo im Backend eingepflegt. Wenn ich mir nun das Logo im Shop ansehe kommt mir das vor als wenn die schärfe etwas verloren gegangen wäre, ja als wenn das Logo hoch gepixelt wird. Habe ich hier ein Denkfehler? Hier mal der Link
Das Logo sollte aufgrund der Retina Displays in doppelter Auflösung vorliegen. Daher ist es auch etwas unscharf. Lädst du das Logo in doppelter Größe hoch, dann wird es gestochen scharf sein 
[quote=“kayyy”]… Lädst du das Logo in doppelter Größe hoch, dann wird es gestochen scharf sein ;)[/quote] Und was ist dann mit der Datenmenge/Dateigröße?
[quote=“Tanny”][quote=“kayyy”]… Lädst du das Logo in doppelter Größe hoch, dann wird es gestochen scharf sein ;)[/quote] Und was ist dann mit der Datenmenge/Dateigröße?[/quote] Der normale Desktop PC ohne Retina lädt dann natürlich auch trotzdem das Bild in doppelter Größe. Was jetzt aber keinen gravierenden Unterschied macht - ein paar kb. Möchte man das ganze aber umgehen gibt es bspw. ein kleines jQuery Plugin, welches schaut ob ein Retina Display vorhanden ist. Falls ja wird das Image in doppelter Größe geladen und falls nicht die normale Größe. Eine weitere Alternative wäre hier bspw. das Logo als .svg zu hinterlegen. Ein .svg Image ist dann entsprechend auch in der Regel noch einmal kleiner von der kb Größe her und wird auch direkt auf allen Endgeräten scharf dargestellt. Allerdings muss das .svg entsprechend auch als Vektor vorliegen. Man sollte nicht einfach das .jpg/.png als .svg abspeichern, denn das bläht die Datei wieder auf.
…prima, danke für die Rückmeldung. Muss ich dann noch mal dran arbeiten. [quote]Möchte man das ganze aber umgehen gibt es bspw. ein kleines jQuery Plugin, welches schaut ob ein Retina Display vorhanden ist. Falls ja wird das Image in doppelter Größe geladen und falls nicht die normale Größe. Eine weitere Alternative wäre hier bspw. das Logo als .svg zu hinterlegen. Ein .svg Image ist dann entsprechend auch in der Regel noch einmal kleiner von der kb Größe her und wird auch direkt auf allen Endgeräten scharf dargestellt. Allerdings muss das .svg entsprechend auch als Vektor vorliegen. Man sollte nicht einfach das .jpg/.png als .svg abspeichern, denn das bläht die Datei wieder auf.[/quote] Das hört sich für mich als Leye zu komplex an 
[quote=„kayyy“]Möchte man das ganze aber umgehen gibt es bspw. ein kleines jQuery Plugin, welches schaut ob ein Retina Display vorhanden ist. Falls ja wird das Image in doppelter Größe geladen und falls nicht die normale Größe.[/quote] In welche Datei käme das jQuery Plugin im SW 5.1.1? Und würde dann das Logo in zwei Größen hochgeladen? Danke
[quote=“Tanny”][quote=“kayyy”]Möchte man das ganze aber umgehen gibt es bspw. ein kleines jQuery Plugin, welches schaut ob ein Retina Display vorhanden ist. Falls ja wird das Image in doppelter Größe geladen und falls nicht die normale Größe.[/quote] In welche Datei käme das jQuery Plugin im SW 5.1.1? Und würde dann das Logo in zwei Größen hochgeladen? Danke[/quote] Das Script kommt in deine Theme.php Du kannst das Script entweder manuell in deinen Ordner packen, oder aber direkt über Bower installieren. bower install imulus/retinajs --save. Der Pfad zum Script wäre dann ‘vendors/js/jquery/retina.js’. So kann du später auch alles komfortabel über bower updaten. Das Image in doppelter Größe musst du dann im selben Ordner Pfad ablegen wie dein Image. Das Image muss genauso heissen wie die eigentliche logo Datei mit einem @2x dran gehangen. Also bspw. /media/logo.png ist das normale Desktop Logo und das für Retina Displays muss dann /media/logo@2x.png heißen. Das Plugin holt sich dann automatisch die entsprechenden Dateien je nach Display.
1 „Gefällt mir“