BITV Reloaded – Anforderung 12
Bedingung 12.3: Inhalt gegliedert (Prio. 1)
Große Informationsblöcke sind mittels Elementen der verwendeten Markup-Sprache in leichter handhabbare Gruppen zu unterteilen.«
Was heißt das?
Bei der Gestaltung mit CSS geschieht diese Unterteilung in handhabbare Gruppen schon fast zwangsläufig. Diese Sprache entfaltet ihre ganze Eleganz erst, wenn der Code nach einem festen Regelwerk strukturiert ist. Diese Regeln werden von externen Style Sheets benötigt, um eine Seite überhaupt effizient formatieren zu können. Allerdings sind die hierfür verwendbaren Container-Tags wie div>
auf der semantischen Ebene eher geschmacksneutral und werden von assistiven Werkzeugen auch nicht in ihrer vermeintlich strukturierenden Form erkannt.
Wir haben hier also eine Vorgabe, die streng genommen erst erfüllbar ist, wenn in ferner Zukunft einmal HTML 5 und/oder XHTML 2 verabschiedet werden. Dort wird es nach dem jetzigen Stand der Entwicklung erstmalig Elemente geben, die eigenständige Bereiche voneinander abtrennen und die eine ihrer Funktion entsprechende Bedeutung in sich tragen. Bis dahin bietet HTML ausgesprochen wenige Elemente, um »Große Informationsblöcke«
in handlichere Portionen zu unterteilen.
Ausnahmen, die im Kontext dieser Bedingung sinnvoll erscheinen:
- das
FIELDSET
-Element zur Strukturierung von mehrteiligen Formularen, - das
OPTGROUP
-Element zur Abgrenzung einer Gruppe von Einträgen in einer Menüstruktur, - das
HR
-Element zur Unterteilung von größeren, inhaltlich nicht zusammenhängenden Blöcken einer Seite.
Weitere in den Techniken der WCAG an dieser Stelle aufgeführte Elemente wie (Daten-) Tabellen, Listen und Überschriften sind bereits an anderer Stelle hinreichend gewürdigt und somit im Kontext dieser Bedingung irrelevant. Auch die in anderen Veröffentlichungen bei dieser Bedingung aufgeführten Elemente wie STRONG
oder EM
sind für die Unterteilung großer Informationsblöcke alleine schon deswegen ungeeignet, weil es sich um Inline-Elemente handelt, die nur innerhalb solcher Blöcke vorkommen dürfen.
Beispiele:
Ein Beispiel für HTML-Elemente, die in ihrer strukturierenden Funktion eingesetzt werden sollten, findet man häufig in Formularen mit langen Auswahllisten (SELECT
). Im Extremfall stehen in einer Länderauswahl sämtliche Staaten dieser Erde, was die Navigation innerhalb der Liste nicht vereinfacht, sofern man nicht im oberen Drittel des Alphabets wohnhaft ist. Durch die Gruppierung mittels OPTGROUP
können die Länder nach Kontinenten zusammengefasst werden, Produkte nach Hersteller oder Produktgruppen u.v.m.:
<form action="foo">
<fieldset>
<legend>Länderauswahl</legend>
<select id="bar" name="bar">
<optgroup label="Asien">
<option>Brunei</option>
<option>…</option>
</optgroup>
<optgroup label="Afrika">
<option>Burkina Faso</option>
<option>…</option>
</optgroup>
<optgroup label="Europa">
<option>Belgien</option>
<option>…</option>
</optgroup>
</select>
</fieldset>
</form>