Jens O. Meiert

Accessibility-Eigenschaften von CSS (W3C)

Originalversion:
http://www.w3.org/TR/CSS-access
Übersetzer:
Jens O. Meiert, meiert.com
Datum der Übersetzung:
14. Dezember 2004 (↻ 7. Februar 2007)

Bei diesem Dokument handelt es sich um die deutsche Übersetzung eines W3C-Textes. Dieser Text ist urheberrechtlich geschützt; bitte beachten Sie die Hinweise des Originaldokuments sowie die Anmerkungen der W3C-Dokumentlizenz. Die Übersetzung hat keine durch das W3C legitimierte, normative Wirkung. Das einzige maßgebliche Dokument ist das englische Original.

Bitte senden Sie Fehler und Korrekturen zur deutschen Fassung an den Übersetzer. Kommentare des Übersetzers, die als solche gekennzeichnet sind, unterliegen dem Urheberrecht des Übersetzers. Sie sind kein Bestandteil des Ursprungsdokuments.

W3C.

Accessibility-Eigenschaften von CSS

W3C-Anmerkung vom 4. August 1999

Diese Version:
http://www.w3.org/1999/08/NOTE-CSS-access-19990804
Aktuelle Version:
http://www.w3.org/TR/CSS-access
Vorherige Version:
http://www.w3.org/1999/06/NOTE-CSS-access-19990616
Herausgeber:
Ian Jacobs (ij@w3.org)
Judy Brewer (jbrewer@w3.org)

Kurzfassung

Dieses Dokument fasst die Fähigkeiten von CSS (Cascading Style Sheets) Level 2 ([CSS2]) zusammen, die direkt mit der Barrierefreiheit von Webdokumenten zusammenhängen. Manche der Accessibility-Eigenschaften, die in diesem Dokument beschrieben werden, waren auch bereits in CSS 1 ([CSS1]) vorhanden. Dieses Dokument wurde verfasst, damit sich andere Dokumente in durchgängiger Form auf die Barrierefreiheitseigenschaften von CSS beziehen können.

Status dieses Dokuments

Dieses Dokument ist eine Anmerkung, die durch das W3C veröffentlicht wurde. Diese ANMERKUNG wurde durch die EOWG (Education and Outreach Working Group) der WAI (Web Accessibility Initiative), die PFWG (Protocols and Formats Working Group) und die Arbeitsgruppe für CSS und Formatierungseigenschaften befürwortet.

Die Veröffentlichung einer W3C-Anmerkung impliziert nicht die Billigung aller W3C-Mitglieder. Eine Liste aktueller technischer Berichte und Publikationen einschließlich Arbeitsentwürfen und Anmerkungen kann unter http://www.w3.org/TR/ eingesehen werden.

Wie Stylesheets der Barrierefreiheit helfen

CSS dient der Zugänglichkeit in erster Linie durch die Trennung von Dokumentstruktur und Präsentation. Stylesheets wurden so entworfen, dass sie außerhalb des Markups genaue Kontrolle über Zeichenabstände, Textausrichtung, Objektpositionen, Audio- und Sprachausgabe, Schriftcharakteristiken &c. erlauben. Indem die Darstellung vom Markup getrennt wird, können Autoren das HTML ihrer Dokumente vereinfachen und säubern und die Dokumente dabei gleichzeitig zugänglicher machen.

CSS erlaubt Kontrolle über Abstand, Ausrichtung und Positionierung. Autoren können dadurch Elementmissbrauch vermeiden – die Praxis, ein strukturelles Element wegen seines stilistischen Effekts zu missbrauchen. Während beispielsweise in HTML blockquote- und table-Elemente Zitate und tabellarische Daten darstellen sollen, werden sie statt dessen häufig dazu verwendet, bestimmte visuelle Effekte wie Einrückung oder Ausrichtung zu erzeugen. Wenn spezielle Software wie Sprachsynthesizer auf derart falsch verwendete Elemente stößt, können die Ergebnisse für den Benutzer unverständlich oder gar unbrauchbar sein.

