Webseiten sind in HTML geschrieben. Diese Sprache besteht aus Elementen. Dies sind Codeteile, die Teile der Seite kennzeichnen. Es ist wichtig, die genaue HTML-Bezeichnung für die Definition Ihres Textes zu verwenden. Beispiele: Titel, Kopfzeile, Tabellen, Listen ; jeweils mit einer separaten und genauen Bezeichnung.

Durch die Verwendung der genauen Begriffe erhöhen Sie die Zugänglichkeit Ihrer Website für Assistenzttechnologien sowie deren Sichtbarkeit in Suchmaschinen erheblich, da die Bedeutung der verschiedenen Seitenelemente im HTML-Code selbst gespeichert ist.

Wie wendet man das an?

Wenn es ein HTML-Element gibt, das die Bedeutung hat, die Sie vermitteln möchten, sollten Sie dieses spezielle HTML-Element verwenden. Dies wird als semantisches Markup bezeichnet. Es gibt HTML-Elemente, mit denen Sie die Struktur einer Seite festlegen können, z.B. Abschnitte, Navigationsmenüs, Absätze. Es gibt auch Elemente, mit denen Sie Textstücken eine Bedeutung geben können. Zum Beispiel, um ein Wort oder einen Satz hervorzuheben.

Ein guter Editor hat Schaltflächen, die es einem Redakteur ermöglichen, die richtigen HTML-Elemente einzufügen, z.B. für eine Tabelle oder einen unterstrichenen Text (fett gedruckt).

Beispiele

Beispiele für semantische Elemente:

  • <form>: Formular
  • <table>: table (Tabelle)
  • <img>: Bild
  • <header> en >footer>: oben und unten auf einer Webseite
  • <em> en <strong>: Betonung legen
  • <blockquote>: Vorschlag
  • <ul> en <ol>: Aufzählungsliste und nummerierte Liste
 
  • Die folgenden Elemente sind nicht semantisch. Diese Elemente sagen nichts über ihren Inhalt aus. Es ist am besten, sie nur dann zu verwenden, wenn kein semantisches Element anwendbar ist.
    • <div>
    • <span>
  • Welche Elemente Sie verwenden können, ist abhängig von der Version des auf der Webseite verwendeten HTML-Codes.

Beispiel: Eine Nachricht mit einem Titel

Am Anfang einer Nachricht steht ein Titel. Dieser Titel wird in einem größeren Format und in Fettdruck angezeigt. Der Titel hat auch eine andere Farbe, als der Rest des Textes.

  • Gut: Der Titel befindet sich in einem Kopfelement (<h1>, <h2>, usw.).
  • Fehler: Der Titel befindet sich in einem Absatzelement mit einem Klassenattribut (<p class:”title”>)

Für Redakteure

Der Redakteur muss sicherstellen, dass er die Funktionen des Editors nutzt, um z.B. Überschriften, Absätze, Listen und Tabellen einzufügen, damit die richtigen HTML-Elemente verwendet werden.

Für Entwickler

Der Entwickler muss sicherstellen, dass der Editor im CMS die Möglichkeit bietet, verschiedene semantische Elemente zu verwenden.