RE: 4.13.1 Bread crumb navigation - use of right angle brackets

Gez Lemon wrote:
"I don't agree the > character should be used to separate the links (or any other type of punctuation), because it's just more gibberish for screen reader users (I understand some people think "greater than" in this context has some meaning, but that's some leap of logic)."

The default punctuation setting for most screen readers means that the > character is announced, and you're absolutely right that it's meaningless gibberish. For those people who turn down the level of punctuation that's announced, it results in a peculiarly silent spot where the screen reader pauses to acknowledge the presence of the > character but doesn't actually announce it. That's equally disconcerting.

" Realistically, the > is just decoration, so should be provided with CSS."

Agreed. I'd even suggest that there is little to compel anyone to use the > character at all, except perhaps for convention. It's a style choice at this point of course.

"The examples provided should meet WCAG, so I suggest the following (using an unordered list, but an ordered list would be fine in this
context):

<nav aria-label="You are here">
<ul>
  <li><a href="/">Main</a></li>
  <li><a href="/products/">Products</a></li>
  <li><a href="/products/dishwashers/">Dishwashers</a></li>
  <li>Second hand</li>
</ul>
</nav>"

Think this is a good example. One note of caution about using an ordered list instead, is that there's a temptation to set the list style to none. When this happens (on any type of list) some screen readers stop announcing the bullet before the content of the <li>. So to all intents and purposes a screen reader treats an ordered and unordered list with  style type set to none in exactly the same way.

Léonie.
-- 
Léonie.
Léonie Watson

E. tink@tink.co.uk
T. @LeonieWatson
S. Leonie.Watson
W. tink.co.uk


-----Original Message-----
From: gez.lemon@gmail.com [mailto:gez.lemon@gmail.com] On Behalf Of Gez Lemon
Sent: 27 January 2013 15:28
To: public-html@w3.org
Cc: steve.faulkner@gmail.com; Silvia Pfeiffer
Subject: Re: 4.13.1 Bread crumb navigation - use of right angle brackets

I like the idea of using aria-label to provide the "You are here"
context if it isn't included in the structure.

I don't agree the > character should be used to separate the links (or any other type of punctuation), because it's just more gibberish for screen reader users (I understand some people think "greater than" in this context has some meaning, but that's some leap of logic).
Realistically, the > is just decoration, so should be provided with CSS.

The links in the breadcrumb are a collection of links, so should be marked up as a list to adhere with WCAG 2.0 1.3.1: Info and relationships [1] (see the following WCAG 2.0 technique for making information and relationships conveyed through presentation programmatically determinable: H48: Using ol, ul and dl for lists or groups of links [2]).

The examples provided should meet WCAG, so I suggest the following (using an unordered list, but an ordered list would be fine in this
context):

<nav aria-label="You are here">
<ul>
  <li><a href="/">Main</a></li>
  <li><a href="/products/">Products</a></li>
  <li><a href="/products/dishwashers/">Dishwashers</a></li>
  <li>Second hand</li>
</ul>
</nav>

Regards,

Gez


[1] http://www.w3.org/TR/WCAG20/#content-structure-separation-programmatic
[2] http://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/H48


On 27 January 2013 08:48, Steve Faulkner <faulkner.steve@gmail.com> wrote:
> Hi Silvia,
>
>>> I found no indication of accessibility users complaining about breadcrumbs.
>> Do you have any indications of such problems?
>
> right thats why I was asking :-)
>
> Upon looking into the issue further what I did find was that providing  
> a label providing context is accessible best practice [1]
>
>
> Suggest the current advice/examples be augmented to include a text cue 
> such as "You are here" at the start of the trail.
>
>
> <nav>
>  <p> You are here:
> <a href="/">Main</a> >
> <a href="/products/">Products</a> >
> <a href="/products/dishwashers/">Dishwashers</a> > <a>Second hand</a> 
> </p> </nav>
>
>
> This may be visible (example [2]) or hidden offscreen but available to 
> screen reader user (example:[1]) it could also be added using an 
> aria-label attribute on the nav element.
>
> <nav aria-label="You are here">
>  <p>
> <a href="/">Main</a> >
> <a href="/products/">Products</a> >
> <a href="/products/dishwashers/">Dishwashers</a> > <a>Second hand</a> 
> </p> </nav>
>
> regards
> SteveF
>
>
> [1] http://webaim.org/articles/siteredesign/#decisions
> [2]  http://juicystudio.com/services.php
>
>
>
> On 26 January 2013 22:26, Silvia Pfeiffer <silviapfeiffer1@gmail.com> wrote:
>> The greater sign is a typical breadcrumb sign used on many sites as a 
>> hierarchy indicator, see also
>> http://en.wikipedia.org/wiki/Breadcrumb_%28navigation%29 . Having it 
>> announced as "greater" seems appropriate. I found other examples here:
>> http://www.hongkiat.com/blog/breadcrumb-navigation-examined-best-prac
>> tices-examples/ . Most of the time something arrow-like is being 
>> used.
>>
>> I found no indication of accessibility users complaining about breadcrumbs.
>> Do you have any indications of such problems? What alternative symbol 
>> would you suggest?
>>
>> Regards,
>> Silvia.
>>
>>
>> On Sun, Jan 27, 2013 at 4:00 AM, Steve Faulkner 
>> <faulkner.steve@gmail.com>
>> wrote:
>>>
>>> Section 4.13.1 Bread crumb navigation (under Common idioms without 
>>> dedicated elements [1])
>>>
>>>  encourages the use of the right angle bracket to indicate a 
>>> breadcrumb navigation trail:
>>>
>>> <p>
>>>   <a href="/">Main</a> >
>>>   <a href="/products/">Products</a> >
>>>   <a href="/products/dishwashers/">Dishwashers</a> >
>>>   <a>Second hand</a>
>>>  </p>
>>>
>>> The use of > in this context does not appear to be a good practice 
>>> to promote as the angle bracket is a symbol that depending on user 
>>> agent (AT in this case) is typically announced as "greater" or not 
>>> announced in this context. Either way it is not clearly convyed that 
>>> its a breadcrumb trail.
>>>
>>>
>>>  It may be that this is not an issue for users who consume the angle 
>>> brackets in this context and the pattern of its use conveys that it 
>>> is a breadcrumb trail. If it is a problem I suggest that this 
>>> example would need to be revisited to see if we can come up with 
>>> something that is more useful to a wider range of users.
>>>
>>> [1]
>>> http://www.w3.org/html/wg/drafts/html/master/common-idioms.html#comm
>>> on-idioms
>>>
>>> --
>>> with regards
>>>
>>> Steve Faulkner
>>>
>>
>



--
_____________________________
Supplement your vitamins
http://juicystudio.com
http://twitter.com/gezlemon

Received on Sunday, 27 January 2013 16:14:54 UTC