WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: evaluating accessibility with WCAG 2.0 (Angela French)

for

From: E.J. Zufelt
Date: May 16, 2011 12:51AM


Good afternoon,

IMO * Everything * that is a list should be marked up as a list, be there 1, 2, 3, or more items, this is proper semantics. However, assistive technology vendors are completely free to present shorter lists without the added textual representation of the list semantics.

HTH,
Everett Zufelt
http://zufelt.ca

Follow me on Twitter
http://twitter.com/ezufelt

View my LinkedIn Profile
http://www.linkedin.com/in/ezufelt



On 2011-05-16, at 2:42 AM, < <EMAIL REMOVED> > wrote:

> As a screen reader I don't like the idea of extra keyboard commands as it
> slows down the process. We could always go back to the standard rule in
> English grammar regarding uses of commas in that anything less than three
> items does not require the use of a comma. Perhaps this could be carried
> over to lists.
> Chuck
> ----- Original Message -----
> From: "Jason Kiss" < <EMAIL REMOVED> >
> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
> Sent: Monday, April 11, 2011 4:46 PM
> Subject: Re: [WebAIM] evaluating accessibility with WCAG 2.0 (Angela French)
>
>
> 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
>>
>>
>>