Stylesheets können allerdings nicht nur verhindern, dass Elemente, sondern auch, dass Bilder missbraucht werden: Manche Autoren verwenden zum Beispiel transparente (und damit unsichtbare) 1-Pixel-Bilder, um Inhalte zu positionieren. Dies bläst Dokumente nicht nur auf und vergrößert sie, sondern sorgt zudem dafür, dass sie langsam geladen werden und User-Agents, die nach alternativem Text (alt-Attribut) suchen, »irritiert« werden. CSS-Positionierungseigenschaften bedeuten, dass unsichtbare Bilder nicht länger benötigt werden, um die Positionierung zu kontrollieren.

CSS bietet genaue Kontrolle über Schriftgrößen, Farben und Stile. Einige Autoren verwenden Bilder, um Text in einer bestimmten Schrift darzustellen, wenn sie sich unsicher sind, ob die Schrift auf dem Client-Rechner installiert ist. Text in Bildern ist weder Spezialsoftware wie Screenreadern zugänglich, noch kann er von Suchrobotern erfasst werden. Die mächtigen »WebFonts« in CSS erlauben Benutzern größere Kontrolle über die clientseitigen Schriftinformationen, um dieses Problem zu beseitigen. Mit »WebFonts« können sich Autoren auf Fallback-Mechanismen seitens des Clients verlassen, wenn die vom Autor bevorzugten Schriften nicht verfügbar sein sollten. Schriften können über die Client-Software mit größerer Genauigkeit ersetzt werden und sogar aus dem Internet heruntergeladen werden, je nachdem, wie es der Autor festgelegt hat.

CSS erlaubt es Benutzern, Autorenzuweisungen aufzuheben. Dies ist sehr wichtig für Benutzer, die eine Seite nicht mit den vom Autor gewählten Schriften und Farben wahrnehmen können. CSS erlaubt es Benutzern, Dokumente mit ihren bevorzugten Schriften, Farben &c. zu betrachten, indem sie diese in einem Nutzerstylesheet spezifizieren.

CSS unterstützt automatisch generierte Zahlen, Markierer und andere Inhalte, die Benutzern dabei helfen können, sich in einem Dokument zu orientieren. Lange Listen, Tabellen oder Dokumente sind leichter zu navigieren, wenn Zahlen oder andere kontextuelle Hinweise auf zugängliche Weise vorliegen.

CSS unterstützt auditive Stylesheets, die spezifizieren, wie ein Dokument klingen soll, wenn es in Sprache umgewandelt wird. Auditive Stylesheets (Kurzform: ACSS) gestatten es Autoren und Benutzern, die Lautstärke gesprochener Inhalte, Hintergrundklänge, räumliche Klangeigenschaften und eine Menge weiterer Eigenschaften zu spezifizieren, die synthetischer Sprache Effekte hinzufügen können, die analog zu denen sind, die Schriften bei der visuellen Ausgabe zugeordnet werden können.

CSS bietet exaktere Kontrolle über die Anzeige alternativer Inhalte, als dies HTML allein kann. CSS-2-Selektoren erlauben Zugriff auf Attributswerte, was dazu verwendet werden kann, alternative Inhalte anzubieten. Mit CSS 2 können Attributswerte in einem Dokument zusammen mit den Primärinhalten eines Elements gerendert werden.

CSS-Implementierungen

Zum Zeitpunkt der Veröffentlichung dieser Anmerkung wurde CSS von den weit verbreiteten Browsern noch nicht konsistent implementiert. Die jüngste Generation von Browsern weist jedoch eine solide Implementierung des Meisten aus CSS 1 und vielem aus CSS 2 auf, und die Implementierungen scheinen zunehmend besser zu werden.

Die Vorteile der in diesem Dokument beschriebenen Merkmale und Eigenschaften bestehen offensichtlich nicht ohne eine saubere Implementierung von CSS 1 und CSS 2. Ein zugängliches Dokument mit CSS zu entwerfen beinhaltet es, sicherzustellen, dass das Dokument zugänglich bleibt, wenn Stylesheets deaktiviert oder nicht unterstützt werden.

