Universalattribute sind solche Attribute, die im Start-Tag vieler oder fast aller XHTML-Elemente stehen dürfen. Diese Attribute haben verschiedene Aufgaben. Die in diesem Abschnitt vorgestellten Universalattribute können Elementen einen Namen geben oder ihnen eine Klasse zuweisen, Angaben über die Sprache des Elements treffen sowie Formatierungs- oder kommentierende Informationen hinzufügen.

Element-Identifikatoren: Die Attribute id und class

Die Universalattribute id und class dienen dazu, ein Element genauer zu bezeichnen.

Das Attribut id definiert einen eindeutigen Bezeichner für ein Element. Eine ID gleichen Namens darf in einem Dokument nur ein einziges Mal vorkommen.

IDs haben folgende Funktionen:

• Definition eines Zielankers.
• Feinere Strukturierung des Quelltexts.
• Universelle Verarbeitung durch Benutzerprogramme (zum Beispiel bei der Identifizierung von Feldern beim Extrahieren von Daten aus Webseiten oder bei der Übersetzung von XHTML-Dokumenten in andere Formate, beispielsweise via XSLT).
• Ein Element einer bestimmten ID lässt sich in CSS über einen speziellen ID-Selektor ansprechen.
• Die JavaScript-Methode getElementById() greift auf ein Element zu, das die entsprechende ID besitzt.

Das Attribut class weist einem Element einen Klassennamen oder einen Satz von Klassennamen zu. Derselbe Klassenname kann einer beliebigen Anzahl von Elementen zugeordnet werden. Multiple Klassennamen werden durch Leerzeichen voneinander getrennt.

Klassen haben folgende Funktionen:

• Feinere Strukturierung des Quelltexts.
• Universelle Verarbeitung durch Benutzerprogramme.
• Ein Element oder auch Elemente einer bestimmten Klasse lassen sich über einen speziellen Klassenselektor ansprechen.

Fast jedem Element können eine ID und Klassen zugeordnet werden. Wie alle Attribute werden sie im Start-Tag des Elements notiert:

<div id="navigation">
<em class="wichtig">

Wenn Elemente zu mehreren Klassen gehören, zum Beispiel zu der Klasse wichtig und zu der Klasse extern, zählen Sie die Klassennamen mit einem Leerzeichen getrennt auf:

<em class="wichtig extern">

Element-Identifikatoren sollten nach Konzepten benannt werden, nicht nach optischen Gesichtspunkten (siehe auch [Meiert 2008]). Ein Bezeichner beispiel ist sinnvoller als ein Bezeichner blau-kursiv. Das merken Sie spätestens dann, wenn Sie das Layout der Seite ändern und ein Beispiel eben nicht mehr blau und kursiv sein soll. Darüber hinaus erhöhen sinnvolle Bezeichnungen die Lesbarkeit des Quelltexts. IDs drücken Konzepte aus, die innerhalb eines Dokuments einmalig sind (hauptmenue, inhalt, kontaktfeld), während Klassen Konzepte beschreiben, die mehrfach vorkommen (können).

Zum Seitenanfang

Angabe der natürlichen Sprache: Die Attribute lang und xml:lang

Die meisten Webseiten werden in durchgehend einer Sprache verfasst. Werden jedoch mehrere Sprachen auf einer Seite eingesetzt, beispielsweise Zitate oder andere Texte in englischer Sprache auf einer primär deutschsprachigen Seite, müssen Sie die fremdsprachigen Texte in Hinblick auf die Sprachausgabe als solche auszeichnen.

Screenreader arbeiten mit Sprachtabellen, das heißt, sie erfassen einen Text und geben ihn entsprechend der voreingestellten Sprache an die Ausgabe weiter. Liest ein blinder Nutzer eine deutschsprachige Webseite, die aber nicht korrekt ausgezeichnete, fremdsprachige Texte enthält, werden diese mit hoher Wahrscheinlichkeit falsch vorgelesen.

Das Attribut lang spezifiziert in XHTML-Dokumenten die Sprache der Attributwerte und des Textinhalts eines Elements.

Wie bereits mehrfach angesprochen, handelt es sich bei XHTML um einen XML-Dokumenttyp. In XML-Dokumenten kann das Attribut xml:lang verwendet werden, um die verwendete Sprache anzugeben.

Das Attribut xml:lang spezifiziert in XML-Dokumenten die Sprache der Attributwerte und des Textinhalts eines Elements.

Die HTML-Kompatibilitätsrichtlinien (siehe Kapitel 4.4) empfehlen, für XHTML-Dokumente sowohl lang als auch xml:lang zu notieren und beiden Attributen den gleichen Wert zuzuweisen. Damit können sowohl (X)HTML- als auch XML-Benutzerprogramme die Sprache des Dokuments auslesen und sich entsprechend verhalten.

