WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: please test expanding content areas

for

From: Steve Faulkner
Date: Feb 10, 2012 7:33AM

hi Steve,
you wrote:

"In my view ARIA is currently only a theoretical solution. We meet very few
people who have any idea what it is. Some are aware that new events are now
announced but they don't know what they mean. It's a chicken and egg problem
insofar as people will not learn until ARIA is widely supported and used.
However, I think it's going to take a very large organisation such as Amazon
or the BBC to implement ARIA before users develop the need or desire to
learn about it."

Its not a matter of people learning ARIA in many circumstances. Many ARIA
features allow developers to provide the semantics already provided in HTML
and desktop UI's. In some cases it that the semantics are new within a web
page but not on the desktop. Many of the custom controls that ARIA allows
developers to provide the semantcis for are in the process of being
implemented natively in HTML (example sliders and menus)

many of the large web sites and companies are already using ARIA:
Google uses it extensively in all its products including gmail/reader/docs
etc.
the BBC uses landmark roles on its sites
the BBC olympic site makes use of other ARIA semantics
http://www.bbc.co.uk/sport/0/olympics/2012/
IBM uses ARIA in over 150 of its web based products
yahoo uses it extensively

In many cases the user has no need to be aware of ARIA to make use of it,
it just results in the user getting semantic information that would not
otherwise.

regards
Stevef

On 8 February 2012 23:58, Steve Green < <EMAIL REMOVED> > wrote:

> This sort of hide / reveal feature always causes problems when we do user
> testing with screen reader users, even highly-proficient ones. As Patrick
> says, you don't know whether something has changed. Even if you do know
> that
> something changed, you don't know what and you don't know if it is worth
> making the effort to find out.
>
> Don't forget that a screen reader user cannot quickly scan content like
> most
> users can - they have to read all of it, and it is frustrating to do so and
> find that it actually was not worth the trouble. Hide / reveal is more
> suited to optional content such as Help text, not the main content.
>
> In my view ARIA is currently only a theoretical solution. We meet very few
> people who have any idea what it is. Some are aware that new events are now
> announced but they don't know what they mean. It's a chicken and egg
> problem
> insofar as people will not learn until ARIA is widely supported and used.
> However, I think it's going to take a very large organisation such as
> Amazon
> or the BBC to implement ARIA before users develop the need or desire to
> learn about it.
>
> In the meantime I advise people to only use hide / reveal and other dynamic
> features if it is really necessary. In your case I would say it's not.
>
> Steve Green
> Managing Director
> Test Partners Ltd
>
>
> -----Original Message-----
> From: <EMAIL REMOVED>
> [mailto: <EMAIL REMOVED> ] On Behalf Of Vincent Young
> Sent: 08 February 2012 03:52
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] please test expanding content areas
>
> Sure, I've implemented it that way before. Just depends on the user base
> and system.
>
>
> On Tue, Feb 7, 2012 at 7:19 PM, Ryan E. Benson < <EMAIL REMOVED>
> >wrote:
>
> > I think the expanded bubble would be confusing to non-technical users.
> > Can't you do the same sort of thing on the image that is there, and
> > see what image is loaded (unless it is being rotated), and changing
> > the alt?
> >
> > --
> > Ryan E. Benson
> >
> >
> >
> > On Tue, Feb 7, 2012 at 10:03 PM, Vincent Young < <EMAIL REMOVED> >
> > wrote:
> > > OK. Seems like you have a bit of variety with more users leaning
> > > towards IE and a fair amount (7%) using IE7. Seeing that you are at
> > > a
> > university,
> > > I'm guessing you will need to ensure you a wide range of ability is
> > > covered. So, I don't think you can go ARIA wild, but we can use it
> > > with
> > a
> > > bit of progressive enhancement. I came up with an example:
> > >
> > > http://webhipster.com/testing/accessibility/expand/index.html
> > >
> > > What's going on:
> > > 1. Ensure the link points to the in page content. I have it
> > > pointing to the content heading.
> > >
> > > - href="#what-heading"
> > >
> > > 2. Since this is an in-page link you don't want the page jumping
> > > when it
> > is
> > > clicked so you'll have to stop the default behavior (i didn't use it
> > here,
> > > but jquery works):
> > >
> > > if(e.stopPropagation) {
> > > e.stopPropagation();
> > > e.preventDefault();
> > > }
> > > else {
> > > e.cancelBubble = true;
> > > e.returnValue = false;
> > > }
> > >
> > > 3. When the link is clicked, focus the content to recreate the
> > > natural in-page link behavior for screen reader users. In this
> > > case, to be able
> > to
> > > focus naturally non-tab focusable content, you'll need to add
> > tabindex="-1"
> > >
> > > - I added tabindex="-1" to the content heading
> > >
> > > 4. Some might not agree, but I went ahead and added role="alert" and
> > > aria-live="assertive" to the content wrapper. This ensures all the
> > content
> > > gets read.
> > >
> > > 5. You will also need to ensure the proper state is identified for
> > > screen reader users, which I do in the link with some off-screen
> > > content (this
> > is
> > > updated via javascript)
> > >
> > > - <span id="what-state" role="status">Expand</span> or <span
> > > id="what-state" role="status">Collapsed</span>
> > >
> > >
> > > - I also added role="status" which new browsers update accordingly.
> > > - For the old browsers that don't understand status, if the content
> is
> > > expanded and I activate the link again, I blur then focus the link.
> > These
> > > ensures that the new state of "Collapsed" is read.
> > >
> > > 6. Proper state is also identified for non screen reader users with
> > > the :focus and :hover pseudo class.
> > >
> > > I think I hit all the major points. Let me know if you need me to
> > explain
> > > anything further. Comments/suggestions welcome.
> > >
> > > Best,
> > >
> > > Vincent
> > >
> > > It is just an example so please treat as such. Maybe I'll write
> > >
> > > On Tue, Feb 7, 2012 at 4:42 PM, Angela French < <EMAIL REMOVED> >
> wrote:
> > >
> > >> For browsers our web stats show: IE 60%, FF: 17%, Chrome: 11%,
> Safari:
> > 9%
> > >>
> > >> for IE, IE8: 57%, IE9: 30%, IE7: 7% IE6: less than 1% thank god.
> > >> For FF: FF9: 52%, FF8: 9%, FF3.6: 8%, FF10: 5%
> > >>
> > >> I do not know which AT versions I should be targeting.
> > >>
> > >>
> > >> >Angela,
> > >> >
> > >> >What browser/at combinations are you looking to support? This
> > >> >makes a difference in terms of implementation.
> > >> >
> > >> >-Vincent
> > >> >
> > >> >On Tue, Feb 7, 2012 at 3:38 PM, Angela French < <EMAIL REMOVED> >
> > wrote:
> > >> >
> > >> >> Thanks. I had just found this one that I think I'll make a test
> > >> >> page for this week:
> > >> >> http://test.cita.uiuc.edu/aria/tabpanel/tabpanel2.php#lsc2 ,
> > >> >>
> > >> >> >
> > >> >> >We're rapidly moving beyond my expertise, but check out this
> > article.
> > >> >> >It seems to have the recipe for this situation:
> > >> >> >http://weba.im/3lo
> > >> >> >(from Filament Group)
> > >> >> >
> > >> >> >
> > >> >> >