Umscharfe Bilder

[Bruno-der-Zweite]

Moin,

bei mir sind die Artikelbilder (nur die Infobilder) irgendwie total unscharf. Hab ich da irgendwas falsch eingestellt? Das Problem hab ich nur mit dem responsive Template, beim normalen Template tritt das nicht auf.

Siehe hier:

https://www.dertintenshop.de/Speicherkarten/64GB-Intenso-MicroSDXC-Memory-Card-mit-Adapter::8936.html

Gruß
Bernhard

Linkback: https://www.modified-shop.org/forum/index.php?topic=35082.0

[Viol]

Hallo,
gehe in die stylesheet.css des Templates und suche:

Code: CSS  [Auswählen]

.pd_big_image img {

          margin: 0px auto;

          width:100%;

          max-width:240px;

          height:auto;

          vertical-align:bottom;

        }  
 

Kommentiere width = 100% mit /*   */ aus, dann sind die Bilder wieder scharf

[hpzeller]

Du hast dein 'info_images' Bilder zu klein generiert.

[Bruno-der-Zweite]

Danke, hat geklappt.

[Viol]

Die Bildergröße wird im Backend ja festgelegt. Dennoch werden dann im Frontend die Bilder hoch- bzw. runterskaliert
Bei ersteren mit gruseligem Ergebnis.
@ Hanspeter: ich habe die Standardwerte gelassen (glaube 230)
Sollte man den Wert dann generell höher setzen?

[Bonsai]

Nein, nicht generell, sondern so, dass es zu Deinem Template passt.

Wenn Du die Bildgrößen im Backend richtig eingestellt hast, muss Du dann unter Module das Imageprocessing starten.

[hpzeller]

@ Hanspeter: ich habe die Standardwerte gelassen (glaube 230)
Sollte man den Wert dann generell höher setzen?

Um eine Skalierung im Browser zu vermeiden kann man für Bilder folgende CSS Eigenschaften-Werte-Paare einstellen, dies funktioniert im Allgemeinen gut, aber nicht immer. Auf jeden Fall gilt es zu vermeiden, dass der Browser Bilder grösser skaliert als sie wirklich sind, denn dadurch werden sie unscharf.

Code: CSS  [Auswählen]

img {
    max-width: 100%;
    height: auto;
}
 

Was nun die Einstellung der Bildgrössen im Backend anbelangt, hängt es von der persönlichen Präferenz, der Art der Bilder und natürlich vom Template ab welche Werte man hier vorgibt, aber auf jeden Fall ist es auch hier zu vermeiden das Bilder generiert werden die grösser als die Originale sind, sonst werden sie unscharf.

Im speziellen Fall des TE habe ich einfach die Annahme gemacht, das er die Bilder zwar in gleicher Grösse aber scharf dargestellt haben möchte, deshalb mein Hinweis auf zu klein generierte Bilder, aber natürlich kann man auch wie du es gezeigt hast das höher skalieren im Browser durch CSS vermeiden.

PS:
Etwas das mir persönlich im Backend fehlt ist die Möglichkeit einem Produktbild bei bedarf für die 'popup_images' eine eigene nur diesem Bild vorgegebene Grösse zuzuordnen, welche dann die allgemeine Einstellung überschreibt.

Gruss
Hanspeter