Trennungen langer Begriffe in HTML

Immer wieder kann es passieren, dass Headlines (auch auf dem Smartphone) schön groß sein sollen. Hat man dann lange Begriffe, wie Sie im Deutschen gerne mal vorkommen, wird es eng. Dann wird das Wort gerne abgeschnitten und ist nicht mehr sichtbar. Man kann mit CSS die Schriftgröße reduzieren bis das Wort gut passt, aber nicht immer möchte man dies.

Eine Lösung ist es, ein spezielles Trennzeichen im Wort einzusetzen, welche vom Browser nach Bedarf interpretiert, ansonsten aber ignoriert wird. Man trennt das Wort wie folgt:

Bei den eingesetzten Zeichen wird sofern notwendig eine Trennung vom Browser vorgenommen. Die Headline unten ist mit den Trennungen umgesetzt. Wie man erkennen kann sind die Trennzeichen nicht sichtbar, auch nicht in der HTML Ausgabe. Ziehen Sie das Browserfenster einmal schmäler und Sie erkennen dass das Wort an bestimmten Stellen automatisch getrennt wird:

Arbeiter­unfall­versicherungs­gesetz

Jeder Redakteur einer Webseite sollte diese Methode kennen um seine Headlines immer anpassen zu können.

Zurück