WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: evaluating accessibility with WCAG 2.0 (Angela French)

for

From: Accessibility India
Date: Apr 11, 2011 11:36AM


Awesome discussion. I'd like to know how screen reader users
experience the <p> tag. Is it transparent? Does it have semantic
meaning? Do you expect
a certain content when you encounter one? I am a sighted user. But
to me, harkening back to early days of elementary school grammar, a
paragraph is a
distinct portion of writing that contains a particular thought or
idea, and consists of at least one sentence, usually more. If a <p>
tag has that same
meaning to a screen reader user, wouldn't a bunch of hyperlinked words
separated by a pipe be a nonsense sentence?

For a screen reader such as JAWS a blank line is encountered before
and after the paragraph i.e <p>. Alternately by using the short-cut
"p" with JAWS you can jump from one para to another. With NVDA you
cannot find much different with <p> tag. I tried using the short-cut
"p" on webpage with NVDA but cannot find any any paragraphs.
So if the user wants to jump from one paragraph to another they can
use short-cut p. Its not possible <p> tag is used. I recommend to use
scemantic HTML.
-----Original Message-----
From:
<EMAIL REMOVED>
[mailto: <EMAIL REMOVED> ]
On Behalf Of Andrew Kirkpatrick
Sent: Monday, April 11, 2011 5:31 AM
To: WebAIM Discussion List
Subject: [UCE] Re: [WebAIM] evaluating accessibility with WCAG 2.0
(Angela French)
Importance: Low

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:
block quote
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 :
block quote
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