Das Prüfverfahren zur BITV


Sie sind hier: BITV-Test > Liste der Erfolgskriterien > Prüfkriterium 1.3.1a (10 von 49)


zum WCAG-Test wechseln


Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt

Prüfschritt 1.3.1a
HTML-Strukturelemente für Überschriften

Diese Version des Prüfschritts ist nicht mehr gültig!

Technische Angaben

Version bis 10.07.2017 | Aktuell
BITV-Bedingung 1.3.1 Informationen und Beziehungen
WCAG-Erfolgskriterium Zuvor enthalten in 3.5.1 HTML-Strukturelemente für Überschriften
Bewertungsalternativen ja / eher erfüllt / teilweise erfüllt / eher nicht erfüllt / nein / nicht anwendbar
Gewichtung hohes Gewicht (3 Punkte)
Bezieht sich auf einzelne Webseite
Prüfschritt erfüllt Seiteninhalte sind durch Überschriften erschlossen.
Prüfschritt nicht anwendbar Überschriften sind nicht erforderlich.

Was wird geprüft?

Überschriften müssen korrekt mit den HTML-Strukturelementen h1 bis h6 ausgezeichnet sein und die Inhalte der Seite erschließen.

Warum wird das geprüft?

Visuell werden Webseiten-Inhalte durch Überschriften strukturiert. Dank dieser Strukturierung weiß der Benutzer, was zusammengehört, kann die Inhalte der Webseite leicht überblicken und gezielt auf Inhalte zugreifen, die ihn interessieren.

Benutzer, die diese visuelle Ordnung nicht nutzen können, zum Beispiel, weil sie blind sind oder nur einen kleinen Ausschnitt der Seite sehen können, sind darauf angewiesen, dass die Struktur unabhängig von der Darstellung auf dem Bildschirm zugänglich und nutzbar ist. Die Verwendung von Überschriften-Elementen ist dafür eine wesentliche Voraussetzung.

So können Benutzer die Überschriften-Elemente anwenden:

  • Nur die Überschriften anzeigen lassen - als Inhaltsverzeichnis für die schnelle Orientierung (besonders wichtig für blinde Benutzer)
  • Von Überschrift zu Überschrift springen (Tastaturbenutzer)
  • Überschriften anders hervorheben, wenn die vom Anbieter vorgesehene Hervorhebung nicht geeignet ist (zum Beispiel andere Farbe oder Stimme)

Wie wird geprüft?

1. Anwendbarkeit des Prüfschritts

Der Prüfschritt ist anwendbar, wenn es auf der Seite Inhalte gibt, die durch Überschriften strukturiert werden können. Das ist bei informationsorientierten Seiten in der Regel der Fall.

2. Prüfung

  1. Seite im Firefox aufrufen.
  2. Über die Web Developer Toolbar die Seite ohne Stylesheets anzeigen (Keine CSS-Fehler > Styles aktivieren > Alle Styles wählen).
  3. Das Bookmarklet "Inhalte gegliedert" aufrufen.
  4. Die Überschriften im Zusammenhang mit den durch sie strukturierten Inhalten ansehen und prüfen, ob sie aussagekräftig sind und die Inhalte der Seite vollständig und korrekt gliedern. Sind gleichartige Inhalte durchgängig gleichartig benannt? Die Hierarchie der eingesetzten HTML-Überschriftselemente soll der Gliederung der Inhalte entsprechen.
  5. Prüfen, ob Inhalte, die visuell als Überschriften zu erkennen sind, mittels der HTML-Strukturelemente h1 bis h6 als Überschriften ausgezeichnet sind.
  6. Prüfen, ob HTML-Strukturelemente h1 bis h6 lediglich zur Erzeugung unterschiedlicher Schriftgrößen eingesetzt werden

3. Hinweise

Es ist nicht die Aufgabe des Prüfschritts zu prüfen, ob Wortwahl oder Stil der Überschriften den jeweiligen Inhalten angemessen sind.

Überschriften sollten korrekt geschachtelt sein (h1 gefolgt von h2 gefolgt von h3, und so weiter), um die Gliederung der Text-Inhalte abzubilden. Das Auslassen von Hierarchie-Ebenen muss aber kein Fehler sein, wenn dies durch die Gliederung der Inhalte gerechtfertigt ist.

