Was bedeutet die Größe der Schrift genau?

Dies ist eine ausgezeichnete Frage, die eine eher unbefriedigende Antwort hat.

Die Schriftgröße, ob in Pixel, Punkt (1/72 Zoll) oder Millimeter angegeben, ist die Höhe eines Em-Quadrats, eines unsichtbaren Kästchens, das normalerweise etwas größer ist als der Abstand von der höchsten Oberlänge zur niedrigsten Unterlänge.

Da dies eine etwas willkürliche Maßnahme ist, die

• ist abhängig von der genauen technischen Ausführung der Schrift
• kann anhand eines gedruckten oder gerasterten Musters nicht genau gemessen werden

Es ist nicht sehr aussagekräftig oder nützlich, außer als Annäherung.

Ermitteln Sie in Ihrem Fall durch Experimentieren, welche Größe Sie in Photoshop angeben müssen, um mit der Wiedergabe des Browsers übereinzustimmen. Sie sollten feststellen, dass dies für jede Schriftart ein konstantes Verhältnis ist, aber ich würde nicht erwarten, dass dies der Fall ist, wenn Sie den Browser oder das Betriebssystem wechseln.

ASCII-Zeit! Stellen Sie sich vor, die beiden Kästen unten wären Bleistücke aus dem Jahr 1900 oder so. Damals wurden Schriften in Blei gegossen (oder in Holz gefräst). Damit die Typen in eine Druckerei eingesetzt werden konnten, mussten sie mit festen Blöcken verbunden werden. Daraus ergibt sich die Dimension des Typs (in Punkten):

+--------------+  +-------------+  <----+
|              |  |             |       |
|      XX      |  |             |       |
|     X  X     |  |             |       |
|    XX  XX    |  |             |       |
|    XX  XX    |  |     X       |
|    XXXXXX    |  |    X X      |   Point size of the type
|   XX    XX   |  |    XXX      |
|   XX    XX   |  |   X   X     |       |
|  XX      XX  |  |   X   X     |       |
|  XX      XX  |  |             |       |
|              |  |             |       |
+--------------+  +-------------+  <----+

Beachten Sie, dass die beiden obigen Buchstaben unterschiedliche Größen haben, aber ihr Begrenzungsrahmen derselbe ist. Daher haben beide Schriftarten in Bezug auf Punkte die gleiche Größe.

Heutzutage stellen wir nicht viel Blei- und Holzlettern her, und das meiste davon ist digital. Das Konzept der Punktgrößenanpassung besteht jedoch weiterhin darin, dass es für jeden Buchstaben, auf dem die Schrift platziert wird, ein virtuelles Kästchen gibt, das dieselbe Höhe hat. Auch hier ist es diese virtuelle Box, die die Punktgröße und nicht die physischen Maße der Buchstabenformen selbst definiert. Die tatsächliche Größe der Buchstabenformen ist oft kleiner als die Punktgröße (kann aber auch größer sein).

Das Messen von Text in Pixeln funktioniert deshalb nicht, aber Sie können Text in Pixel in CSS und dergleichen 'einstellen'. Der Browser führt eine Übersetzung so gut er kann zwischen der deklarierten px-Größe durch. Aber es ist immer eine unscharfe Schätzung.

Letztendlich gibt es keinen genauen Weg, um zwei Schriftarten exakt gleich groß zu machen, außer sie visuell zu betrachten und die Größe von jedem zu ändern, bis Sie sehen, dass sie die gleiche Größe haben.

Die "Schriftgröße" einer Schriftart bezieht sich auf die "em-Höhe" der Schriftart, die nicht unbedingt mit der Höhe bestimmter Zeichen in der Schriftart identisch ist.

Normalerweise folgt die Em-Höhe einer Schriftart der gleichen Grundidee - sie wird grob auf den Abstand von der niedrigsten Unterlänge (z. B. dem unteren Rand des Buchstabens g) bis zur höchsten Oberlänge (z. B. dem oberen Rand des Buchstabens h) festgelegt:

Wie Sie sehen können, gibt es keine gemeinsamen Zeichen, die diese gesamte Spanne abdecken.

Bei digitalen Schriftarten ist die "em-Höhe" einer Schriftart eine Wahl, die vom Schriftartdesigner getroffen wird, und muss dieser Konvention überhaupt nicht entsprechen: Ein digitaler Schriftdesigner kann jede Grundlage für seine em-Größe auswählen. Schriftarten neigen jedoch immer noch dazu, sich zumindest grob an die oben beschriebene Art von Konvention zu halten. In alten Zeiten, als Schrift aus Metallblöcken bestand, war die „em-Höhe“ die Höhe eines dieser Blöcke – natürlich mussten diese Blöcke groß genug sein, um alle Oberlängen, Unterlängen und Akzente aufzunehmen.

