font-family, font-size und line-height sind die drei Angaben, die über Lesbarkeit entscheiden: welche Schrift, wie groß, mit welchem Zeilenabstand.
- font-family, font-size, line-height
Die Eigenschaften für Schriftart, Schriftgröße und Zeilenabstand.
Beispiel: „font-family, font-size und line-height entscheiden zusammen über die Lesbarkeit eines Textes.“
Die Schriftliste
body {
font-family: 'Inter Tight', system-ui, sans-serif;
font-size: 1.0625rem;
line-height: 1.6;
}Die Liste wird von links gelesen; was fehlt, wird übersprungen. Am Ende steht immer eine allgemeine Familie. system-ui nimmt die Schrift des Betriebssystems und lädt nichts nach.
Zeilenhöhe ohne Einheit
Ein Wert wie 1.6 ohne Einheit bezieht sich auf die jeweilige Schriftgröße und vererbt sich als Faktor. Mit Einheit würde der berechnete Wert vererbt, und eine große Überschrift bekäme den Zeilenabstand des Fließtexts. Für Fließtext haben sich Werte zwischen 1,5 und 1,7 bewährt, für große Überschriften deutlich weniger.