Die Inhalte von Iframes werden ebenso überprüft wie andere Seiteninhalte. Dazu muss unter Umständen der Iframe in einem neuen Fenster geladen werden.

4. Bewertung

Erfüllt:

  • Alle Inhalte der Seite sind über die Überschriften zugänglich.

Teilweise erfüllt:

  • Es werden HTML-Strukturelemente für Überschriften eingesetzt, die Verschachtelung der Hierarchie-Ebenen ist aber irreführend, entspricht nicht der inhaltlichen Gliederung.

Nicht erfüllt:

  • Es gibt auf der Seite gegliederte Inhalte, es sind aber keine Überschriften vorhanden
  • Auf der Seite werden mehrere klar abgrenzbare Inhalte behandelt, es wurde aber nur pro forma eine Hauptüberschrift ausgezeichnet.

Einordnung des Prüfschritts

Formulierung BITV 2.0

1.3.1 Informationen und Beziehungen

Alle Informationen, Strukturen und Beziehungen, die durch Layout und Präsentation vermittelt werden, sind durch Programme erkennbar oder im Text verfügbar.

2.4.6 Beschreibungen

Überschriften und Label (Beschriftungen) kennzeichnen das Thema oder den Zweck.

Abgrenzung zu anderen Prüfkriterien

In diesem Prüfschritt geht es um den Einsatz von Überschriften zur Gliederung der Seiteninhalte, damit diese leicht zu erfassen und mit Hilfsmitteln wie Screenreadern zu überspringen sind.

Im Prüfschritt 2.4.1a "Inhaltsbereiche strukuriert" geht es dagegen um die Strukturierung der Seitenbereiche durch Überschriften, WAI-Aria-Attribute oder Sprunglinks.

Einordnung des Prüfschritts nach WCAG 2.0

Guidelines

Success criteria

Techniques

General Techniques
HTML Techniques
Failure

Quellen

Artikel zu diesem Prüfschritt auf bitvtest.de

Überschriften zur Abbildung der Struktur verwenden

Long documents are often divided into a variety of chapters, chapters have subtopics and subtopics are divided into various sections, sections into paragraphs, etc. These semantic chunks of information make up the structure of the document.

Sections should be introduced with the HTML heading elements (H1-H6). Other markup may complement these elements to improve presentation (e.g., the HR element to create a horizontal dividing line), but visual presentation is not sufficient to identify document sections.

Quelle: http://www.w3.org/TR/WCAG10-HTML-TECHS/#document-headers

Überschriften richtig schachteln

To facilitate navigation and understanding of overall document structure, authors should use headings that are properly nested (e.g., h1 followed by h2, h2 followed by h2 or h3, h3 followed by h3 or h4, etc.)..

Quelle: WCAG 2.0 Technik G141: Organizing a page using headings

Überschriften-Elemente und CSS-Auszeichnungen nicht missbrauchen

Using headings merely to change the appearance of text does not convey the organization of the content, and may confuse users who use headings to perceive structure or rely on them for navigation. Conversely, while applying bold format, or even class="heading", can result in the visual display of a heading, assistive technologies will not recognize such text as headings.

Quelle: WCAG 2.0 Technik H42: Using h1-h6 to identify headings

Fragen zu diesem Prüfschritt

Kann es mehrere h1-Überschriften auf einer Seite geben?

Die mit h1 ausgezeichnete Hauptüberschrift sollte sagen, worum es auf der Seite geht. Wenn alle Inhalte der Seite zu einem übergreifenden Thema gehören, dann sollte die Hauptüberschrift dieses Thema angeben. Es gibt dann nur eine mit h1 ausgezeichnete Überschrift.

Vielleicht hat die Seite aber auch zwei Themen, die keine große Gemeinsamkeit haben. Wenn es in so einem Fall nur eine Hauptüberschrift gibt, dann ist diese entweder nichtssagend oder sie zählt einfach die beiden Themen auf. Ihr Nutzen ist fraglich, es kann also auch sinnvoll sein, mehrere Überschriften auf derselben Seite mit h1 auszuzeichnen

Warum sind die Anforderungen des Prüfschritts so allgemein gehalten? Es gibt doch klare formale Vorgaben für die richtige Strukturierung durch Überschriften!

Formale Regeln für die Strukturierung durch Überschriften sind sinnvoll und sie können nützlich sein. Oft liefert ihre Überprüfung Hinweise auf falsche oder missbräuchliche Anwendung der Überschriften oder anderer Strukturelemente.

