Der eigene Onlineshop für Fotografen

Workshop HTML5 & CSS3 - Stephan Heller

Abkürzungen - Akronyme

Klassische Abkürzungen sind z.B., bzw. oder u.s.w. und stehen dabei für einzelne Worte. Akronyme grenzen dadurch ab, dass sie zu eigenen Worten werden und auch so gesprochen werden, wie NATO oder BaFöG. In älteren HTML-Versionen gab es die Tags abbr und akronym, um das jeweilige Kürzel im Quelltext zu hinterlegen. HTML5 fügt diese Elemente zusammen, beides wird nun über abbr ausgezeichnet.

Sinn und Zweck ist das bessere Verstehen von Inhalten, einerseits für Menschen, die auf eine einfache Sprache angewiesen sind, aber auch, wenn lokal geprägte Abkürzungen oder Fachbegriffe nicht als allgemein bekannt vorausgesetzt werden können.

<abbr title="zum Beispiel">z.B.</abbr>
<abbr title="Nordrhein-Westfalen">NRW</abbr>
<abbr title="Kölner Verkehrs-Betriebe">KVB</abbr>

In wie fern man ein z.B. mit einem abbr versehen muss, sei hier unbeantwortet, die Auszeichnung von Texten ist eine umfangreiche redaktionelle Aufgabe und ist umso aufwendiger, je ernster sie genommen wird.

In den Beispielen ist als zweites die Auszeichnung von NRW zu sehen. Diese Abkürzung werden noch viele kennen, allerdings würde ich das nicht als selbstverständlich voraussetzen.

Noch deutlicher wird es an der letzen Abkürzung, KVB ist sicher den meisten Kölnern ein Begriff, wie weit diese übers Rheinland hinaus Leuten was sagt, ist fraglich. Hier sollte auf jeden Fall eine Abkürzung ausgezeichnet werden. Wie im Quelltextbeispiel zu sehen, die Bedeutung wird dann im title-Attribut hinterlegt.

abbr {
   border-bottom: 1px dashed #999;
   cursor: help;
}

Rein optisch kann eine Abkürzung dezent hervorgehoben werden, damit diese auch visuell wahrgenommen werden. Über eine hellgraue gestrichelte Linie per border-bottom fällt diese im Fließtext auf, über cursor: help erscheint ein kleines Fragezeichen beim Überfahren mit der Maus und verrät, dass hier eine Zusatzinformation angeboten wird.

Sprachauszeichnung

<html lang="de">
<a href="#" lang="en">Sitemap</a>
...und lebt in einem <span lang="fr">Palais</span> im Stadtteil <span lang="fr">Saint-Germain-des-Prés</span>

Sprachauszeichnungen sind aus Sicht des HTML recht simpel, das Attribut lang wird mit dem entsprechenden Sprachkürzel versehen. Mit dem Sprachkürzel wird »Sitemap« als »Zeitmäp« vorgelesen, aber auch Suchmaschinen können darüber die Sprache eines Textes erkennen.

lang ist dabei ein Universalattribut und kann in allen HTML-Elementen verwendet werden. In der Navigation kann dies einfach dem a-Tag hinzugefügt werden. Ist keine eigentliche HTML-Struktur für das fremdsprachliche Wort vorhanden, wird dieses mit einem span-Element umgeben, welches dann mit dem Sprachattribut versehen wird.

Generell gehört die Sprachangabe in das html-Element, damit die komplette Dokumentensprache bekannt ist.

Hinweis: Dieser Beitrag ist noch in Arbeit, Fortsetzung folgt!

Buchempfehlungen