Feststellung des fonts einer Website + Abstände und Verzerrungen

Hi,

wie kann ich die Schrift einer Webseite ganz exakt mittels Photoshop nachempfinden?

Zunächst nehme ich das Font-Analyse-Tool von Chrome.

Das reicht allerdings nicht aus, die Verdana Schrift die ich dann selbst in Photoshop erstelle, sieht anders völlig aus.

Ich müsste noch wissen, wie groß die Abstände zwischen den Buchstaben sind sowie andere Veränderungen (z.B. Größe der Buchstaben) usw.

Wie kann ich das erreichen,

Liebe Grüße,

BABSI

Hallo,

wie kann ich die Schrift einer Webseite ganz exakt mittels
Photoshop nachempfinden?

Eigentlich nur sehr vage. Du weißt nie was der User benutzt und welche Schriftgrößen, etc. eingestellt sind. Du kannst es mehr oder weniger nur anhand der Standardeinstellungen annehmen und dann per Überlagerung des Screenshots nachempfinden. Es gibt auch im Netz diverse Website Vorlagen / Templates, die das sozusagen schon mit Lorem Ipsum Texten gemacht haben.

Zunächst nehme ich das Font-Analyse-Tool von Chrome.

Das reicht allerdings nicht aus, die Verdana Schrift die ich
dann selbst in Photoshop erstelle, sieht anders völlig aus.

Du ERSTELLST eine Schriftart mit Photoshop? Also willst Du ein eigenen Webfont bauen? Verdana ist eine Fontfamilie. Da kann der Schnitt unter Mac ein bischen anders aussehen als der unter Windows - obwohl es ja nicht sein SOLLTE, tuts aber leider immer wieder.

Ich müsste noch wissen, wie groß die Abstände zwischen den
Buchstaben sind sowie andere Veränderungen (z.B. Größe der
Buchstaben) usw.

Die stehen meist auf „0“.

Gruß
h.

wie kann ich die Schrift einer Webseite ganz exakt mittels
Photoshop nachempfinden?

Mach nen Screenshot und lad’ dir den in Photoshop :wink:

Dann passt’s aber auch nur bei dir, denn wie bereits geschrieben wurde … je nach Browser, Betriebssystem und Bildschirmauflösung sieht ein Font immer etwas anders aus. Ansosnten schau dir den Quelltext bzw. das css an, da steht’s ja drin.

Ich mach sowas normalerweise folgendermaßen:
Screenshot der HP, auf dem die verwendete Schriftart möglichst groß und deutlich erkennbar ist - das Ganze dann evtl. noch in Photoshop „freistellen“. Dann über http://www.myfonts.com/WhatTheFont/ den exakten Font bestimmen lassen. Meistens klappts - es sei denn, da wurde irgendwas ganz abenteuerliches verwendet.

Um Größe und Abstand zu bestimmen einen Screenshot des betreffenden Bereichs in Photoshop, InDesign oder Illustrator (InDesign wäre da mein Favorit) laden, neue Ebene und mit der oben ermittelten Schrift (so man sie denn installiert hat :smile: ) die Maße „ausprobieren“.

Das geht sicherlich schneller und einfacher als das Ganze mühsam in Punkt und Pixeln auszumessen.