E-mail List Archives
Thread: Checking color contrast, keyboard focus and webpage look/ARIA as a blind user
Number of posts in this thread: 3 (In chronological order)
From: Birkir R. Gunnarsson
Date: Thu, Feb 14 2013 9:13AM
Subject: Checking color contrast, keyboard focus and webpage look/ARIA as a blind user
No previous message | Next message →
Hey gang
For color contrast, I know of the BX toolbox for Jaws, which I am
experimenting with, but I was wondering if there is some other way to
check color contrast on a webpage as a blind user.
I was also wondering if there is a way for me as a screen reader user
to test whether the keyboard focus indicator (outline) is vissible or
not on a webpage.
I usually ask a sighted colleague to do these checks for me, it is
quite quick for them, but I'd like to do as much checking of this as
possible independently.
Finally, I was wondering if it were possible to include a description
of a webpage and how it relates to an ARIA role, may be put it on a
website somewhere.
For instance, I see a long long list of links and I suspect this is an
example of RWD/tabbed browsing, but I'd like to know a bit what it
would look like visually, so I could suggest the ARIA tabbed interface
solution.
Same with flyout menus, carousels, tree controls etc.
(for many of these things the look seems obvious to me, such as trees,
but if I could ask a lay person to look at a site or part of a site,
tell me what it looks like and then I could relay that to an ARIA
solution, it would be great).
This is probably impossible, but I was just wondering about it.
Cheers
-B
From: Chagnon | PubCom
Date: Thu, Feb 14 2013 10:20AM
Subject: Re: Checking color contrast, keyboard focus and webpage look/ARIA as a blind user
← Previous message | Next message →
Birkir wrote: "For instance, I see a long long list of links and I suspect
this is an example of RWD/tabbed browsing"
Sometimes this can be caused by a multi-level tabbed navigation system,
where one tab can hold many sub-links and sub-sub-links to interior
webpages.
But it also could be a multi-navigation design with links, menus, and lists
placed in several different places on the webpage. Large organizations often
suffer political infighting about whose project or program gets a link on
the opening homepage. It's a status fight! To accommodate everyone in the
organization, web developers will often create several different menu
systems here and there around the webpage. One of my client's website has a
100+ links to major projects in a long list down the left side of the page
that I wouldn't call a menu or navigation system. It's a disjointed,
uncoordinated list of everyone's pet project.
For example, I'm on a webpage right now for a large organization and it has
around 75 links on it. The main website's navigation is 8 links aligned
left-to-right across the top of the webpage, above the banner and all other
information. Web developers usually call this the "persistent" navigation
because it should be consistent throughout the entire website. For example,
the search box is there.
The secondary "quick links" menu is down the left side of the webpage and it
has 16 links. Some of these link to the most frequently visited pages in the
website, others are there because someone lobbied to get their project on
the homepage. I don't know what to call this type of menu: hodgepodge?
Mash-up?
The third menu of links appears on the right side of the page, top to
bottom. It has 9 links to webpages that are related to the main topic of the
webpage. Web developers refer to this as a variable or dynamic menu because
it changes depending upon which webpage or topic you are visiting.
The very bottom of the webpage contains 5 footer links, such as the privacy
policy and sitemap.
The remaining 2 dozen plus links are in the main content storywell in the
center of the webpage. Most are interspersed within the body text, others
are in unordered lists (at least I hope they're coded that way!).
I'm fully sighted and able, and I'm confused and lost when visiting this
website. If I used a screen reader, I would pray that there was a "skip-nav
/ skip to main content" link at the very top!
Regarding ARIA roles, I'm not sure all of these different types of links
could be designated with ARIA. Some are menus, but some are also a
hodgepodge of linked "stuff."
I'd love to hear other's opinions about this type of web design and how it
could be improved with ARIA.
-Bevi Chagnon
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - -
www.PubCom.com - Trainers, Consultants, Designers, Developers.
Print, Web, Acrobat, XML, eBooks, and U.S. Federal Section 508
Accessibility.
New schedule for classes and workshops coming in 2013.
From: Tim Harshbarger
Date: Fri, Feb 15 2013 8:39AM
Subject: Re: Checking color contrast, keyboard focus and webpage look/ARIA as a blind user
← Previous message | No next message
Unless someone else knows of another method, I would recommend just reading the HTML, CSS, and Javascript. Inspecting the DOM can also be useful.
Another option is to make a virtue of necessity. My environment might differ from yours, but I'll often meet with the people creating or maintaining the user interface and walk through it with them. I'll do things like teach them how to check the colour contrast and keyboard navigation. We also will discuss the parts of the user interface, how they work, and what they do. Basically, I walk them through the mental processes of evaluating the user interface. It provides opportunities to educate them on aspects of accessibility they don't know. It also gives us an opportunity to discuss different solutions. Sometimes, there are limitations on what the team can do which can alter what kinds of solutions will work best for the situation.
I think this more active style of engagement with the designers and developers tends to lead to better results. They learn more about accessibility. They get some insight into the evaluation process. And working together that closely leads to them being more willing to drop by or call if they have any questions. Well, actually, I have even had a few people stop me in public to ask accessibility questions.
Thanks,
Tim
-----Original Message-----
From: = EMAIL ADDRESS REMOVED = [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R. Gunnarsson
Sent: Thursday, February 14, 2013 10:14 AM
To: WebAIM Discussion List
Subject: [WebAIM] Checking color contrast, keyboard focus and webpage look/ARIA as a blind user
Hey gang
For color contrast, I know of the BX toolbox for Jaws, which I am
experimenting with, but I was wondering if there is some other way to
check color contrast on a webpage as a blind user.
I was also wondering if there is a way for me as a screen reader user
to test whether the keyboard focus indicator (outline) is vissible or
not on a webpage.
I usually ask a sighted colleague to do these checks for me, it is
quite quick for them, but I'd like to do as much checking of this as
possible independently.
Finally, I was wondering if it were possible to include a description
of a webpage and how it relates to an ARIA role, may be put it on a
website somewhere.
For instance, I see a long long list of links and I suspect this is an
example of RWD/tabbed browsing, but I'd like to know a bit what it
would look like visually, so I could suggest the ARIA tabbed interface
solution.
Same with flyout menus, carousels, tree controls etc.
(for many of these things the look seems obvious to me, such as trees,
but if I could ask a lay person to look at a site or part of a site,
tell me what it looks like and then I could relay that to an ARIA
solution, it would be great).
This is probably impossible, but I was just wondering about it.
Cheers
-B