WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: evaluating accessibility with WCAG 2.0 (Angela French)

for

From: Jason Kiss
Date: Apr 11, 2011 5:45PM

Being deliberately difficult can sometimes be useful :)

Despite my seeming protestations, I do echo your concerns, Andrew. It is
very easy to see lists everywhere, and I am sensitive to the fact that not
everything that is list-like should be marked up as a list, if only to avoid
unnecessary noise. I, too, would like a more definite account of what
content calls for list markup. Where my apparently demanding predilection
for marking up a set of links in a nav bar as a list comes from, I don't
know. I do think that list markup is semantically appropriate in this case,
but it could also be that I'm just a slave to that convention. Then again,
for some reason I'm okay with short lists of items that appear as part of a
sentence or a more sentence-like structure, as I would consider the
Zeldman.com and Yahoo! Accessibility Blog cases. I do the same thing on my
site.

Seeing how common the non-list markup approach is on sites like Freedom
Scientific's, GW Micro's, the NFB's and the ACB's, perhaps it's just not
something anyone should really get concerned about, at least from a screen
reader accessibility and WCAG perspective.

Then again, it's interesting to note that the HTML on those four sites is
quite poor to begin with, at least compared to the AFB and RNIB sites, which
have relatively decent markup and do use the list markup for their nav
links. Presumably these last two sites have the same concerns in terms of
accessibility and usability for screen reader users.

Also, while list markup does lead to additional UI audio for screen reader
users, isn't the point of HTML the structural and semantic markup of the
content? What assistive technologies do with this programmatic information
is to some degree up to them. Not applying more semantic markup for the sake
of one group of assistive technologies doesn't seem the ideal path to me.
But then these are the sorts of accommodations that we end up making all the
time, and especially for screen readers. Maybe the default verbosity of
screen readers around lists is just too great. What if lists were just
verbally introduced and closed with the words "List" and "List end", leaving
additional keyboard commands for users to interrogate the number of list
items, navigate by list item, etc., if they wished?

So, no easy answers here on the list markup question, it seems, but this is
where my other concern kicks in, and that is the place for interpretation in
WCAG and Success Criteria like 1.3.1. Is there a certain and definitive
answer in this case, or are interpretations, opinions and arguments all that
we have? Again, I'm not suggesting this is a bad thing.

Thanks,

Jason

--
Jason Kiss
Web: www.accessibleculture.org
Email: <EMAIL REMOVED>
Twitter: @jkiss


On Tue, Apr 12, 2011 at 12:31 AM, Andrew Kirkpatrick < <EMAIL REMOVED> >wrote:

