HTML Grundlagen: U-Tag zum Unterstreichen von Text • Nur Links sollten unterstrichen sein

Text unterstreichen – Was ist der Unterschied zwischen INS und U?

Die HTML-Elemente INS und U sind Inline-Elemente. Das bedeutet, es wird kein automatischer Zeilenumbruch erzeugt.

Die Ausgabe der HTML Tags ins (für Englisch: inserted) und U (für Englisch: underline) wird vom Browser standardmäßig in gleicher Weise dargestellt. Beide Tags unterstreichen den ausgezeichneten Text, d.h. die Tags zeichnen eine feine horizontale Linie auf die Basislinie des Textes. Es gibt aber einen wichtigen Unterschied zwischen den beiden HTML-Tags INS und U.

Das HTML <ins> Tag

Das HTML INS-Tag hat im Gegensatz zum U-Tag eine logische (d.h. semantische) Bedeutung. Das INS Tag wird für Inhalte verwendet, die dem Text nachträglich hinzugefügt werden. Der hinzugefügte Text wird mit dem Start-Tag <ins> eingeleitet und muss mit dem End-Tag </ins> abgeschlossen werden.

In der Praxis wird das INS-Tag oft mit dem DEL-Tag kombiniert. Auf diese Weise ausgezeichneter Text markiert einen Textabschnitt, der nachträglich geändert oder korrigiert wurde. Neu hinzugefügter Text wird in der Regel nicht mit dem INS-Tag gekennzeichnet, da dies die Benutzung der Webseite behindern würde.

Anzeige
Beispiel

Nachträglich eingefügter Text wird mit dem <ins>-Tag erzeugt.

Das neue Datum wird mit dem <ins> Tag hinzugefügt. Zusätzlich wird es farblich markiert und fett gedruckt.

Die Veranstaltung findet am <del>19. April 2024</del>&nbsp; <ins><b><mark>3. Mai 2024</mark></b></ins> statt.

Mit &nbsp; wird ein geschütztes Leerzeichen zwischen den den beiden Datums-Angaben eingefügt, um sie deutlicher voneinander zu trennen.

Ausgabe des HTML Codes
Die Veranstaltung findet am 19. April 2024   3. Mai 2024 statt.
Das INS Tag darf nicht direkt in einem DEL-Tag stehen.

Das HTML <u> Tag

Das HTML U-Tag hat keine semantische Bedeutung, sondern ist nur eine visuelle Formatierung. Der mit U ausgezeichnete Text wird unterstrichen. Der unterstrichene Text wird mit <u> eingeleitet und muss mit dem End-Tag </u> abgeschlossen werden.

Beispiel

Nachträglich eingefügter Text wird mit dem <u> Tag erzeugt.

Das neue Datum wird mit dem <u> Tag hinzugefügt. Zusätzlich wird es farblich markiert und fett gedruckt.

Die Veranstaltung findet am <s>19. April 2024</s>&nbsp; <u><b><mark>3. Mai 2024</mark></b></u> statt.

Mit &nbsp; wird wieder ein geschütztes Leerzeichen zwischen die beiden Datums-Angaben eingefügt, um sie deutlich voneinander zu trennen.

Ausgabe des HTML Codes
Die Veranstaltung findet am 19. April 2024  3. Mai 2024 statt.
Anzeige
Hinweise

In der Praxis wird das INS-Tag kaum verwendet, da eine Webseite dadurch unübersichtlich werden würde. Der Benutzer erhält dadurch keine zusätzliche Information.

Die beiden HTML Tags <ins> und <u> funktionieren technisch ausgezeichnet, sie sind aber praktisch nicht sinnvoll benutzbar, weil eigentlich nur Links unterstrichen werden sollten.

Die meisten Besucher nehmen bei unterstrichenem Text automatisch an, dass es sich um einen Link handelt. Wenn sie dann feststellen, dass sie mit der Unterstreichung getäuscht wurden, wenden sie sich frustriert ab und verlassen deine Website mit einem negativen Gefühl.

Das Unterstreichen von Text sollte deshalb nach Möglichkeit nicht eingesetzt werden, wenn der unterstrichene Text mit einem Link verwechselt werden könnte.

Anzeige