Wie kann ich dafür sorgen, dass mein Photoshop-Text so aussieht wie im Web?

Muss ich wirklich alles in Photoshop mit Anti-Aliasing auf „none“ gestalten? Ich bin sicher, es gibt einen besseren Weg.

Ich hätte gerne eine Einstellung, damit ich bei der Auswahl eines einfachen Web-Safes (z. B. Tahoma) in Photoshop sehen kann, wie es im Internet tatsächlich aussehen wird.

Zum Beispiel: Der Unterschied zwischen Tahoma mit Anti-Aliasing, das in Photoshop auf „knackig“ eingestellt ist, und der Darstellung in Firefox ist groß. Es sieht in Photoshop schön und glatt aus und sieht im Web wie Mist aus.

Gibt es eine Anti-Aliasing-Option, die am besten für den Anfang geeignet ist (mit dem ähnlichsten Ergebnis), wenn Sie planen, den Inhalt live im Web zu veröffentlichen?

Wie eine Schriftart "im Web" aussieht, hängt vollständig vom Browser, den Browsereinstellungen, dem Betriebssystem und den Betriebssystemeinstellungen ab. Mit anderen Worten, es sieht für verschiedene Menschen unterschiedlich aus.

Antworten (5)

Die meisten Betriebssysteme und Browser rendern mit Antialiasing oder Subpixel-Antialiasing. Subpixel-Antialiasing ist auf Desktop-Plattformen wie Windows (mit ClearType) und OS X üblich. Monochromes Standard-Antialiasing ist auf mobilen Plattformen üblich, wo sich die Subpixel-Reihenfolge des Geräts mit der Geräteausrichtung ändern kann und wo Subpixel-Rendering nicht erforderlich ist. Dies ist nicht so wichtig, da sie oft Displays mit höherer Pixeldichte haben.

Alias-Textwiedergabe ist unter Windows XP üblich, wo ClearType standardmäßig deaktiviert ist. Windows Vista und neuer haben ClearType standardmäßig aktiviert.


Rendern in Photoshop vs. Windows vs. OS X vs. iOS vs. Android vs. WebKit vs. Firefox (Gecko) sind in der Regel alle unterschiedlich. Es gibt also absolut keine Möglichkeit, etwas in Photoshop zu erstellen und zu wissen, dass die Textwiedergabe dieselbe ist, es sei denn, Sie machen einen Screenshot und fügen ihn Ihrem Dokument als Bitmap-Ebene hinzu.

Seit der Beantwortung dieser Frage hat Adobe die Optionen „Mac“ und „Mac LCD“ zu Photoshop (plus Äquivalente unter Windows) hinzugefügt, die das Rendern von Systemschriften verwenden. Es ist jetzt oft sehr ähnlich oder identisch mit Safari.

Nein. Der neue Gedankengang ist, Photoshop für die Layout- und Typografiegestaltung zu vermeiden und möglichst früh im Browser zu starten.

Indem Sie dem Kunden anstelle einer Photoshop-Komposition eine tatsächliche URL übergeben, vermeiden Sie, dass die Erwartungen des Kunden enttäuscht werden, wenn das Endprodukt im Browser seiner Wahl etwas anders als in den Photoshop-Kompositionen dargestellt wird.

Letztendlich liegt es in unserer Verantwortung, den Kunden aufzuklären und ihn auf die unvermeidlichen typografischen Diskrepanzen aufmerksam zu machen, die zwischen Browsern und Betriebssystemen auftreten.

In meiner Firma erstelle ich Designs und übergebe sie an einen Frontend-Entwickler. Ich fasse Code nie an. Vor diesem Hintergrund brauche ich eine Lösung, bei der die Webseite nicht tatsächlich erstellt wird, um zu sehen, wie mein Text aussieht.

In Photoshop CC haben wir neue Aliasing-Modi für Ihre Schriftarten hinzugefügt. Probieren Sie statt "knackig" oder "stark" das neue "Mac LCD". Sie erhalten ein 100 % websicheres Design.

Es gibt kein „100 % websicheres Design“, da es keine 100 %ige Konsistenz zwischen Browsern, Schriftarten und Betriebssystemen gibt.

Kurze Antwort: Sie können nicht.

Photoshop ist nicht nur nie ideal, um zu wissen, wie Ihre Schriftarten außerhalb davon gerendert werden, es ist einfach nicht ideal für die Arbeit mit Schriftarten im Allgemeinen. (Als ich in einer Designfirma/Druckerei arbeitete, musste alles, was in PS entworfen wurde, aus demselben Grund als PDF exportiert werden). Dann kommt das Problem des Webs, seiner Browser und des Betriebssystems, das diese Browser ausführt. Soweit mir bekannt ist, ist OS X in Bezug auf die angemessene Wiedergabe von Schriftarten am besten, während Linux an zweiter Stelle steht und Windows natürlich an letzter Stelle steht. Die Realität ist, dass sie alle unterschiedliche Algorithmen zum Rendern von Schriftarten verwenden, und Sie werden nicht überall das gleiche Ergebnis erzielen. Wenn es eine Lösung gäbe, wäre es, dass wir alle auf Linux, Macs umsteigen oder warten, bis Microsoft entweder beim nächsten Mal mit Windows Metro Erfolg hat (sorry, ich nenne es nur ungern Windows 8) oder es völlig vermasselt,

Nur meine 2 Cent,

Patch

In meinen Augen liegt das Rendern in einem Browser irgendwo zwischen Photoshops „Sharp“ und „Crisp“ auf einem Mac und zwischen „Crisp“ und „Strong“ auf Windows. Ich empfehle den Grafikdesignern, mit denen ich zusammenarbeite, "Crisp" für Live-Text zu verwenden. Die Voreinstellung „Stark“ sorgt immer für Enttäuschung. ;)