Entwickler dürfen zugängliche Dokumente kreieren, die verbreitete Eigenschaften von CSS mit präsentationsbezogenen Merkmalen von HTML mischen, bis die meisten Browser CSS konsistent unterstützen. Dokumente, die solche präsentationsbezogenen HTML-Merkmale verwenden, müssen leicht umwandelbar sein – zum Beispiel müssen für Layoutzwecke gebrauchte Tabellen Sinn machen, wenn sie seriell gerendert werden.

Accessibility-Eigenschaften in CSS 2

Es folgt nun eine Liste von CSS-2-Eigenschaften (und den Abschnitten, in denen sie in der CSS-2-Spezifikation definiert werden), die die Barrierefreiheit betreffen. Die im Anschluss folgenden Sektionen zeigen auf, wie genau diese Eigenschaften Einfluss auf die Barrierefreiheit haben.

Abstände, Ausrichtung und Positionierung
text-indent (16.1); text-align (16.2); word-spacing und letter-spacing (16.4); font-stretch, (15.2.3); margin, margin-top, margin-right, margin-bottom und margin-left (8.3); float (9.5.1), position (9.3.1); top, right, bottom und left (9.3.2); empty-cells (17.6.1)
Überschreiben von Stilzuweisungen durch den Benutzer
!important (6.4.1); der inherit-Wert (6.2.1); Systemschriften (15.2.5); Systemfarben (18.2); Listenarten (12.6.2); dynamische Konturen (outline, outline-width, outline-style und outline-color) (18.4)
Generierte Inhalte
:before- und :after-Pseudoelemente (5.12.3, 12.1); content (12.2); cue, cue-before und cue-after (19.5)
Auditive Stylesheets
volume (19.2); speak (19.3); pause, pause-before und pause-after (19.4); cue, cue-before, cue-after (19.5); play-during (19.6); azimuth, elevation (19.7); speech-rate, voice-family, pitch, pitch-range, stress und richness (19.8); speak-punctuation und speak-numeral (19.9)
Zugriff auf alternative Inhalte
Attributselektoren (5.8); die Funktion attr() (12.2)
WebFonts
Beachten Sie Kapitel 15 der CSS-2-Spezifikation.

Abstände, Ausrichtung und Positionierung

CSS 2 ermöglicht es Autoren, die visuelle Plazierung von Inhalten auf einer Seite durch Texteinrückung, Außenabstände, Floats sowie absolute und relative Positionierung zu steuern. Indem für visuelle Effekte CSS-Eigenschaften verwendet werden, können Autoren einfacheres HTML schreiben und ehemals für Positionierung gebrauchte Bilder und nicht-umbrechende Leerzeichen ( ) vermeiden.

Die folgenden Eigenschaften geben die Kontrolle über Abstände, Ausrichtung und Positionierung:

Überschreiben von Stilzuweisungen durch den Benutzer

Um sicherzustellen, dass Benutzer CSS-Zuweisungen kontrollieren können, wurde die Bedeutung des in CSS 1 definierten !important-Operators in CSS 2 verändert. In CSS 1 hatten Autoren immer das letzte Wort, was Stilangaben anbelangte, aber in CSS 2 überwiegt jede in einem Nutzerstylesheet mit !important versehene Deklaration entsprechende Zuweisungen in einem Autorenstylesheet. Dies ist ein wichtiges Merkmal für Benutzer, die bestimmte Farbkombinationen oder -kontraste erfordern oder meiden müssen, oder solche, die große Schriften benötigen &c. So zum Beispiel spezifiziert die folgende Regel eine große Schriftgröße für Absätze, was jede analoge Autorenzuweisung aufheben würde:

p {
font-size: 24pt !important;
}

Der CSS-2-Wert inherit, der für jede Eigenschaft verfügbar ist, sorgt für kompakte !important-Stilregeln, die das Meiste oder gar alles in einem Dokument regeln können. Die folgenden Regeln erzwingen beispielsweise, dass alle Hintergrundfarben weiß und alle Vordergrundfarben schwarz sind:

/*
Setzt innerhalb des Dokuments die
Schriftfarbe auf schwarz und die
Hintergrundfarbe auf weiß.
*/

