Barrierefreie Darstellung von Texten

Zu klein gewählte Schriftgrößen machen den Inhalt von Webseiten oft unlesbar. Dieses Problem trifft insbesondere Menschen, die Probleme mit der Sehkraft haben. Aber auch den normal sehenden Seitenbesucher kann eine zu kleine Schrift stören und unnötig anstrengen. Allerdings ist die Wahl einer "optimalen" Schriftgröße problematisch, da sie individuell unterschiedlich ausfallen würde: Jeder empfindet eben eine andere Schriftgröße als optimal. Um dieses Problem der subjektiven Wahrnehmung zu lösen, kann man nun dem Benutzer die Möglichkeit geben die Schriftgröße auf seine persönlichen Bedürfnisse anzupassen. Auf dieser Seite wird eine solche Lösung mit Hilfe von JavaScript demonstriert.

Im oberen Navigationsbereich werden zwei Links ("+" und "-" rechts außen) angezeigt, mit deren Hilfe der Besucher die Schriftgröße einstellen kann. Klickt der Besucher auf den "+"-Link, so wird die Schriftgröße erhöht, klickt er auf "-", so wird sie verkleinert. Damit kann er die Schrift auf die für ihn individuell optimale Größe einstellen. Bei einer Schriftgrößenänderung wird die entsprechende Schriftgröße automatisch an alle Folgeseiten übergeben, so dass die eingestellte Schriftgröße dauerhaft – bis der Besucher die Website verlässt – auf der Website erhalten bleibt. Nimmt der Besucher die Seite in seine Bookmarks auf, so wird die eingestellte Schriftgröße mit gespeichert und bei seinem nächsten Besuch automatisch eingestellt. Diese Funktion können Sie mit nur zwei Zeilen JavaScript-Code in Ihre Seite integrieren.

Im folgenden Kasten wird der Text bedeutend kleiner angezeigt, als im restlichen Text. Nutzen Sie die Links zur Schriftgrößenregulierung um diesen Text problemlos lesen zu können. Die Übergabe an eine Folgeseite können Sie testen, indem Sie im oberen Navigationsbereich auf "Demo Seite 2" klicken. Der Inhalt dieser Seite wird dann ebenfalls in der gewünschten Schriftgröße dargestellt.

Der Text in diesem Abschnitt ist kleiner als der Rest. Dies soll auch so sein und dient der Demonstration des Skripts.

Die Schrittweite, mit der die Schriftgröße geändert wird, kann dabei beliebig im JavaScript-Code festgelegt werden. Auch die anfängliche Schriftgröße kann man in einem initialen Funktionsaufruf beliebig fest legen. Quelldatei und Beispielseiten sind komplett durchkommentiert, so dass der JavaScript-Code leicht zu verstehen ist.

Hinweis: Dieses Skript funktioniert nur, wenn der Browser JavaScript unterstützt und dieses auch eingeschaltet ist. Sollte Ihr Browser im oberen Navigationsbereich keine Links mit der Aufschrift "+" und "-" anzeigen, so sind diese Voraussetzungen nicht erfüllt. JavaScript ist eine clientseitige Scriptsprache die nur funktioniert, wenn der Client – also der Web-Browser – die Ausführung dieser Skriptsprache zulässt. Die Umsetzung einer dynamischen Schriftgrößenanpassung kann bei fehlender JavaScript Unterstützung, lediglich durch eine serverseitige Implementierung – beispielsweise mit PHP oder Perl – realisiert werden. Obwohl die meisten Benutzer Web-Browser verwenden, die JavaScript unterstützen und auch mit eingeschaltetem JavaScript surfen, funktioniert die hier demonstrierte Variante also nicht in allen Fällen.

Achtung! Sollten Sie zwischenzeitlich auf eine andere als die beiden Beispielseiten (Demo Seite 1 und Demo Seite 2) wechseln, so werden die Einstellungen nicht mehr übernommen. Alle Folgeseiten müssen für die Übergabe der Schriftgröße vorbereitet sein.

Download

Möchten Sie auch auf Ihrer Web-Site eine solche Funktion anbieten? Dann laden Sie sich die Skripte kostenlos herunter. Auf der Download Seite können Sie sich diese Lösung herunterladen.