E-mail List Archives
Thread: Suggestion for most accessible solution to lists of links that are shown or hidden with CSS
Number of posts in this thread: 1 (In chronological order)
From: Birkir R. Gunnarsson
Date: Mon, Apr 01 2013 7:06AM
Subject: Suggestion for most accessible solution to lists of links that are shown or hidden with CSS
No previous message | No next message
Yea wise ones.
Hope you have enjoyed thy Easters to the max!
I have been contemplating a bit of a conundrum for one of my
accessibility evaluation projects.
I have too many solutions and my search so far does not seem to
indicate a standard accessibility implemenation, but this is a common
coding technique.
There is a website I am evaluating.
On the site there is an item (pseudo link I believe).
It says (in Icelandic admittedly):
"Apply for a new ID".
When you hover over it with the mouse (onMouseOver) you get a list of
actual links such as "apply for new ID as a foreigner", "apply because
my ID was lost or stolen" etc. These are all links to different forms
and procedures.
This is implemented by just hiding the options with CSS until the event happens.
If you turn off CSS you see all the items in this list without having
to activate them with the mouse.
The obvious issue with this control is that it is device-dependent and
there is no keyboard support.
It can be made keyboard accessible by adding a TabIndex, setting ARIA
role = "link" or "button" and then implementing the onKeyDown event
handler to accept space or enter.
The question I am contemplating is how best to indicate to non-sighted
users that the item has a submenu.
Is this a prime candidate for HasPopupMenu ARIA attribute, should I
look into aria-expand (all coding examples that I have seen for
aria-expand have to do with trees), should I suggest making this into
a button and using the button-pressed property, or something entirely
different?
Any of these suggestions should work just fine, but given that this is
a fairly common coding technique I am wondering if you guys have more
of a standard recommendation for how best to address this from an
accessibility perspective.
I like consistent recommendations to the extent possible, so I decided
to throw this one out here.
Cheers
-B