WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Delimiting links...characters or use a DL?

for

Number of posts in this thread: 4 (In chronological order)

From: Austin, Darrel
Date: Thu, Dec 16 2004 9:10AM
Subject: Delimiting links...characters or use a DL?
No previous message | Next message →

I'm giving our site a 6-month tune-up and revamping a lot of the CSS to trim
it down and polishing some accessibility issues here and there.

One of the items on our site is a toolbar of links across the top. Right
now, I'm simply separating the links via the '|' character.

I've been a fan of this approach, however:

http://www.baekdal.com/example.asp

which uses a lot of definition lists (turn of your styles or look at it in
Lynx). It's a great technique for accomodating text browsers, IMHO. The
question I have is whether or not one of the two above methods is preferred
over the other to accomodate screen readers.

Listening in JAWs, the former reads as 'link SEARCH vertical bar link
ACCESSIBILITY vertical bar, etc...'

While the latter, using a DL, reads a nice title (the DT, which is hidden to
visual browser) but then reads the actual links as 'equals link SEARCH
equals link ACCESSIBILITY , etc..'

To my ears, they both sound a bit awkward. Any thoughts? Does creating it as
a DL add any higher-level page navigability for screen readers (such as
being able to link directly to a definition term?)

-Darrel

From: julian.rickards@ndm.gov.on.ca
Date: Thu, Dec 16 2004 9:45AM
Subject: Re: Delimiting links...characters or use a DL?
← Previous message | Next message →

I'd have used just an unordered list, and used CSS to display it
horizontally. You can put your text in title attributes if necessary.
This satisfies the WCAG checkpoint and doesn't make the user listen to too
much text unless the user has verbosity turned up in JAWS.

From: Jukka K. Korpela
Date: Thu, Dec 16 2004 9:49AM
Subject: Re: Delimiting links...characters or use a DL?
← Previous message | Next message →

On Thu, 16 Dec 2004, darrel.austin wrote:

> One of the items on our site is a toolbar of links across the top. Right
> now, I'm simply separating the links via the '|' character.

That's probably feasible, since it's common practice. People are used to
hearing "vertical bar" or something like that, though it's odd when you
hear it for the first time.

As an alternative, you could use a small image (maybe "|" shaped) with
alt=", ".

> I've been a fan of this approach, however:
>
> http://www.baekdal.com/example.asp
>
> which uses a lot of definition lists

That's not adequate use of definition list. A menu does not define what
the term "Main Navigation" means. This has been discussed at length on
different fora, but the bottom line is: is just a tag soup HTML used
to achieve particular layout, except in the rare cases where you really
have a list of definitions (typically, a glossary). Using adequate markup
is part of WAI rules (violated by W3C itself, but I digress).

The most adequate markup for a list of links in current HTML is a
element with element inside each element. This is good for
accessibility too. If a checking tool complains (about lack of nonspace
characters between links), blame the tool.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

From: Austin, Darrel
Date: Thu, Dec 16 2004 10:26AM
Subject: Re: Delimiting links...characters or use a DL?
← Previous message | No next message

> As an alternative, you could use a small image (maybe "|" shaped) with
> alt=", ".

It's one of those back and forth things in my head.

Does one need to separate links these days with some sort of physical
delimiter for screen readers?

The bar is nice for text browsers.

The image is nice for screen readers.

The DL is nice for semantics.

I'm probably overthinking this. ;o)

> That's not adequate use of definition list. A menu does not define
> what the term "Main Navigation" means. This has been discussed at
> length on different fora, but the bottom line is: is just a tag
> soup HTML used to achieve particular layout, except in the rare cases
> where you really have a list of definitions (typically, a glossary).
> Using adequate markup is part of WAI rules (violated by W3C itself,
> but I digress).

I've seen both sides of this debate. DLs should only be used for defining
terms vs. DLs are quite flexible and server all sorts of useful purposes.
The W3C seems ambigious at best on this...as you indicate with it viloating
its own WAI. Ugh. ;o)

> The most adequate markup for a list of links in current HTML is a
> element with element inside each element. This is good for
> accessibility too. If a checking tool complains (about lack of
> nonspace characters between links), blame the tool.

Oh. Well, this would be the easiest solution anyways. Perhaps I'll stick
with that. It doesn't offer the nice 'header' label that the DL does in a
text browser, but if I feel it is that necessary, I could certainly just
slap an actual H* tag before it.

Hmm...I reread the W3C's suggestion and their recipe example (
http://www.w3.org/TR/REC-html40/struct/lists.html ) looks like yet another
option...a DL with a UL nested in the DD. Hmm...

-Darrel