Das Foto des Textes sieht auf der Website verschwommen aus, wenn es klein ist, aber wenn es vergrößert aussieht, sieht es scharf aus?

Ich bearbeite einige Fotos für eine Website, die Text enthält. Wenn ich sie auf die Website hochlade, sieht der Text verschwommen aus, aber wenn ich die Bilder öffne, um sie zu vergrößern, sieht der Text scharf aus, und ich bin mir nicht sicher, warum.

Sie sind PNG, da sie keine sauberen Linien am Rand sind, also brauche ich etwas Transparenz an den Rändern.kleiner :verschwommener" Text

Ist das jemandem passiert? oder hat jemand vorschläge?Geben Sie hier die Bildbeschreibung ein

Es könnte einfach daran liegen, dass der Browser eine schnelle Herunterskalierungsmethode verwendet. Hast du es in verschiedenen Browsern versucht?
Ich benutze normalerweise Chrom, habe es aber auf Safari versucht und es sah genauso aus
Probieren Sie auch Firefox und vielleicht Edge aus. Ich denke, Safari verwendet denselben Downscale-Algorithmus wie Chrome.
Ja, aber das Problem ist, dass die Mehrheit der Leute Chrome oder Safari verwenden wird, also brauche ich es, um auch an ihnen zu arbeiten

Antworten (3)

Das Bild scheint verkleinert worden zu sein, oder Sie sehen es nicht mit 100 %. Überprüfen Sie die Zoomstufe in Photoshop und stellen Sie sie auf 100 % ein. Das kann reichen, um es zu beheben.

Wenn Sie das Bild kleiner skalieren müssen, um es in ein anderes Bild einzupassen, oder um ein kleineres Bild für eine Website zu erstellen, stellen Sie die Bildinterpolation auf der Registerkarte „Einstellungen“ > „Allgemein“ auf „Bikubisch schärfer (am besten für die Verkleinerung)“ ein.

Kopieren Sie das Bild und fügen Sie es ein, drücken Sie dann CTRL+ Tund skalieren Sie das Bild.

Das Ergebnis ist besser

Geben Sie hier die Bildbeschreibung ein

Beide Bilder stammen von dem Zeitpunkt, als ich das Bild auf die Website hochgeladen habe, dieselbe Datei, nur eines ist die grundlegende Ansicht auf der Website und das andere ist, wenn Sie das Bild herausklappen, um es größer anzuzeigen
@HannahBaker Das bedeutet dann, dass sie nicht die gleiche Zoomstufe haben. Sie können keine Bilder vergleichen, die in unterschiedlichen Zoomstufen angezeigt werden.
Um das Bild so anzupassen, dass es für die kleinere Größe schärfer wird, würden Sie vorschlagen, "Bikubisch schärfer (am besten für die Reduzierung)" zu verwenden.
Ich habe nur noch nie erlebt, dass ein kleineres Bild weniger scharf ist, das ist mir nur passiert, wenn Sie das Bild größer betrachten
Ja, skalieren Sie neu, wenn Sie ein kleineres Bild für eine Webseite wünschen. Skalieren Sie Bilder nicht in einem Browser, sie sehen immer scheiße aus - egal ob Sie sie vergrößern oder verkleinern

Passen Sie die Bilder an die Webseitengröße an

Passen Sie die Größe Ihrer Bilder an die Webseite an, ohne dass sie gezoomt werden müssen.

Wenn Sie Photoshop verwenden, wählen Sie beim Exportieren Preserve Detailsals resampleOption aus - für ein sauberes Aussehen mit weniger Verlust an Bildqualität.

Geben Sie hier die Bildbeschreibung ein

Ich habe das versucht, aber das Bild scheint immer noch "verschwommen" zu sein, wenn ich es auf der Website ansehe, ich hasse es, es sogar verschwommen zu nennen, es ist fast so, als wäre der Kontrast seltsam, aber ich habe es mit mehreren Kontrasten getestet und es scheint keinen Unterschied zu machen
Haben Sie die URL der Webseite, damit ich sie überprüfen kann?
celestekrishna.com/preludered/#libretto Die Seiten des Librettos werden zufällig angezeigt, aber ich habe 3 verschiedene Versionen von "Call up the Devil" eingegeben. Die beiden nebeneinander liegenden sind diejenigen, die ich teste, As you can Sehen Sie den Rest der Bilder, wenn Sie sie ausklappen, werden sie verschwommen. Das ist es, was wir versuchen zu erfinden, wenn das irgendeinen Sinn hat.
Versuchen Sie es auch mit dieser Seite celestekrishna.com/preludered/#notes und das Musikquadrat auf dieser Seite macht dasselbe
@HannahBaker, diese Webseite skaliert das Bild neu, also liegt das Problem bei der Site, nicht bei Photoshop.
@Hannah Baker. Das ist dein Bild. celestekrishna.com/static/public/uploads/… Es ist zu groß für die Seite und wird vom Browser neu skaliert, weshalb es nicht richtig aussieht. Dies kann nicht vermieden werden, da es viele verschiedene Bildschirmgrößen gibt, aber Sie können es auf den meisten Geräten gut aussehen lassen. Was Sie tun sollten, ist Ihre Bildgröße für die beliebteste Bildschirmgröße Ihrer Zielgruppe zu gestalten.
Sie können diese Informationen von Google Analytics erhalten, wenn eine Website schon eine Weile läuft. Die beliebteste Bildschirmgröße variiert von Land zu Land. Wenn sich Ihre Zielgruppe also hauptsächlich in den USA befindet, verwenden Sie die für diesen Standort am besten geeignete Größe. Sie finden diese Informationen hier: gs.statcounter.com/screen-resolution-stats/all/…

OK, ich glaube, ich habe den Grund gefunden, warum Ihr Bild seltsam aussieht.

Es scheint vom CSS-Stil zu stammen, den die Fotorama- Bibliothek verwendet.

Hier ist das Bild, wie es jetzt auf der Webseite ist:

Wenn ich die Entwicklertools einschalte und das übergeordnete Element des Bildes auswähle, stelle ich fest, dass das Attribut transform auf translateZ(0) gesetzt ist .

Wenn ich diese Einstellung ausschalte, sieht das Bild gut aus:

Mein Rat lautet also, entweder die Verwendung von fotorama einzustellen oder den Code zu ändern, sodass dieses Attribut nicht hinzugefügt wird.

Die Schriftart ist Teil eines Bildes, nicht der Website als solcher. celestekrishna.com/static/public/uploads/…
vielen Dank, dass Sie sich darum gekümmert haben. Als ich das in der Entwicklerstimmung abschaltete, änderte sich das Bild. Danke!
Gut zu hören! Bitte denken Sie daran, die Antwort zu akzeptieren, damit andere davon profitieren können.
Das Foto des Textes sieht auf der Website verschwommen aus, wenn es klein ist, aber wenn es vergrößert aussieht, sieht es scharf aus?
AntwortenHierDatenschutz-Bestimmungen1y, 0v