Richtige Gedankenstriche mit HTML – so geht’s!

Ein beliebtes Stilmittel für Autoren, Essayisten und Blogger ist der Gedankenstrich. Leser dieses Blogs, Word-Autokorrektur-Nichtausschalter und andere typografisch interessierte Personen wissen selbstverständlich, dass ein schnöder Trennstrich noch lange kein echter Gedankenstrich ist (Tipp: auf die Länge kommt es an). Doch es gibt noch mehr zu beachten, wenn man lesefreundlich mit diesem Sonderzeichen umgehen möchte.

Insbesondere stellt sich regelmäßig die Frage, wo der Gedankenstrich sich bei einem Zeilenumbruch eher zuhause fühlt: am Ende der oberen Zeile oder am Anfang der unteren Zeile? Diese Frage ist nicht komplett trivial zu beantworten, denn es gibt durchaus verschiedene Kontexte, in denen der Gedankenstrich verwendet wird:

  1. Der fragliche Gedankenstrich markiert den Beginn eines Einschubs, der einige Wörter später mit einem weiteren Gedankenstrich – hier haben wir ein treffliches Beispiel – wieder beendet wird, bevor der eigentliche Satz schließt. In diesem Falle wäre es schön, wenn beide Gedankenstriche sich ähnlich wie eine Klammer verhalten und jeweils am ersten und letzten Wort des Einschubs fixiert würden. Wir erreichen das in HTML natürlich über geschützte Leerzeichen, die mittels   maskiert werden. Auch hier ist – ohne jeden Zweifel – ein Beispiel sinnvoll!
  2. Die ähnliche, aber doch leicht anders gelagert Variante eines einzelnen Gedankenstrichs markiert eine Kunstpause und schließt den eigentlichen Satz meist grammatikalisch ab – um dann doch noch einen weiteren Gedanken an den Schluss zu hängen! In diesem Kontext wäre es schöner, wenn der Gedankenstrich gleichsam als Satzzeichen des ersten Teils fungierte und im Falle eines benötigten Zeilenumbruchs oben stünde. Dies verhindert, dass der Leser nach dem Zeilenwechsel überrascht ist vom plötzlichen Ende des ersten Satzteils. Somit setzen wir unser geschütztes Leerzeichen in diesem Falle vor den Gedankenstrich – ganz nach Art des typografischen Hauses!

Wer mag – und es nicht eh schon getan hat –, kann nun die Breite des Browserfensters kleiner und größer ziehen, um zu gucken, ob der van Aaken das auch alles richtig gemacht hat, denn natürlich ist auch das Setzen von geschützten Leerzeichen ein wichtiger Teil von Responsive Design: das Festlegen von Gestaltungsregel für eine unbekannte Bildschirmgröße! Ich kann nur hoffen, dass mich KirbyText die geschützen Leerzeichen auch wirklich machen lässt – sonst wäre das jammerschade!

Kleine Wiederholung: Mac-User setzen das geschützte Leerzeichen mit alt + <space>, Windows-User vertrauen auf alt + 0160. Weitere Sonderzeichen gibt’s in meinem Buch.