WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: FW: CSS and 508 Challenge

for

From: Langum, Michael J
Date: Aug 24, 2010 1:33PM

Jared,

Your suggestion re: using <br> tags would be great IF we didn't also have a requirement to alter the default <dl> layout, -- using CSS float attributes to lay each <dt> and <dd> next to each other horizontally. This whole page began life as a <table> with columns for "form number," "form name," etc.

I'm assuming that I'll have to give up the <dl> structure, and go to a <ul> with floating <div>s within each <li> that correspond to the original <dt> and <dd> tags. I've heard of CSS "display:table" (and similar) attributes.

Does anyone have an opinion on that approach?
-- Mike


-----Original Message-----
From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ] On Behalf Of Jared Smith
Sent: Tuesday, August 24, 2010 3:02 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] FW: CSS and 508 Challenge


On Tue, Aug 24, 2010 at 12:45 PM, Langum, Michael J wrote:

> My question arose because I am trying to ensure that the message
> spoken when a JAWS user lists only links, will be equivalent to the
> text displayed in the full HTML.

I see. There is some complexity when the additional information is already presented to the user visually, but not within the link text. As noted, the title attribute won't do anything in this case (except for provide a tooltip with redundant information for some sighted mouse users). And if it did, it would be very repetitive for the screen reader user listening to the page (as opposed to navigating by links). This also makes the hidden text approach I suggested less than optimal, though better than nothing, I suppose.

I think a much simpler approach solves the problem for everyone without the overhead of hidden styles, title attributes, and (I think
incorrect) use of definition lists - <a href="form.pdf">OPM 71, Request for leave or Approved Absence (Fillable PDF, 59KB)</a>. Putting a <br> after "OPM 71" and even styling the remaining text to be indented would give a very similar visual presentation.

Jared