Bei einer einsprachigen Seite reicht es aus, die Sprache für das html-Element zu definieren. Diese Angabe wird an alle Nachfahrenelemente vererbt:

<html xmlns="http://www.w3.org/1999/xhtml"
  xml:lang="de" lang="de">

Enthält ein primär deutschsprachiges Dokument beispielsweise englischsprachige Inhalte, müssen diese als solche spezifiziert werden:

Die <acronym title="Extensible Hypertext Markup Language" lang="en"
xml:lang="en">XHTML</acronym>-Kompatibilitätsrichtlinien empfehlen:
»<span lang="en" xml:lang="en">Use both the <code>lang</code> and
<code>xml:lang</code> attributes when specifying the language of an
element.</span>«

Die Sprache eines Elements wird in folgender Reihenfolge bestimmt (vom höchsten zum niedrigsten):

1. von einem für das Element selbst gesetzten lang- beziehungsweise xml:lang-Attribut
2. vom nächsten Vorfahrenelement, in dem das lang- beziehungsweise xml:lang-Attribut gesetzt ist (Vererbung)
3. vom HTTP-Content-Language-Header (der serverseitig konfiguriert sein kann)
4. von Standardwerten von Benutzerprogrammen und Benutzereinstellungen

Sprachen- und Länderkürzel

Der Wert der Attribute lang und xml:lang ist ein Sprachcode laut RFC 1766 [RFC-1766 1995]. Diese Sprachenkürzel basieren auf den Normen ISO 639-1 zur Kurzbezeichnung von Sprachen und ISO 3166-1 zur Kurzbezeichnung von Ländern. Diese von den beiden ISO-Normen vordefinierten Kürzel erlauben solche Angaben wie de für Deutsch, en für Englisch oder en-US für US-Englisch. Mittlerweile gibt es RFC 3066 [RFC-3066 2001], nach dem auch dreibuchstabige Sprachenkürzel nach der Norm ISO 639-2 erlaubt sind.

Kurz gefasst, bestehen Sprachcodes aus einem primären Code und eventuell einer Serie von Untercodes, die mithilfe von Bindestrichen (-) abgeteilt werden. Listing 4.4, der XML-Empfehlung entnommen und erweitert, zeigt einige Beispiele:

<!-- Deutsch -->
<p lang="de" xml:lang="de">In welcher Straße hast du geparkt?</p>
<p lang="de-DE" xml:lang="de-DE">In welcher Straße hast du geparkt?</p>
  
<!-- Schweizer Deutsch -->
<p lang="de-CH" xml:lang="de-CH">In welcher Strasse hast du parkiert?</p>
  
<!-- Englisch -->
<p lang="en" xml:lang="en">Where did you park your car?</p>

<!-- Spanisch -->
<p lang="es" xml:lang="es">¿Dónde has aparcado tu coche?</p>

Literatur

ISO 639, ISO 3166, ISO-3166-1-Kodierliste

Ausführliche Wikipedia-Grundlagenartikel mit Sprachen- und Länderkürzeltabellen.

• http://de.wikipedia.org/wiki/ISO_639
• http://de.wikipedia.org/wiki/ISO_3166
• http://de.wikipedia.org/wiki/ISO_3166-1_Kodierliste

Zum Seitenanfang

Inzeilige Formatierung: Das Attribut style

Das Attribut style gibt Formatierungsinformationen für das aktuelle Element an. Die Syntax des Werts wird von der Stylesheetsprache festgelegt, üblicherweise CSS.

<div style="border: 1px solid white;">
  Container mit weißem Rahmen</div>

Weitere Informationen zum style-Attribut erhalten Sie in Kapitel 6.3.1.

Zum Seitenanfang

Kommentierende Informationen: Das Attribut title

Das Attribut title bietet kommentierende Informationen über das Element, für das es gesetzt ist.

Das title-Attribut kann von Benutzerprogrammen auf verschiedene Art und Weise dargestellt werden. Screenreader können den Attributwert vorlesen, visuelle Browser können es beispielsweise als Tooltipp (siehe Abbildung 4.6) oder als Text in der Statusleiste anzeigen, wenn Nutzer das Element mit der Maus überfahren. In den meisten Fällen ist der Inhalt des title-Attributs nicht unmittelbar zugänglich, daher sollte es nur ergänzende Informationen enthalten, zum Beispiel Informationen, die für die Bedienung oder das Verständnis eines Formulars hilfreich sein können, oder Hinweise zum Ziel eines Hyperlinks.

<input type="text" name="website"
  title="Angabe in der Form http://www.example.com/" />
  
<strong title="Hier befinden Sie sich gerade">
  Webentwicklung</strong>

Abb. 4.6: Das title-Attribut wird häufig als Tooltipp dargestellt