On 23 Feb 2006, at 11:19, Ian Anderson wrote:
Kevin Futter wrote:
Anyway, for the benefit of others interested in this thread/topic,
the
upshot from the above link seems to be that the pipe character (|)
is the
best compromise currently available as a screen reader-friendly
element
separator.
I profoundly disagree with that. The vertical bar is the worst
thing you can use in a breadcrumb trail, regardless of how it reads
in a screen reader. This is conventionally used on the web as a
separator for sibling links, and it really doesn't work as a
breadcrumb separator for sighted users.
I don't think a list is appropriate markup for breadcrumbs and
prefer the conventional "You are in: home > products > foo"
I like to implement my bread-crumbs as an UL and then stylistically
add the 'visual direction' indicator using an image.
For the benefit of Screen-readers and textmode browsers, I add a LI
with the text 'breadcrumb' at the top of the list which is then
hidden using CSS. It's not a perfect solution but it works.
<ul>
<li class="first">Breadcrumb: </>
<li><a>Menu Item 1</></>
<li><a>Menu Item 2</></>
<li><a>Menu Item 3</></>
</>
ul li{
background:url(directional sliding doors graphic);
}
ul li.first{
background:url(terminating graphic);
text-indent:9000;
overflow:hidden.
}
you can see it at work at:
http://www.minimology.co.uk/gallery/www/
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
