Navigation überspringen

HTML: Warum die Entity ­ nicht nur für Donau­dampf­schiff­fahrts­gesell­schafts­kapitäne gut ist

23.11.2018·Kommentare:  0Retweets:  0 1

Die Existenz der HTML-Entity &shy; (bzw. siehe auch Beschreibung auf quirksmode.org) war mir lange nicht bewusst. Ich kannte zwar das mittlerweile veraltete Tag <wbr />, das bei einem langen Wort einen optionalen Zeilenumbruch ermöglicht. Das Tag führt aber zu einer typografisch eher unbrauchbaren Teilung ohne Trennzeichen.

Da in meinem aktuellen Design in Überschriften sehr große Schriftgrößen zum Einsatz kommen, stand ich schon des Öfteren vor dem Problem, dass lange Wörter, vor allem auf Mobilgeräten, die Seite sprengten und man dadurch beim Scrollen oft seitwärts abdriftete.

Auf der Suche nach einer Lösung versuchte ich zunächst das wbr-Tag mittles CSS-»:before«- und -»content«-Anweisungen zur Ausgabe eines Trennstrichs zu bewegen, allerdings ohne Erfolg.

Auf das mittlerweile von Browsern gut unterstützte HTML-Sonderzeichen &shy;, welches im Falle eines Umbruchs automatisch den Trennstrich anzeigt, bin ich eher durch Zufall gestoßen. Es lässt sich wie folgt anwenden:

Donau&shy;dampf&shy;schiff&shy;fahrts&shy;gesell&shy;schafts&shy;kapitän

Damit sind alle Probleme mit Wortlängen, die in der deutschen Sprache ja relativ oft anzutreffen sind, gelöst. Besser wäre natürlich eine gute, automatische Silbentrennung. Das manuelle Setzen von &shy; stellt zwar einen Mehraufwand dar, dafür behält man aber volle Kontrolle über die Silbentrennung.


Neueste Artikel

Schlagwörter

·


Kommentieren

Am liebsten hier, gerne aber auch auf Twitter und Facebook.
Ich freue mich über jeden Kommentar und antworte gern innerhalb von 24 Stunden.