Line Height

Was ist Line Height?

Die Line Height ist ein wichtiger Begriff im Webdesign. Sie beschreibt den vertikalen Abstand zwischen den Textzeilen. Dieser Abstand beeinflusst, wie gut ein Text lesbar ist. Eine gut gewählte Line Height sorgt dafür, dass Inhalte klar und angenehm wirken.

Warum ist Line Height wichtig?

Die Line Height spielt eine große Rolle für die Lesbarkeit. Wenn der Abstand zu klein ist, wirken die Zeilen gedrängt. Ist er zu groß, verliert der Text seine Struktur. Eine optimale Line Height macht den Text leicht verständlich und optisch ansprechend.

Wie wird Line Height definiert?

Im Webdesign wird die Line Height meist in CSS festgelegt. Du kannst sie in absoluten Werten (z. B. Pixel) oder relativen Werten (z. B. Prozent oder Faktor) angeben. Zum Beispiel: line-height: 1.5; bedeutet, dass der Abstand 1,5-mal so groß ist wie die Schriftgröße.

Tipps für die richtige Line Height

Eine gute Line Height hängt vom Schriftstil und der Schriftgröße ab. Für Fließtexte empfiehlt sich oft ein Wert zwischen 1.4 und 1.6. Teste verschiedene Werte, um die beste Lesbarkeit für deine Zielgruppe zu erreichen.

Beispiel für Line Height in CSS

Hier ein einfaches Beispiel für die Nutzung von Line Height in CSS:

p {
  font-size: 16px;
  line-height: 1.5;
}

In diesem Beispiel ist der Zeilenabstand 1,5-mal so groß wie die Schriftgröße. Das sorgt für einen harmonischen Textfluss.