Navigation

Service-Menü

Sprachversionen

Suche



Inhalt

Infothek

WCAG 2.0
Teil 5: Schriftgrößen und Skalierbarkeit

25.08.2008

Welche Anforderungen stellen die WCAG 2.0 an die Skalierbarkeit von Webseiten und was wird sich diesbezüglich voraussichtlich im BITV-Test ändern?

Auf dieser Seite:

Die Anforderungen nach WCAG 1.0 und BITV-Test

Die WCAG 1 befassen sich in Checkpunkt 3.4 mit der Skalierbarkeit von Schrift. Verlangt wird die Nutzung von relativen Maßeinheiten wie % oder em, sowohl für die Schrift als auch für Spaltenbreiten und andere Layoutelemente. Der Checkpunkt ist eher technisch ausgerichtet, er sagt nicht, um wie viel Prozent der Benutzer die Schrift problemlos vergrößern können muss. Zudem sichert die Nutzung von relativen Maßeinheiten, insbesondere die Festlegung von Spaltenbreiten in %, allein noch nicht die Skalierbarkeit - bei ungeschickter Umsetzung kann es bei Vergrößerung schnell zu Überlappungen und abgeschnittenen Inhalten kommen.

Im BITV-Test ist daher in zwei Prüfschritten genauer festgelegt, was das Layout in Sachen Skalierbarkeit leisten muss:

In Prüfschritt 3.4.1 wird geprüft, ob die Schrift in allen Browsern durch den Benutzer skalierbar ist (also ob relative Maßeinheiten wie em oder % genutzt werden) und ob alle Inhalte auch bei vergrößerter Schrift sichtbar und lesbar bleiben (sich also nichts überlappt oder abgeschnitten wird). Geprüft wird in zwei festgelegten Browsern: Internet Explorer 6 und Firefox 1.5. Auch die Größe des Browserfensters ist festgelegt: es wird bei einer Fenstergröße von 800x600 geprüft, wobei in Firefox 2 Mal skaliert wird (entspricht einer Vergrößerung von 150%) und im Internet Explorer die Schriftgröße auf "sehr groß" eingestellt wird. Um den Prüfschritt zu erfüllen, müssen alle Schriften mitwachsen und es darf nicht zu Überlappungen oder abgeschnittenen Texten kommen. Eine Mindestschriftgröße gibt es nicht.

In Prüfschritt 3.4.2 wird die Brauchbarkeit des Layouts bei niedriger Auflösung beziehungsweise schmalen Browserfenstern geprüft. Um den Prüfschritt voll zu erfüllen, muss das Layout bei 800x600 ohne Querscrollbalken und ohne abgeschnittene oder sich überlappende Inhalte angezeigt werden. Bei 640x480 müssen die einzelnen Spalten bei 640x480 ohne zeilenweises Querscrollen nutzbar sein.

Die Anforderungen nach WCAG 2.0

Auch die WCAG 2.0 verlangen, dass alle Schriften ohne Informationsverlust skalierbar sind. Wie im BITV-Test wird keine Mindestschriftgröße für das Default-Layout gefordert.

Erfolgskriterium 1.4.4 (Resize Text) verlangt, dass die Schrift um 200% vergrößert werden kann - unabhängig von der Breite des Browserfensters. Dabei müssen Websites nicht zwingend die browsereigene Schriftvergrößerungsfunktion unterstützen, sie können stattdessen auch eigene Styleswitcher beziehungsweise Schriftgrößenregler anbieten.

Die Nutzbarkeit des Layouts bei niedriger Auflösung und schmalen Browserfenstern wird auf Level AA gar nicht geprüft. Auf Level AAA verlangt Erfolgkriterium 1.4.8 eine (beispielsweise über einen Styleswitcher wählbare) Version des Layouts mit einer maximalen Zeilenbreite von 80 Zeichen, die in einem "full-screen window" um 200% vergrößert werden kann, ohne dass es zu Querscrollbalken kommt. Ein "Full-screen window" wird definiert als ein maximiertes Fenster auf einem Desktop- oder Laptop-Display mit dem üblichsten Format.