body {
color: black !important;
background: white !important;
}

/*
Sorgt dafür, dass die Werte von
»color« und »background« von allen
anderen Elementen geerbt werden,
bestärkt durch !important.
Beachten Sie, dass dies durch
andere, spezifischere Zuweisungen
überschrieben werden kann.
*/

* {
color: inherit !important;
background: inherit !important;
}

CSS 2 beinhaltet auch die folgenden Nutzerkontrollfunktionen:

Um zum Beispiel eine dicke schwarze Linie um ein Element zu ziehen, wenn es den Fokus erhält, und eine dicke rote, wenn es aktiv ist, können die folgenden Regeln verwendet werden:

:focus {
outline: thick solid black;
}

:active {
outline: thick solid red;
}

Generierte Inhalte

CSS 2 umfasst einige Mechanismen, die es ermöglichen, dass Inhalte von Stylesheets erzeugt werden:

Generierter Inhalt kann als Markierer dienen, um Benutzern zu helfen, durch ein Dokument zu navigieren und sich zu orientieren, wenn sie nicht auf visuelle Hinweise wie die gegenwärtige Position der Scrollbalken, Frames mit einem Inhaltsverzeichnis &c. zugreifen können.

Das folgende Nutzerstylesheet würde die Worte »Ende des Beispiels« nach jedem mit einer speziellen Klasse versehenen Beispiel generieren:

div.example:after {
content: "Ende des Beispiels";
}

Benutzer können beispielsweise aber auch Absätze numerieren, um ihre gegenwärtige Position in einem Dokument leichter zu ermitteln:

p:before {
content: counter(paragraph) ". ";
counter-increment: paragraph;
}

Auditive Stylesheets

Die auditiven Eigenschaften in CSS 2 bieten Benutzern, die nicht sehen können, und Benutzern von Screenreadern Informationen auf ähnliche Weise, wie Schriften Informationen visuell vermitteln. Das folgende Beispiel zeigt, wie verschiedene Klangzuweisungen (inklusive voice-family, was etwas wie eine »Audioschrift« ist) einen Benutzer wissen lassen können, dass die gesprochenen Inhalte einer Überschrift entsprechen:

h1 {
voice-family: paul;
stress: 20;
richness: 90;
cue-before: url(ping.au);
}

Die folgenden Eigenschaften sind Teil der auditiven Stylesheets in CSS 2.

Darüber hinaus beschreibt die speak-header-Eigenschaft, wie Informationen in Tabellenköpfen ausgesprochen werden sollen.

Zugriff auf alternative Darstellungen von Inhalten

CSS 2 erlaubt Benutzern den Zugriff auf Alternativdarstellungen von Inhalten, die in Attributswerten hinterlegt sind, wenn die folgenden Selektoren, Pseudoelemente, Funktionen und Eigenschaften zusammen verwendet werden:

Im folgenden Beispiel wird der Wert des alt-Attributs des img-Elements (visuell, auditiv &c.) unmittelbar nach dem Bild gerendert:

img:after {
content: attr(alt);
}

Beachten Sie, dass der Wert des Attributs (sofern definiert) dargestellt wird, auch wenn es das Bild vielleicht nicht wird, weil der Benutzer möglicherweise die Anzeige von Bildern über die Benutzeroberfläche deaktiviert hat.

Medientypen

Die CSS-2-Medientypen (unter anderem gebraucht über @media-Regeln) gestatten es Autoren und Benutzern, Stylesheets zu entwerfen, die dafür sorgen, dass Dokumente je nach avisiertem Endgerät angemessen gerendert werden. Diese Stylesheets können die Darstellung von Dokumenten auf Sprachsynthesizern, Braille- oder TTY-Geräten optimieren. Die Verwendung von @media-Regeln kann dadurch, dass es User-Agents ermöglicht wird, ungeeignete Regeln zu ignorieren, zudem Downloadzeiten minimieren.

Über die Web Accessibility Initiative (WAI)