Die Umkehrung ist aber nicht möglich, formal korrekte Überschriftstrukturen sind nicht unbedingt brauchbar. Entscheidend ist, dass die Überschriften den Inhalt der Seite erschließen. Man muss sich also das aus den Überschriften zusammengesetzte Inhaltsverzeichnis ansehen und überlegen:

  1. Ist das Verzeichnis vollständig? Zeigt es mir alle wichtigen Inhalte der Seite?
  2. Ist das Verzeichnis brauchbar? Kann ich ohne viel Aufwand auf alle wichtigen Inhalte der Seite zugreifen?

Das sind die entscheidenden Fragen, die Struktur muss für den Besucher brauchbar sein. Die Einhaltung der verschiedenen technischen Regeln ergibt sich dann von selbst.

Muss für die oberste Überschrift immer h1 verwendet werden?

Die Frage ist, ob es einen akzeptablen Grund gibt, die h1-Überschrift zu überspringen. Es kann zum Beispiel sein, dass h2 verwendet worden ist, weil dem Entwickler die h1-Überschrift zu groß war und er nicht wusste, wie man die Größe ändert. Das wäre kein akzeptabler Grund, denn Inhalt und Form soll man trennen.

Ein anderer Grund dafür, mit einer niedrigeren Überschrift-Ebene anzufangen: Das Webangebot ist ein zusammengesetztes Dokument, die einzelnen Seiten sind zum Beispiel einzelne Kapitel dieses Dokuments. Das ist ein akzeptabler Grund.

Für die Brauchbarkeit von Überschriften kommt es allerdings nicht darauf an, dass eine h1 an oberster Stelle steht.

Kann man auch grafische Schriften als Überschriften auszeichnen?

Generell ist die Verwendung von Schriftgrafiken für Überschriften problematisch. Denn der Besucher kann Grafiken nicht so leicht an seine Bedürfnisse anpassen.

Sie können jedoch als Überschrift ausgezeichnet werden. Der Prüfschritt 1.3.1.A ist erfüllt, wenn grafische Überschriften in angemessener Weise als Überschriften ausgezeichnet sind.

Was ist der Unterschied zwischen dem Dokumenttitel und der h1-Überschrift?

Der Dokumenttitel wird als Fenstertitel oder für Bookmarks verwendet. Wenn man mehrere Bookmarks in seiner Liste hat oder mehrere Fenster geöffnet sind, dann soll der Dokumenttitel dabei helfen, die richtige Seite auszuwählen. Was muss im Dokumenttitel stehen, damit das geht? Er muss zwei Bestandteile haben.

Der erste Bestandteil sagt, zu welchem Webangebot die Seite gehört. Er ist normalerweise für alle Dokumente eines Webangebots gleich, man braucht ihn, um die Seite von thematisch ähnlichen Seiten anderer Webangebote zu unterschieden.

Der zweite Bestandteil sagt einem, worum es auf der Seite geht. Er ist normalerweise für alle Dokumente eines Webangebotes unterschiedlich. Denn man braucht ihn, um unterschiedliche Seiten des selben Webangebotes zu unterscheiden.

Bei der Hauptüberschrift geht es dagegen eher um die interne Strukturierung der Seite. Von außen sehe ich die Hauptüberschrift nicht, sie wird mir erst gezeigt, wenn ich die Seite ausgewählt und geöffnet habe.

Die Hauptüberschrift sagt mir dann noch mal das Hauptthema der Seite oder - wenn es mehrere Hauptüberschriften gibt - die zwei oder drei Hauptthemen.

Da auch der Dokumenttitel das Hauptthema der Seite angeben soll, kann es also gut sein, dass die Hauptüberschrift einfach den "individuellen" Teil des Dokumenttitels wiederholt.

Wobei man jetzt sagen kann: Wofür brauche ich dann überhaupt noch die Hauptüberschrift? Was ich über den Dokumenttitel oder über das Navigationssystem des Webangebotes ausgewählt habe, das weiß ich doch. Manche Webseiten verzichten daher auf die Hauptüberschrift und es geht direkt los mit einer Liste von "Einstiegspunkten", die auf die Themen der Seite verweisen. Das ist plausibel, aber man kann auch den Standpunkt vertreten, dass die Hauptüberschrift ruhig noch mal auf der Seite selbst stehen soll.

Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt