HTML Grundlagen: ungültige Preise durchstreichen • korrekte Textformatierung • DEL vs. S

Text durchstreichen – DEL und S – Was ist der Unterschied?

Die zwei HTML-Tags DEL und S sind Inline-Elemente. Deshalb wird standardmäßig kein automatischer Zeilenumbruch erzeugt.

Die Ausgabe der beiden HTML Tags del (für Englisch: deleted) und s (für Englisch: strike-through) wird standardmäßig vom Web-Browser gleich dargestellt. Mit den beiden HTML-Tags kann man Wörter oder einen ganzen Textabschnitt durchstreichen. Beide Tags zeichnen eine feine horizontale Linie mitten über den Text und markieren den ausgezeichneten Text als gelöscht bzw. nicht mehr gültig. Es gibt aber einen wesentlichen Unterschied zwischen den beiden HTML-Tags.

Das HTML <del> Tag

Das DEL-Tag wird benutzt, um Text zu markieren, der aus dem Dokument gelöscht wurde. Der gelöschte Text bleibt aber im Dokument erhalten, um den Verlauf der Änderung zu dokumentieren.

In der Praxis wird das <del>-Tag so gut wie gar nicht verwendet, da das Durchstreichen die Webseite unübersichtlich macht und der Benutzer so gut wie keine zusätzliche Information erhält.

Gelöschter Text wird mit <del> eingeleitet und muss mit </del> abgeschlossen werden.

In der Regel wird das DEL-Tag zusammen mit dem INS-Tag benutzt, z.B. für abgelaufene Angebote und Aktionen oder abgesagte Termine für eine Veranstung.

Anzeige
Beispiel

Mit dem <del> Tag wird ein Text als gelöscht markiert.

Das alte Datum wird mit dem <del> Tag gelöscht. Es folgt das neue Datum, das zusätzlich farblich markiert und fett gedruckt wird.

Diese Formulierung ist semantisch nicht optimal, da das alte Datum nicht gelöscht, sondern korrigiert wird.

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 die beiden Termine eingefügt, um sie deutlich voneinander zu trennen.

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

Ein DEL-Tag darf nicht direkt in einem INS-Tag stehen.

Das HTML <s> Tag

In früheren Versionen von HTML Versionen gab es noch ein STRIKE-Tag, mit dem man Text durchstreichen konnte. In HTML5 ersetzt das neue S-Tag das nicht mehr gültige STRIKE-Tag. Das neu eingeführte S-Tag ist mit einer leichten Prise Semantik ausgestattet.

Durchgestrichener Text wird mit <s> eingeleitet und muss mit </s> abgeschlossen werden. Der mit S ausgezeichnete Text markiert Inhalt, der nicht mehr gültig ist und aktualisiert wurde.

Eine sinnvolle Anwendung des S-Tags ist ein alter Preis, der durchgestrichen wird, um auf ein Angebot oder einen Preisnachlass aufmerksam zu machen. Auch für begrenzte Angebote und Zeitdauern (z.B. nur noch 5 Tage) ist der Einsatz von S sinnvoll.

Besser ist dieser HTML Code. Das alte (nicht mehr gültige) Datum wird mit dem <s> Tag durchgestrichen. Danach folgt das berichtigte neue Datum, das im Beispiel zusätzlich farbig markiert und fett gedruckt wird.

Beispiel

Mit dem <s> Tag wird ein nicht mehr aktueller Text durchgestrichen.

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

Mit &nbsp; wird wieder ein geschütztes Leerzeichen zwischen die zwei Termine eingefügt, um sie deutlich zu trennen.

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

In der Praxis wird das DEL-Tag außer für nicht mehr gültige Preise oder Termine kaum benutzt, da der Benutzer kaum zusätzliche Information erhält.

Im Gegensatz zum DEL-Tag hat das S-Tag für den Benutzer noch eine gewisse Information.