Responsive Design - Bilderslider - Screenreader für Blinde

[Sharky]

Hallo zusammen,

nach 3 Tagen schweißtreibender Arbeit ist es mir (als Laie) gelungen, von 2.11.12 auf 3.1.4 umzustellen
Siehe auch hier: Forenthema-Link

Nun hänge ich am responsive Design. Dazu Folgendes:

Eine blinde Dame, die mit Screenreader im Netz unterwegs ist, hat mich darauf aufmerksam gemacht, dass ihr/dieses Programm zum Vorlesen der Website bei einem Bilderslider die alt- und title-Texte mit vorliest. Es treibt sie also fast zum Wahnsinn, wenn (in der Kopfzeile) ein Bilderslider installiert ist. Bei jedem Bildwechsel springt der Screenreader zur Kopfzeile zurück und liest wieder und wieder die alt- und title-Texte vor und sie muß jedesmal zum bisher gelesenen Seiteninhalt zurück suchen. So eine Seite ist also imgrunde für Blinde unbrauchbar bzw. unlesbar. Ich habe also in allen Bilder-Slidern die alt- und title-Texte entfernt und den Seitenkopf-Slider ganz nach unten in einen custom-Bereich installiert und per CSS nach oben verlegt. Außerdem setze ich Bilderslider nur noch sehr sparsam und nur auf der Startseite ein. Deshalb verwende ich auch keine Inhaltselement-Slider mehr, die reinen Text enthalten. Mit dem Ergebnis war die Dame sehr zufrieden.

So, nun kommt das responsive Design, das mit prozentualer Bildbreite arbeitet, damit das Bild bei schmäleren Bildschirmen entsprechend skaliert wird. Dazu müsste ich eigentlich, nach meinem bisherigen Verständnis, den Slider wieder direkt in den header einbinden, was ich ja eigentlich aus accessibility-Gründen gar nicht will. Stehe auf dem Schlauch oder habe ich was mißverstanden?

Hat jemand eine Idee dazu?

Vielen Dank schon mal für die Hilfe, Sharky

Übrigens: aus gleichem Grund wäre es sehr wünschenswert, wenn nicht nur Navigations-Menüs sondern auch alle Bilder und Bildergalerien standardmäßig mit einem skip-Link zum nächsten Text/Inhaltselement mit einem kurzen Hinweis auf ein/e folgende/s Bild/Bildergalerie versehen wären, damit man solche Stellen mit Screenreader überspringen kann. Bisher habe ich das manuell eingefügt.

[uwe]

Hat jemand eine Idee dazu?

Hallo Sharky

Was hältst du denn von der Idee, den für Screereader lästigen Bilderslider mit CSS auszublenen?

http://www.zehe-edv.de/2012/04/24/ve...h-verschieben/

Wie zuverlässig allerdings ein Screenreader mit Sniffing erkannt werden kann, weiss ich leider nicht.

[Sharky]

Hallo Uwe,

vielen Dank für den Hinweis und den interessanten Link.

Also eine extra CSS-Datei anlegen für "aural, braille" und dort die Bildergalerie mit display:none; oder visibility: hidden; ausblenden.

Es ist nicht einfach, die Seiten für Blinde anzupassen, da man die HP ohne zusätzlich installierten Screenreader gar nicht testen kann. Leider sind diese Programme sehr teuer. Es soll aber demnächst auch ein kostenloses Open Source Projekt dafür geben.

Grüße, Sharky

[lucina]

Der Weg, da keine Alt-Texte zur Verfügung zu stellen wäre schon der Richtige, jedenfalls dann, wenn man die entsprechenden Kommentare zum Thema WAI liest.

Mit einem Stylesheet aural,braille solltest Du den Screenreader auch erwischen, und iOS mit aktiviertem Voiceover sollte davon auch profitieren (wobei ich das jetzt für iOS 7 noch nicht probiert habe).