Hintergrund

Grundsätzlich gibt es für die vergrößerte Darstellung einer Webseite zwei Alternativen:

1. Zoomen

Wie mit einem Kopiergerät wird die gesamte Webseite vergrößert oder verkleinert. Der große Vorteil: Die Gestaltung, insbesondere die Anordnung bleibt gleich, es kann nicht passieren, dass ein Inhalt (etwa ein langes Wort) zu groß wird und nicht mehr in die Spalte hineinpasst.

Und ein weiterer Vorteil aus Sicht des Webanbieters: er muss sich (zumindest theoretisch) um nichts kümmern. Denn die proportionale Vergrößerung aller Seiteninhalte kann der Browser eigentlich selbst erledigen. Opera bietet sie schon seit Jahren an, der Internet Explorer und Firefox in den neueren Versionen auch. Allerdings berücksichtigt Firefox beim Zoomen via CSS festgelegte Maximalbreiten, werden diese falsch gewählt, kann es also trotz Zoomfunktion zu Überlappungen kommen.

Der Nachteil der Zoom-Lösung: der Überblick kann verloren gehen. Je nach Größe des verfügbaren Browserfensters wird unter Umständen nur ein recht kleiner Ausschnitt angezeigt. Und es kann passieren, dass Fließtext für das verfügbare Browserfenster zu breit ist. Dann muss bei jeder einzelnen Zeile der Bildschirmausschnitt nach rechts und wieder zurück verschoben werden, flüssiges Lesen ist unmöglich. Daher die zweite Alternative:

2. Reine Schriftvergrößerung

Nur die Schrift wird vergrößert, die Breite von Spalten oder Kästen bleibt gleich. Text wird neu umgebrochen, so dass in der Breite keine Anpassung nötig ist. In vielen Fällen ist das die übersichtlichere Lösung. Horizontales Scrollen ist nicht nötig, denn die Seite wächst nur nach unten.

Der Nachteil der Umbruch-Lösung: der vergrößerte Inhalt passt unter Umständen nicht mehr zu dem in der Breite unveränderten Layout. Einzelne Wörter sind zu lang, es kommt zu Überlappungen oder abgeschnittenen Inhalten. Oder Fließtext ist nicht mehr gut lesbar, weil mehr oder weniger nach jedem Wort umgebrochen werden muss. Bei neuen Inhalten muss im Prinzip immer aufgepasst werden, ob sie auch vergrößert in die vorgegebenen Breiten passen. Die reine Schriftvergrößerung stößt so schnell an Grenzen, mehrspaltige Layouts können nur um den Preis zu kleiner Ausgangsschriften oder breiter Spalten und damit eines sehr breiten Gesamtlayouts realisiert werden.

Konsequenz

Sowohl die Zoom-Lösung also auch die reine Schriftvergrößerung haben also jeweils Vor- und Nachteile. Daher wird oft versucht, sie zu kombinieren. Ein Beispiel dafür ist die neue Zoom-Funktion in Firefox, die vom Webdesigner im Stylesheet festgelegte Maximalbreiten berücksichtigt - das Layout also ab einem bestimmten Punkt nicht weiter vergrößert, sondern nur noch die Schrift (dadurch kann es allerdings natürlich zu Überlappungen von Inhalten kommen, wenn die Maximalbreiten zu knapp gewählt sind).

Oder aber beide Alternativen werden unterstützt, denn von Fall zu Fall ist mal das Zoomen und mal die reine Schriftvergrößerung besser zu nutzen. Firefox und Internet Explorer bieten in den aktuellen Versionen beide Möglichkeiten an, der Nutzer kann also wahlweise das gesamte Layout proportional zur Schrift vergrößern oder nur die Schrift.

Bewertung

Wie ist vor diesem Hintergrund der Ansatz der WCAG 2 zu bewerten?

Richtig ist der Verzicht der WCAG 2 auf eine festgelegte Mindestschriftgröße. Denn es gibt keine für alle Nutzer passende Schriftgröße. Große Schrift beansprucht mehr Platz und verschlechtert die Übersicht. Für Barrierefreiheit entscheidend ist, dass die Schriftgröße nach Bedarf verändert werden kann.