> I find myself wondering where to draw the line. If the argument for the
> use of a list for any set of related links is based on the need for users to
> know that a set of items are in a group and how many items are in that group
> then perhaps lists should be used more - cnn.com has story after story on
> their home page, do we recommend that the story titles and short teaser
> blurbs be encased in a list item and the group of stories be marked up as a
> list? This would help people know how many stories there are, why don't we
> do this? Or even within a story, there may be nine paragraphs that are
> related information that is supposed to be presented in an ordered fashion -
> perhaps we need to put each paragraph into a list item and make the story an
> ordered list? Of course, I'm being deliberately difficult but I think that
> we may be overstating the importance of embedding simple sets of links into
> semantic lists and running the risk of creating an unnecessarily verbose
> audio UI for audio users.
>
> Looking around, people that you'd think would be in tune with end-user
> needs seem perfectly content without using OL or UL for sets of links...
>
> Freedom Scientific's navigation bar:
> <p class="navp"><a href="/default.asp"> Home </a> <img
> src="/images/vline.gif" alt=""><a href="/product-portal.asp" > Products
> </a><img src="/images/vline.gif" alt="" ><a href="/purchase.asp"> Purchase
> </a><img src="/images/vline.gif" alt=""><a href="/support.asp"> Support
> </a><img src="/images/vline.gif" alt=""><a href="/training.asp"> Training
> </a><img src="/images/vline.gif" alt=""><a href="/about/about.asp"> About
> Us </a><img src="/images/vline.gif" alt=""><a
> href="/about/vision-facts.asp"> Low Vision Facts </a></p>
>
> GW-Micro's navbar:
> <A HREF="#mainHeadingTitle" STYLE="position: absolute; left: -1000px;
> font-size: 0px;">Skip to Main Content</A><A CLASS="navBarLink"
> HREF="/Window-Eyes" onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Window-Eyes</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/Notetakers"
> onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Notetakers</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/DAISY_Readers"
> onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >DAISY Readers</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/Braille_Displays"
> onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Braille Displays</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/Low_Vision"
> onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Low Vision</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/Support" onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Support</A>&nbsp;<IMG
> SRC="/images/white_bullet.gif" ALT="" ALIGN="bottom">&nbsp;<A
> CLASS="navBarLink" HREF="/Training"
> onMouseOver="this.style.color='#230E75';"
> onMouseOut="this.style.color='#FFFFFF';" >Training</A>
>
> National Federation of the Blind navbar:
> <div id="HomeMenu"><a href="
> http://www.nfb.org/nfb/About_the_NFB.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_About.gif" alt="About NFB" width="128"
> height="38" border="0"></a><img
> src="/images/nfb/Template/NFBHome_MeniDivider.gif" width="1" height="38"
> alt="Line"><a href="
> http://www.nfb.org/nfb/Info_About_Vision_Loss_For.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_Information.gif" alt="Information About
> Vision Loss For" width="169" height="38" border="0"></a><img
> src="/images/nfb/Template/NFBHome_MeniDivider.gif" width="1" height="38"
> alt="Line"><a href="http://www.nfb.org/nfb/Members.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_Members.gif" alt="Members" width="103"
> height="38" border="0"></a><img
> src="/images/nfb/Template/NFBHome_MeniDivider.gif" width="1" height="38"
> alt="Line"><a href="http://www.nfb.org/nfb/Resources.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_Resources.gif" alt="Resources" width="117"
> height="38" border="0"></a><img
> src="/images/nfb/Template/NFBHome_MeniDivider.gif" width="1" height="38"
> alt="Line"><a href="
> http://www.nfb.org/nfb/Products_and_Technology.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_Products.gif" alt="Products and
> Technology" width="114" height="38" border="0"></a><img
> src="/images/nfb/Template/NFBHome_MeniDivider.gif" width="1" height="38"
> alt="Line"><a href="
> http://www.nfb.org/nfb/Publications.asp?SnID=1950147763"><img
> src="/images/nfb/Template/NFBHome_Publications.gif" alt="Publications"
> width="127" height="38" border="0"></a></div>
>
> American Council of the Blind nav:
> <p><font size="-2">
> [<A HREF="index.html">ACB Home</A> |
>
> <A HREF="profile.html">About ACB</A> |
> <A HREF="washington/index.html">Washington Connection</A> |
> <A HREF="magazine/index.html">Braille Forum</A> |
> <A HREF="
> http://acb.org/store/index.php?option=com_content&;view=article&id=11&Itemid=14">Donate
> to ACB</A> |
> <br>
> <A HREF="affiliates/index.html">Affiliates</A> |
> <A HREF="resources/index.html">Helpful Resources</A> |
>
> <a href="conference/index.html">Conference and Convention</a> |
> <a href="http://acb.org/store/index.html">ACB Store</a> ]
> </font></p>
>
> Worth noting that AFB and RNIB both use lists widely.
>
> On Zeldman.com, there are items that seem like lists, but are not marked up
> as such:
> e.g. "Filed under: A Book Apart, A List Apart, content, content strategy,
> Design, E-Books, editorial, Education, wordpress"
>
> Same thing on the Yahoo! Accessibility blog:
> "Tags: assistive technology, Closed Captions, Deaf, hard of hearing, sean
> zdenek, Television"
>
> My gut is that we are calling things lists when the design aspects of web
> development work make it easy to do so, and that the connection to what
> users need is not clearly identified. I'd really like to see a description
> of what content types belong in lists and to what level of complexity an
> author should pursue in achieving that goal. Until we have that, when I see
> a set of links that are marked up inline within a simple paragraph I can't
> justify calling it a 1.3.1 failure.
>
> Thanks,
> AWK
>
> Andrew Kirkpatrick
> Group Product Manager, Accessibility
> Adobe Systems
>
> <EMAIL REMOVED>
> http://twitter.com/awkawk
> http://blogs.adobe.com/accessibility
>
>
> -----Original Message-----
> From: <EMAIL REMOVED> [mailto:
> <EMAIL REMOVED> ] On Behalf Of Jason Kiss
> Sent: Monday, April 11, 2011 6:14 AM
> To: <EMAIL REMOVED>
> Subject: Re: [WebAIM] evaluating accessibility with WCAG 2.0 (Angela
> French)
>
> Thanks for rekindling the discussion, John. Agreed: it is an interesting
> topic.
>
> Success Criterion 1.3.1 does not seem to offer an absolute conclusion
> either way with regard to a group of links displayed horizontally and
> separated by the pipe character, even if we all seem to be in agreement that
> best practice would have it marked up as an unordered list. I meant to
> suggest in my earlier comments that, should one want to take a strict
> approach in terms of enforcing best practice and semantic HTML, that it
> could be considered a WCAG violation. In the end, however, the application
> of the Success Criterion, at least in this scenario, is certainly open to
> interpretation.
>
> This is what I find most interesting about the discussion. While WCAG
> 2.0 has done much to provide more strongly testable guidelines, thereby
> resulting in more decisive declarations of what does or does not comply,
> there still remains room for argument and interpretation, particularly with
> certain Success Criteria like 1.3.1. I'm not suggesting this is necessarily
> a bad thing.
>
> For argument's sake, let's assume that the main navigation is a group of
> links visually presented in typical fashion as a distinct and horizontally
> arranged grouping, with each link separated by a pipe. Is it reasonable to
> suggest that this arrangement visually *implies* that the structure of the
> overall grouping and the relationships among the links are those of a list?
> Certainly, such a visual arrangement is not the traditional presentation of
> a vertical list of bulleted list items, but does a sighted user conceptually
> understand this arrangement as a set or list of individual but related
> links? What are the reasons for displaying them as a distinct group and of
> separating each link with a pipe?
>
> John correctly notes that a list of links so presented and marked up is
> hardly an egregious accessibility barrier. Still, declaring such less than
> ideal markup as a violation of WCAG, especially when more usable and
> semantically correct markup exists, can be a nice bit of leverage in certain
> contexts, at least in terms of requiring best practices and accessible,
> semantic HTML.
>
> Is such an interpretation even reasonable, or am I just muddying the waters
> around the intent of Success Criterion 1.3.1 or of the application of WCAG
> Success Criteria in general?
>
> Jason
>
> On 11/04/11 20:26, John Hicks wrote:
> > Hello
> > I see from this exchange that my previous remark was perhaps too
> > severe and I buy the arguments given since.
> > Of course many screen readers do link listings also so the fact that
> > these links are not in an html list is not the end of the story
> >
> > Nevertheless, using an ascii character (the pipe symbol) for
> > formatting still irks me.
> >
> > If this "non-list" of links were vertical with a lower case "o" making
> > a bullet for each item .... which is basically the same thing, I bet
> > the reactions would be different.
> >
> > In any event it would read like a romantic poem (O! site map, O!
> > Contact, O! Terms of Use...)
> >
> > Interesting topic
> >
> > best wishes,
> > John
> >
> >
> > e 09/04/2011 01:29, Angela French a écrit :
> >> Agreed.
> >>
> >> -----Original Message-----
> >> From: <EMAIL REMOVED>
> >> [mailto: <EMAIL REMOVED> ] On Behalf Of Keith
> >> (mteye)
> >> Sent: Friday, April 08, 2011 4:27 PM
> >> To: WebAIM Discussion List
> >> Subject: Re: [WebAIM] evaluating accessibility with WCAG 2.0 (Angela
> >> French)
> >>
> >> It may be that a self trained html coder isn't aware of the method to
> create horizontal lists, rather than a vertical list (default behavior for
> browsers.) There's no excuse for someone claiming to be a professional web
> designer.
> >>
> >> Just a personal observation, and opinion.
> >>
> >> from
> >> Keith H
> >>
> >> -----Original Message-----
> >> From: Karen Sorensen
> >> Sent: Friday, April 08, 2011 1:29 PM
> >> To: <EMAIL REMOVED>
> >> Subject: Re: [WebAIM] evaluating accessibility with WCAG 2.0 (Angela
> >> French)
> >>
> >> Good reminder John Hicks. The separation of content from
> design/layout/format with CSS is critical. If the pipes are used to separate
> a list, but the list isn't HTML coded as a list, that would be interpreted
> incorrectly by a screen reader.
> >>
> >> Karen Sorensen
> >> PCC Instructional Technology Specialist Coordinating ADA Compliance
> >> of Instructional Media
> >> 971-722-4720
> >>