zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Barrierefreiheit
Seite neu laden Aufklappnavigation aber bitte barrierefrei

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 24.11.2012, 13:25
Gerrit
neuer user
Thread-Ersteller
 
Registriert seit: 29.04.2008
Beiträge: 52
gerrit87 befindet sich auf einem aufstrebenden Ast
Standard Aufklappnavigation aber bitte barrierefrei

Hallo zusammen,

was muss ich beachten, wenn ich eine Aufklappnavigation barrierefrei hinbekommen möchte? Grundsätzlich wollte ich li:hover ul { display: block;} nutzen.

Grüße
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 28.03.2013, 09:21
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 15.01.2011
Beiträge: 123
Barodscheff befindet sich auf einem aufstrebenden Ast
Standard

Hi,

durch die Frage ist nicht ganz klar was du möchtest. Eine barrierefreie Navigation ist ja keine große Sache. Du musst nur darauf achten richtig zu verschachteln:

Code:
<ul>
  <li>Hauptpunkt 1</li>
  <li>Hauptpunkt 2
    <ul>
      <li>Unterpunkt 2.1</li>
      <li>Unterpunkt 2.2</li>
      <li>Unterpunkt 2.3</li>
    </ul></li>
   <li>Hauptpunkt 3</li>
</ul>
Wenn du nach dem Schema verschachtelst bist du barrierefrei
Die CSS Angaben haben sogesehen nichts mit Barrierefreiheit zu tun. CSS dient nur der Darstellung.

LG
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 28.03.2013, 22:21
Benutzerbild von lottikarotti
Ein ♥ für's Web
XHTMLforum-Mitglied
 
Registriert seit: 18.04.2012
Ort: Karlsruhe
Beiträge: 396
lottikarotti wird schon bald berühmt werden
Standard

Guten Abend,

Zitat:
Zitat von Barodscheff Beitrag anzeigen
Wenn du nach dem Schema verschachtelst bist du barrierefrei
Die CSS Angaben haben sogesehen nichts mit Barrierefreiheit zu tun. CSS dient nur der Darstellung.
das stimmt leider nicht ganz und sollte auch nicht so leichtfertig behandelt werden. Gerade bei Dropdown-Menüs sieht man oft, dass untergeordnete Listen mittels display:none versteckt werden. Dies führt allerdings dazu, dass manche Screenreader diese Inhalte unterdrücken und gar nicht erst ausgeben. Somit sind Teile der Navigation, für Personen die auf einen Screenreader angewiesen sind, gar nicht erst sichtbar.

Auch heißt "Barrierefreiheit" nicht nur, dass eine Seite für einen hochgradig behinderten Menschen bedienbar sein muss. Es fängt nämlich schon damit an, dass eine Seite mittels Tastatur gut zu bedienen sein sollte -- auch dies lässt sich gerade für Dropdown-Menüs nur mittels CSS lösen (Stichwort :focus).

Um Menschen mit einer Behinderung die Bedienung sogar noch zu erleichtern, kann man mittels text-indent Hinweise hinterlassen, welche nur für Screenreader zu sehen sind. So kann man komplexere Strukturen, welche ohne die Seite visuell wahrnehmen zu können irritierend wirken, genauer beschreiben und den Besucher besser durch die Inhalte führen.

Fazit: Barrierefreies Webdesign ist doch ein wenig mehr als nur ein sauberes Markup.

Hier wirst du weitere Informationen zum Thema finden.

Mit freundlichen Grüßen,
lotti
__________________
Empfehlenswerte Links:
jsFiddle | JavaScript Patterns | RedBeanPHP | Mozilla Developer Network -/- W3C Validator | JSLint

Geändert von lottikarotti (28.03.2013 um 22:23 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 02.04.2013, 07:19
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von lottikarotti Beitrag anzeigen
Gerade bei Dropdown-Menüs sieht man oft, dass untergeordnete Listen mittels display:none versteckt werden. Dies führt allerdings dazu, dass manche Screenreader diese Inhalte unterdrücken und gar nicht erst ausgeben. Somit sind Teile der Navigation, für Personen die auf einen Screenreader angewiesen sind, gar nicht erst sichtbar.

Auch heißt "Barrierefreiheit" nicht nur, dass eine Seite für einen hochgradig behinderten Menschen bedienbar sein muss. Es fängt nämlich schon damit an, dass eine Seite mittels Tastatur gut zu bedienen sein sollte -- auch dies lässt sich gerade für Dropdown-Menüs nur mittels CSS lösen (Stichwort :focus).
jepp ganz genau!
Mit der Ergänzung das so gut wie kein screenreader es dann vorliest!
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #5 (permalink)  
Alt 02.04.2013, 08:58
Benutzerbild von David
auch, ja!
XHTMLforum-Kenner
 
Registriert seit: 08.11.2007
Beiträge: 2.633
David ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer Anblick
Standard

Das interessiert mich jetzt doch: wie setzt ihr ein Dropdown für Tastatur mit reinem CSS um. Im gegensatz zu :hover ist :focus doch immer nur auf ein Element beschränkt, oder irre ich mich da?
__________________
github | http://dnaber.de
Mit Zitat antworten
  #6 (permalink)  
Alt 02.04.2013, 11:08
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.792
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Es gibt eine clevere Methode, die Float-Drops zum Ausklappen nutzt (http://www.cssplay.co.uk/menus/new-dropdown.html) aber ob man sich das in der Praxis antun will?

Wenn ich derzeit ein Dropdownmenü erstellen müsste, würde ich wohl zum einen dafür sorgen, dass auch ohne Ausklappfunktion alle Menüpunkte erreichbar sind (Übersichsseiten oder dauerhaft sichtbares Untermenü) und angesichts dessen, dass man sich ja nicht mehr darauf verlassen kann, dass es etwas wie :hover überhaupt noch gibt, ist wohl eine durchdachte JavaScript-Lösung heutzutage die bessere Idee.

Noch zu den nicht vorgelesenen Untermenüs: Wenn das Ausklappen auch für Nutzer von Screenreadern möglich ist, dann kann man auch display:none einsetzen. Aria-Attribute kann/sollte man unterstützend einsetzen.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CMS: welches ist am barrierefrei freundlichsten ?? bastien Barrierefreiheit 42 24.12.2007 20:40
Ist eine Tabelle barrierefrei? maggie Barrierefreiheit 21 10.02.2007 15:43
Pflichtfelder barrierefrei markieren Xavier Barrierefreiheit 15 24.06.2006 00:19
Ist diese Seite barrierefrei? jobo Barrierefreiheit 5 15.07.2005 07:08
Sind Selectboxen barrierefrei? ani Barrierefreiheit 4 13.10.2004 15:27


Alle Zeitangaben in WEZ +2. Es ist jetzt 00:52 Uhr.