Techniken für WCAG 2.0

Zum Inhalt

-

C25: Festlegung von Rahmen und Layout in CSS, um Bereiche einer Webseite zu umreißen während Text- und Texthintergrundfarbe nicht festgelegt werden

Anwendbarkeit

Seiten, die CSS benutzen.

Die Technik bezieht sich auf:

Anmerkungen zur Unterstützung durch Benutzeragenten und assistierende Techniken

Die meisten Browser erlauben es dem Benutzer, die Farbkonfiguration zu verändern, um damit die CSS- und HTML-Farbgebung des Autors außer Kraft zu setzen. Dies schließt IE, alle Versionen von Firefox, Mozilla und Opera nach Version 6 ein.

Wenn festgelegte Farben in Netscape und Firefox-Versionen vor Firefox 3.0 außer Kraft gesetzt werden, werden die meisten Javascript Pop-Up-Felder und Dropdown-Menüs unbrauchbar. Pop-Up-Felder erhalten einen transparenten Hintergrund, so dass der Text des Feldes den Text auf der Seite überlagert und Dropdown-Menüs werden entweder transparent oder erhalten einen dunkelgrauen Hintergrund.

Internet Explorer 6 setzt Hintergrundfarben nicht außer Kraft, außer die gleiche Hintergrundfarbe wurde auch in den Systemeinstellungen ausgewählt.

In Safari gibt es keine Farbeinstellungen, also ist es nicht möglich, festgelegte Farben außer Kraft zu setzen. Ebenso zeigt Safari die Seite in schwarzem Text auf einem weißen Hintergrund an, wenn Farben nicht festgelegt werden, und ignoriert dabei jegliche Farbeinstellungen aus den Systemeinstellungen.

Beschreibung

Das Zweck dieser Technik ist es, Rahmen und Layout per CSS festzulegen und Text- und Hintergrundfarben gemäß der Browser- und/oder Betriebssystem-Einstellungen des Benutzers rendern zu lassen.(Lesen Sie bitte oben stehende Anmerkung in Bezug auf Safari). Dies erlaubt es Benutzern, den Text in den von ihnen benötigten Farben anzusehen, während andere Aspekte des Layouts und Seitendesigns wie beispielsweise Textspalten, Rahmen um Abschnitte herum oder vertikale Linien zwischen einem Menü und einem Hauptinhaltsbereich beibehalten werden. Es verhindert auch einige Darstellungsprobleme in einigen Browsern, wenn eine Seite Javascript Pop-Up-Boxen oder Aufklappmenüs enthält und die Farben außer Kraft gesetzt werden.

Rahmen- und Layout-Indikatoren helfen vielen Menschen mit kognitiven Behinderungen, genau wie es die Flexibilität über die Text- und Hintergrundfarben macht. Manchmal stehen diese beiden Bedürfnisse im Widerstreit, wenn der Benutzer die Auswahl des Autors für Text- und Hintergrundfarbe im Browser außer Kraft setzen muss und der Browser auch die Rahmen und das beabsichtigte Layout entfernt. Dies kann bedeuten, dass die Seite in einer einzigen Spalte mit einem Inhaltsblock unter dem anderen angezeigt wird, was zu unnötigen weißen Flächen (whitespace) und langen Textzeilen führen kann. Es kann außerdem bedeuten, dass Pop-Up-Boxen einen transparenten Hintergrund bekommen und so der Text der Box den Text der Seite überlagert; und Aufklappmenüs werden entweder transparent oder bekommen einen dunkelgrauen Hintergrund. Wenn ein Webautor die Farben von jeglichem Text und Hintergrund nicht festlegt, während er Rahmenfarben und Layout festlegt, dann ist es in den meisten gängigen Browsern möglich, die Farben von Text und Hintergrund zu ändern, ohne die anderen (vom Autor angegebenen) CSS Deklarationen zu beeinflussen.

Beispiele

Beispiel 1

Eine Webseite wird durch die Benutzung von HTML gestaltet. CSS wird benutzt, um Rahmenfarben um eigenständige Bereiche der Seite herum festzulegen und den Inhalt so zu entwerfen, dass das Menü links des Bereiches mit dem Hauptinhalt treibt. Weder Text- noch Hintergrundfarbe werden festgelegt. Die Benutzer legen ihre eigenen Farben im Browser fest. Sie können die Seite in Farben und mit Kontrasten ansehen, die für sie gut funktionieren, ohne dass dabei das Layout durcheinander gebracht wird.

Ressourcen

Ressourcen sind nur zu Informationszwecken und keine offizielle Empfehlung.

Tests

Vorgehensweise

  1. Öffnen Sie die Webseite in einem Browser, der es Benutzern erlaubt, die Farben von HTML-Inhalten zu ändern.

  2. Ändern Sie die Text-, Link- und Hintergrundfarben in den Browser-Einstellungen, so dass sie sich von den derzeit im Browser eingestellten unterscheiden.

    Anmerkung: Stellen sie sicher, dass Sie nicht die Option wählen, die dem Browser sagt, dass er die auf der Seite festgelegten Farben ignorieren soll.

  3. Kehren Sie zu der Seite zurück und prüfen Sie, ob die Seite in den neuen Text-, Link- und Hintergrundfarben angezeigt wird.

  4. Prüfen Sie, ob jegliche Rahmen nach wie vor angezeigt werden und ob das Layout beibehalten wird.

Erwartete Ergebnisse

Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.