Das Problem mit dem Donaudampfschiffahrtsgesellschaftskapitän
Insbesondere im deutschsprachigen Raum gibt es sehr lange Verbundwörter und Substantive, die sich aus mehreren anderen Wörtern zusammensetzen (auch Substantivkompositumgenannt).
Einige abstraktere Beispiele hierfür:
- Telekommunikationsüberwachungsverordnung
- Hochleistungsflüssigkeitschromatographie
- Weihnachtsmannschokoladeeinpackpapier
Und einige eher geläufige:
- Zahnzusatzversicherung
- Welternährungsprogramm
- Lebensabschnittsgefährte
- Verantwortungsbewusstsein
Oft werden hier lustige Beispiele verwendet, die man selten braucht. Aber im redaktionellen Alltag bei der Webseitenpflege, kommt es immer wieder zu Problemen mit der Länge von Wörtern.
Da im Layout von Webseiten, oft Banner, oder andere Gestaltungselemente verwendet werden, in denen die horizontale Breite von Texten durch das Design begrenzt wird, werden viele deutsche Wörter notwendigerweise umgebrochen.
Browser sind hier derzeit kaum eine Hilfe bei der Silbentrennung
Der Browser kann dies theoretisch selbst tun, wenn dies in den Stylesheets für das Layout definiert wurde. Allerdings ist kein Browser besonders gut, dies für alle Sprachen zu tun und die Implementierung für den selben Browser unterscheidet sich auch noch von Betriebssystem zu Betriebssystem. D.h. Als Redakteur kann man sich nicht darauf verlassen, dass der eingegebene Text für die Webseitenbesucher so umbricht, wie es gedacht ist, bzw. wie es den Regeln der deutschen Sprache entspricht. Insbesondere gilt das für responsive Layouts, bei denen völlig unklar ist, wie der Besucher die Webseite betrachtet.
Im Englischen funktioniert der Umbruch relativ gut, wobei es dort auch in der Regel nicht zu solch langen Wortkombinationen kommt.
Dies führt also im Deutschen dazu, dass der Browser oft nicht an Silben umbricht, sondern wo auch immer er gerade möchte. Und es wird auch nicht zwingend ein Bindestrich angezeigt, um dem Leser den Umbruch zu signalisieren. Dies führt zu einem deutlich schwerer lesbaren Text und als Webseitenbesucher macht man sich Sorgen um die Deutschkenntnisse der jeweiligen Redaktion.
Die zuverlässige, aber manuelle Lösung für dieses Problem ist das Einfügen von unsichtbaren Trennzeichen, die dem Browser als Signal dienen, an welcher Stelle ein Umbruch vorgesehen ist.
Im Deutschen heißt dieses spezielle Zeichen Weiches Trennzeichen. Gebräuchlicher im Webumfeld ist der englische Begriff Soft Hyphen. Daher kommt auch die Zeichenkombination "­", die in HTML das Trennzeichen auszeichnet. In Unicode ist es die Kombination \u00AD. Siehe Wikipedia.
Ein Workaround
Da sich diese Zeichen nicht sehr komfortabel von Hand in gebräuchliche Texteditoren von Content-Management-Systemen einfügen lassen und zudem unsichtbar sind, bedarf es einer anderen Lösung. Es gibt bereits einzelne Plugins für Neos CMS, TYPO3 und andere Systeme, die dies dadurch lösen, dass z.B. die Redaktion andere Zeichen verwendet, die dann beim Rendering der Seite, durch ein Soft Hyphen ersetzt werden. Eine Variante, die ich hier mehrfach gesehen habe, war die Verwendung von zwei vertikalen Strichen „||“.
Dies führt allerdings zu mehreren Problemen:
- Der Text hat beim Bearbeiten störenden Zeichen, die dort nichts verloren haben.
- Die Redaktion muss Text im Frontend,oder einem Vorschaumodus prüfen.
- Die Ausgabe der Webseite ist minimal langsamer, da der ganze Text nach diesen Zeichen durchsucht werden muss.
- Die gewählte Zeichenkombination wird niemals als sie selbst ausgegeben, auch wenn dies gewünscht ist.
- Wenn die Texte, die diese Zeichen enthalten, in anderen Kanälen, oder über Schnittstellen ausgegeben werden, muss sichergestellt sein, dass die Trennzeichen auch eingesetzt werden.
- Die Rechtschreibkorrektur des Betriebssystems, bzw. des Browsers funktioniert nicht mehr.
Gerade der letzte Punkt, kann Probleme mit den inneren Abläufen von Content-Management-Systemen und bei zusätzlichen Plugins (SEO, Sitemaps, Inhaltsverzeichnisse, ...) führen. Die bessere Lösung wäre also, das echte Trennzeichen zu verwenden, es aber beim Editieren sichtbar zu machen.
Eine weitere Variante für die automatische Silbentrennung
Wer keine Optimierung der Umbrüche von Hand vornehmen will, kann auch auf ein Javascript Plugin setzen. Durch dieses werden die Silben abhängig von der Sprache der Webseite im Browser des Clients automatisch eingesetzt. Anscheinend funktioniert dies besser, als die Browsereigene Methode und führt zu einheitlicheren Ergebnis über verschiedene Browser und Betriebssysteme hinweg. Allerdings liefert man damit wieder mehr Code über die Datenleitung an die Besucher und je nach Verbindung, kann dies zu Veränderungen im Aufbau der Webseite führen, wenn das Skript erst zeitversetzt aktiv wird.
Die Lösung für Neos CMS
Die Eingabe echter Trennzeichen ohne Nachteile ist nun möglich mit meiner neuen Erweiterung für Neos CMS Shel.Neos.Hyphens.
Diese erweitert den in Neos genutzten Texteditor CKEditor5 um einen Plugin, der das Einfügen von Soft Hyphens an beliebigen Stellen im Text ermöglicht. Da Neos die direkte Bearbeitung im Text der Webseite ermöglicht, sieht man dadurch auch sofort, wie sich der Text verhält. Hierfür muss man die Webseite auch nicht im Frontend veröffentlichen und anschauen.
Das weiche Trennzeichen wird hierbei durch einen leicht farblich hervorgehobenen Bindestrich dargestellt. Dieser ist aber nur im Backend sichtbar. Intern wird in der Datenbank das echte Trennzeichen in seiner Unicode Repräsentation gespeichert. Dies löst also alle oben genannten Probleme und funktioniert sogar mit der Rechtschreibkorrektur des Betriebssystems bzw. des Browsers.
Probieren Sie meine Erweiterung in Ihrer Neos CMS Webseite einfach aus. Natürlich funktioniert diese Funktion in allen Sprachen und nicht nur im Deutschen. Ich freue mich über Rückmeldungen und Ideen zur Verbesserung.