Photoshop-Auflösung für Webdesign?

Ich bin Programmierer, kein Designer, aber ich versuche, Design zu lernen, da es sehr hilfreich wäre. Ich folge einem Tutorial zu PSD | TUTS + und es gibt nicht die Auflösung an, mit der ich arbeiten sollte. Mein bisheriger Fortschritt sieht etwas weniger definiert aus als auf den Screenshots, also frage ich mich, ob ich mit einer Auflösung von 300 arbeiten sollte?

Irgendwelche Ideen oder Gedanken zu dem Thema?

300 ist großartig für den Druck, aber unnötig für das Web.
DPI als Konzept ist für das Web unnötig. Zumindest nicht jetzt. Vielleicht, wenn/wenn der Tag kommt, an dem Betriebssysteme Bildschirmgrafiken auf tatsächliche physikalische Messungen abbilden, unabhängig von der Bildschirmdichte.
Ich bin überrascht, wie tief verwurzelt der 72-dpi-Mythos ist. Auch als Maß für die Pixeldichte eines Bildschirms ist sie sicherlich seit einigen Jahren bedeutungslos. Siehe auch : graphicdesign.stackexchange.com/questions/95/…
Ich denke, ein Punkt, der noch nicht angesprochen wurde, ist das Werkzeugverhalten: Die Glätte einer mit den Auswahlwerkzeugen getroffenen Auswahl wird bei höheren Pixelzahlen besser sein, insbesondere bei aktiviertem Anti-Aliasing. Wenn Sie also ein Bild silhouettieren, sollten Sie die Pixelabmessungen vergrößern, bevor Sie Ihre Auswahl treffen.

Antworten (2)

Standardmäßig zeigen Browser Bilder in der nativen Bildschirmauflösung an, dh ein Pixel im Bild entspricht einem Pixel auf dem Bildschirm. Der Browser ignoriert alle in der Bilddatei definierten Auflösungswerte.

Sie können dieses Verhalten natürlich überschreiben, indem Sie einen Breiten- und/oder Höhenwert für das Bild angeben, entweder als Parameter für das <img>Element oder als CSS-Regeln.

Wenn Sie nicht beabsichtigen, Bilder in verschiedenen Größen auf Ihrer Seite oder Website wiederzuverwenden, macht es wenig Sinn, Ihre Bilder in einer größeren Größe zu speichern, als Sie sie anzeigen möchten. Die Ausnahme hiervon wäre, wenn Sie auf Geräte mit einem hochauflösenden Retina-Display (z. B. iPhone4) abzielen.

Es gibt mehrere Gründe, warum die Screenshots definierter aussehen können als Ihre, insbesondere wenn Sie eines der Bilder selbst bearbeitet haben. Wenn Sie JPEGs verwenden, wirkt sich die Komprimierungsstufe ebenso wie der von Ihrer Software verwendete Komprimierungsalgorithmus auf das Erscheinungsbild des Bildes aus.

Selbst für das iPhone4 würden Sie immer noch nur auf der Grundlage von Pixelabmessungen arbeiten. Es gibt nichts Besonderes an einem 960x640-Display, das das plötzlich ändert. Längst gibt es Mobilgeräte ähnlicher Größe mit Auflösungen von 800x480 oder höher. Es macht immer noch keinen Sinn, dass Telefone mit Bildschirmen mit niedrigerer Auflösung speicherraubende hochauflösende Bilder herunterladen, die nur mit halber Auflösung angezeigt werden – zumal sie ohne ordnungsgemäßes Resampling wahrscheinlich schrecklich aussehen würden.

Wenn Sie mit Pixeln arbeiten (was Sie immer mit Web tun), spielt dpi keine Rolle. Allerdings spielt es bei der Schriftgröße eine Rolle (denn 1px ist bei Außenmaßen nicht immer gleich groß).

Die meisten Leute haben einen dpi-Wert zwischen 72 und 100. Ich persönlich verwende 72 (und es ist ein bisschen von der Schriftgröße entfernt, wenn ich es in CSS konvertiere). Ich denke, Windows bietet Ihnen die Optionen 96 und 120, also ist 96 wahrscheinlich das, was Sie für die Genauigkeit wollen.

dpi ist ein Druckmaß. Gilt nicht für den Bildschirm. Die Bildschirmauflösungsdichte wird in PPI gemessen. Heutzutage sind das normalerweise mindestens 130. Wenn Sie so etwas wie ein iPhone 4 verwenden, sehen Sie sich 326 ppi an. Einige Browser lassen Sie eine 'angenommene' ppi (manchmal fälschlicherweise als dpi bezeichnet) einstellen, die sich hauptsächlich nur auf die angenommene Schriftskalierung bezieht.
Obwohl es technisch gesehen ppi sein kann, bezeichnen sowohl Windows als auch OSX (und einige Linux-Distributionen) es als dpi, ebenso wie Java Swing.
Photoshop-Auflösung für Webdesign?
AntwortenHierDatenschutz-Bestimmungen1y, 0v