Die geforderte Vergrößerbarkeit um 200% ist sehr hoch. Durch reine Schriftvergrößerung unter Beibehaltung der Spaltenbreiten kann sie kaum erfüllt werden. Anders beim Zoomen, damit sind auch extreme Vergrößerungen problemlos möglich. Da wie gesagt die gängigen Browser mittlerweile Zoom-Funktionen anbieten, wird also auf Level AA eigentlich nur gefordert, dass die Website diese Funktion unterstützt. Das ist im Internet Explorer und in Opera normalerweise schon ohne Zutun des Webdesigners erfüllt, nur in Firefox muss wegen der Berücksichtigung von im CSS festgelegten Maximalbreiten aufgepasst werden, dass es bei starker Vergrößerung nicht zu Überlappungen kommt.

Anstelle der Unterstützung der Vergrößerungsfunktionen der Browser akzeptieren die WCAG 2 auch seiteneigene Vergrößerungsfunktionen. Das ist bei Webseiten nicht nachvollziehbar, denn normalerweise sollte es kein Problem sein, die Browser-Zoom-Funktion zu unterstützen. Schriftgrößen-Regler oder Styleswitcher auf der Seite geben die Verantwortung stärker an den Benutzer ab: er muss auf jeder Website erst einmal den Regler finden und ausprobieren, welche Einstellung für ihn am besten ist, statt einfach einmal in seinem Browser den für ihn passenden Vergrößerungsgrad einzustellen.

Eine reine Schriftvergrößerungsmöglichkeit, die sicherstellt, dass auch stark vergrößerter Text ohne zeilenweises Scrollen gelesen werden kann, wird nur auf Level AAA gefordert. Das ist bedauerlich, denn diese Funktion ist für Menschen mit Sehbehinderungen wichtig.

Die WCAG 2 verlangen sie auch hier nicht zwingend für das Default-Layout, sie kann auch über ein zusätzliches, via Styleswitcher auswählbares einspaltiges Layout angeboten werden. Das ist sicher nicht falsch, denn man kann den Standpunkt vertreten, dass Anordnung auf dem Bildschirm und Größe der darzustellenden Inhalte zusammengehören.

Was wird sich im BITV-Test ändern?

Wie bisher wird geprüft, ob die Webseite in den beiden gängigen Browsern variabel zu nutzen ist. Allerdings werden beim Testen die jeweils neueren Versionen von Firefox und Internet Explorer zum Einsatz kommen (Firefox 3 und Internet Explorer 7).

Getestet wird voraussichtlich Folgendes:

  1. Zoombarkeit um 200 Prozent bei einer Fenstergröße von 1024x768 im Internet Explorer und in Firefox mit der jeweils browsereigenen Zoomfunktion.
  2. Die neue BITV sollte auch die in den WCAG 2 nur auf Level AAA geforderte reine Schriftvergrößerung einbeziehen, die das Lesen aller Texte ohne zeilenweises Querscrollen ermöglicht. Entsprechend wird dann im BITV-Test geprüft, ob bei einer reinen Schriftvergrößerung von 200% (beziehungsweise "sehr groß" im Internet Explorer) und einer Fenstergröße von 1024x768 jede Spalte einzeln in ihrer ganzen Breite in das Fenster passt und alle Inhalte ohne Überlappungen lesbar bleiben. Alternativ wird hier auch ein entsprechendes (zum Beispiel einspaltiges) Alternativlayout akzeptiert.
  3. Nicht mehr geprüft wird, ob das Layout ohne Schriftvergrößerung bei 800x600 beziehungsweise 640x480 nutzbar ist. Das waren zwar durchaus sinnvolle Anforderungen, denn für weniger stark Sehbehinderte kann die Kombination aus großem Bildschirm und niedriger Auflösung eine gute Alternative zu Vergrößerungssoftware sein. Dermaßen niedrige Auflösungen sind aber in der Praxis kaum noch nutzbar, zudem hat die Anforderung in den WCAG 2 keine rechte Grundlage mehr.