Webdesign | Donnerstag, 28. November 2024

Hängende Interpunktion (Update)

Mit einer einzigen Zeile in Ihrer CSS-Datei können Sie die typografische Qualität Ihrer HTML-Dokumente auf ein wesentlich professionelleres Niveau befördern: hanging-punctuation: first;.

Hier ein Screenshot einer HTML-Seite – ins Bild klicken, um Vorher/Nachher zu vergleichen.

Screenshot

Text ohne hängende Interpunktion

Siehe auch Hängende Interpunktion (Wikipedia) und hanging-punctuation (Developer Mozilla)

Update

Wie Michael in den Kommentaren zu Recht anmerkt, ist die Browserunterstützung sehr bescheiden – bisher ist nur Safari in der Lage, hanging-punctuation darzustellen.

text-indent wird allerdings von allen gängigen Browsern unterstützt. Mit text-indent: -.43em erreichen Sie (angepasst für die Schrift im Screenshot-Beispiel) ebenfalls eine hängende Interpunktion – und so wird sie auch in Browsern wie Firefox oder Chrome dargestellt. Hier sieht man das Beispiel aus dem Screenshot live: Räuberleiter.

Kommentare:

Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.

Michael Freitag, 29. November 2024, 08:31 Uhr

So schön wäre es, würden das die gängigen Browser (besser) unterstützen!

Michael Preidel Freitag, 29. November 2024, 11:15 Uhr

Ein weiterer Grund, Safari als Standardbrowser zu verwenden Aber im Ernst: Ich hatte die Kompatibilität vor der Veröffentlichung nicht gecheckt – bedauerlich, dass bisher ausschließlich Safari solch typografische Feinheiten unterstützt. Alternativ kann man den Effekt mit text-indent erreichen …