Verwirrenderweise enthalten viele Schriftarten jetzt Zeichen, die über die em-Höhe hinausragen. Zum Beispiel ist es üblich, dass moderne Schriftarten Großbuchstaben mit Akzenten (wie Ć) enthalten – diese Akzente erstrecken sich über die traditionelle typografische Oberlänge hinaus und somit fallen diese (und möglicherweise andere Sonderzeichen) außerhalb der Spitze des „em“ . Um die Konsistenz mit älteren Typen zu wahren, passen wir die Em-Größe nicht an, um diese zuzulassen – wir behalten die Em-Größe bei und lassen diese einfach aus ihr herausragen. Jeder Typograf, der solche Akzente verwendet, muss sicherstellen, dass Platz für sie vorhanden ist, obwohl der Zeilenabstand im Fließtext normalerweise ausreichend ist.

Der Zeilenabstand im Fließtext ist ein Leerzeichen, das zwischen der Unterlänge einer Textzeile und der Oberlänge der darunter liegenden Zeile verbleibt. Die angegebene "Schriftgröße" des Textes schließt den Zeilenabstand nicht in seine Messung ein. Aus diesem Grund sind die Linien bei einer Größe von 12 Punkt nicht genau 12 Punkt (1/6 Zoll) voneinander entfernt.

Der Zeilenabstand für jeden Text kann durch viele Faktoren beeinflusst werden, einschließlich der Software, die ihn anzeigt. Es kann durch das CSS-Feld line-heightwo beeinflusst werden1.4bedeutet, dass der Zeilenabstand das 0,4-fache der em-Höhe beträgt und somit eine ganze Textzeile das 1,4-fache der em-Höhe einschließlich des Zeilenabstands einnimmt. In anderen Anwendungen kann der Zeilenabstand anders angegeben werden: Textverarbeitungen geben einen „Zeilenabstand“-Wert oft als ein Vielfaches eines „einzelnen Zeilenabstands“ an, aber anders als in CSS bedeutet „einfacher“ Abstand nicht keinen Zeilenabstand, sondern eine "Standard"-Zeilenlücke, bei der die Anwendung versucht, basierend auf Metadaten in der Schriftartdatei, falls vorhanden, einen Standard zu finden. Es gibt mehrere Standards für die Angabe von Metriken in der Schriftart (z. B. gibt es bei Truetype unterschiedliche Mac- und Windows/OS2-Standards), sodass der standardmäßige Zeilenabstand je nach Anwendung und Betriebssystem variieren kann.

Selbst wenn ein Designer einer vorhersehbaren Konvention für seine em-Höhe folgt , sagt Ihnen dies immer noch nicht die Größe von Großbuchstaben (cap-height) oder Kleinbuchstaben wie "x" (x-height oder midline) als diese kann zwischen den Schriften in Bezug auf die Oberlänge frei variieren. Innerhalb einer Schriftfamilie sind diese normalerweise konsistent. So haben beispielsweise Times New Roman Bold und Times New Roman Regular dieselbe Versalhöhe und x-Höhe, und die Oberlängen, Unterlängen und die Grundlinie stimmen alle zwischen den fettgedruckten und nicht fettgedruckten Abschnitten überein.

Versuchen Sie, das vertikale Strichzeichen ('|') einzugeben, und messen Sie das. Wenn ich Ihre Situation richtig dupliziert habe und Ihr Antialiasing sie nicht zu sehr verwischt, sollte es 22 Pixel sein.

22px repräsentiert die Höhe des Textblocks. Aber jedes Zeichen füllt den Block anders aus. Ein „g“ oder „q“ nimmt den unteren Bereich dieser 22 Pixel ein, während Großbuchstaben und Kleinbuchstaben wie „b“ oder „d“ die oberen Teile einnehmen. '|' ist eines der einzigen (wenn nicht das einzige) Zeichen, das den 22-Pixel-Raum vollständig ausfüllt.

Ich weiß nicht, wie ich mit Ihren CSS-Einstellungen vergleichen soll, aber das erklärt, wie Photoshop die Texthöhe interpretiert.

Sind Sie sicher, dass Ihre Schriftart in Pixel gemessen wird? Meistens werden Schriftarten in Punkten gemessen. Ein Punkt ist 1/72 Zoll. Eine 40-pt-Schriftart ist also 40/72" oder 5/9" hoch. Der Kicker ist, dass dies die Abmessung von der Oberkante der Oberlänge bei großen Buchstaben bis zur Unterkante der Unterlänge bei Buchstaben ist, die unter der Grundlinie hängen. Aus diesem Grund wird, wie oben erwähnt, manchmal die x-Höhe verwendet. Das ist die Höhe der Kleinbuchstaben, die nicht nach oben oder unten ragen.

Wie auch immer, die Messungen sind leider sowieso nie genau. Sie müssen nur ein wenig messen und rechnen (und/oder Trial-and-Error), um das zu erreichen, was Sie versuchen.