Was machen wir mit dieser Logik?

Modulares Schriftsystem

Als Gestalter*in muss man die visuelle Schrift-Logik definieren und eine Brücke zwischen der visuellen und technischen Sicht schlagen.

Schrifthierarchie

Wir definieren für unser Design eine klare Schrifthierarchie mit mind. 6 Titelgrössen und dem Body-Text (Lauftext) als Basisschrift.

So lassen sich die passenden HTML-Tags automatisch ableiten. Also vom Grössten zum Kleinsten Titel mit der Basisschrift als Parent.

Die Basisschrift (body-font) zu definieren ist wichtig. Es ist die eigene Fallback-Schrift für alle nicht klar spezifizierten HTML-Tags.

Es ist nicht erwünscht, dass der HTML-Tag mit der Schrifthierarchie immer übereinstimmt.

Die Benennung dieser Schrifthierarchie sollt sich daher klar von den HTML-Tags abgrenzen.

Diese Modularität ist wichtig zu begreifen.

Terminologien

Es gibt verschiedene Ansätze. Design Programme respektive die Design-Spezifikation braucht noch die Viewport-Äquivalente. Meist mit den Endungen Mobile, Desktop, Tablet. z. B. Titel-1-Mobile.

Titel-1 bis Titel-6 und Lauftext

Eine ziemlich einfache Referenz zum HTML, aber nicht identisch. Alphabetische Grössenordnung (sinnvoll für Design-Programme)

Font-XXL bis Font-XXS

Wie T-Shirtgrössen. Verständlich, aber nicht Alphabetisch und irgendwann nicht mehr ausbaubar. XXXXXXXL (nope).

Elefant, Zebra, Maus

Fantansienamen, die eine Referenz zur Grösse geben. Nur für Projektinvolvierte verständlich. Nicht zwingend Alphabetisch.

Font-100--Regular bis Font-700--Bold

Ein Namensystem, welches auf der Basis 100 aufbaut. Alphabetisch.

Vertiefe dich ins ganze Kapitel

Web-Typografie