Die WAI des W3C bemüht sich durch fünf komplementäre Aktivitäten um die Barrierefreiheit im Internet. Diese Aktivitäten sollen:

  1. Sicherstellen, dass Internettechnologien die Barrierefreiheit fördern;
  2. Accessibility-Richtlinien erstellen;
  3. Werkzeuge entwickeln, um die Evaluierung und Reparatur von Websites zu ermöglichen;
  4. Fortbildung und Verbreitung koordinieren;
  5. Forschung und Entwicklung betreiben.

Das internationale Planungsbüro der WAI ermöglicht die Annäherung von Industrie, Behindertenorganisationen, Organisationen aus der Forschung im Bereich Barrierefreiheit sowie Regierungen, die daran interessiert sind, ein zugängliches Internet zu schaffen. WAI-Sponsoren sind unter anderem die US National Science Foundation and Department of Education’s National Institute on Disability and Rehabilitation Research, das DG XIII Telematics for Disabled and Elderly Programme der Europäischen Kommission, das Telematics Applications Programme for Disabled and Elderly, die kanadische Regierung, kanadische Industrie, IBM, Lotus und NCR.

Zusätzliche Informationen zur WAI sind unter http://www.w3.org/WAI/ verfügbar.

Über die Barrierefreiheitsrichtlinien der WAI

Barrierefreiheitsrichtlinien sind essentiell für die Entwicklung von Websites und internetbezogenen Anwendungen. Zusammen mit vielen weiteren Organisationen koordiniert die WAI die Arbeit an drei Arten von Richtlinien:

Über das World Wide Web Consortium (W3C)

Das W3C wurde gegründet, um das Internet zu seinem vollen Potential zu führen, indem verbreitete Protokolle entwickelt werden, die seine Entwicklung vorantreiben und seine Interoperabilität sicherstellen. Das W3C ist ein internationales Industriekonsortium, das gemeinsam vom MIT Laboratory for Computer Science (LCS) in den USA, dem National Institute for Research in Computer Science and Control (INRIA) in Frankreich und der Keio-Universität in Japan betrieben wird. Die vom Konsortium angebotenen Dienstleistungen umfassen ein Informationsdepot über das WWW sowohl für Entwickler als auch Benutzer, Referenzcodeimplementierungen, um Standards abzubilden und voranzubringen, sowie diverse Prototypen und Beispielanwendungen, um den Gebrauch neuer Technologien zu demonstrieren. Bis heute sind mehr als 320 Organisationen Mitglieder des Konsortiums. Bitte beachten Sie http://www.w3.org/ für weitere Informationen über das W3C.

Referenzen

Eine Liste aktueller W3C-Empfehlungen sowie weiterer technischer Dokumente liegt unter http://www.w3.org/TR/ vor.

[CSS2]
Cascading Style Sheets, level 2, B. Bos, H. W. Lie, C. Lilley und I. Jacobs, 17. Mai 1998.
[CSS1]
Cascading Style Sheets, level 1, H. W. Lie und B. Bos, 17. Dezember 1996. Revidiert am 11. Januar 1999.
[HTML40]
HTML 4.0 Recommendation, D. Raggett, A. Le Hors und I. Jacobs, Herausgeber, 18. Dezember 1997. Revidiert am 24. April 1998.
[XML10]
Extensible Markup Language (XML) 1.0, T. Bray, J. Paoli, C.M. Sperberg-McQueen, Herausgeber, 10. Februar 1998.
[WAI-AUTOOLS]
Authoring Tool Accessibility Guidelines, J. Treviranus, J. Richards, I. Jacobs, C. McCathieNevile, Herausgeber.
[WAI-WEBCONTENT]
Web Content Accessibility Guidelines 1.0, W. Chisholm, G. Vanderheiden und I. Jacobs, Herausgeber, 5. Mai 1999.
[WAI-USERAGENT]
User Agent Accessibility Guidelines, J. Gunderson und I. Jacobs, Herausgeber.

Fehler entdeckt? Belohnung! E-Mail an jens@meiert.com.

Sie sind hier: meiert.comPublikationen → Accessibility-Eigenschaften von CSS (W3C)

Stand: 7. Februar 2007.