WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using CSS to hide a portion of the link text

for

From: Dan Conley
Date: Aug 3, 2009 7:40AM


Couldn't you give a span {display:none} (or display inline if that's
what you'd prefer) in a print stylesheet? What would you say 'do[ing] it
right the first time' is? Here's what the TOC on one of my sites looks like:

Activities of Daily Living (PDF)
Adult Education and Intellectual and Allied Developmental Disabilities (PDF)
Amnesia (PDF)
Aphasia (PDF)

The titles are for html, the PDF links to the PDF version. I hadn't
thought of a way of differentiating the PDF links until now, but this
seems like a decent way to do it. The only issue I can see is that with
stylesheets disabled, the link text will be overly long (especially for
AEIADD above).

Dan Conley

Geof Collis wrote:
> These ideas sound good in principle but what happens if someone wants
> to print off the page and take it to a presentation where the link
> url is necessary. Sure you could write more code to do this but why
> not just do it right the first time instead of doing all of this
> extra coding just because you can?
>
> At 09:03 AM 8/3/2009, you wrote:
>> I have used hidden CSS to
>>
>> 1. Create distinct link text
>> 2. Provide a Header for navigation when there is no text on the
>> visual screen.
>> 3. Provide a Label for a form field when there is no text on the
>> visual screen.
>>
>>
>>
>> -----Original Message-----
>> From: <EMAIL REMOVED>
>> [mailto: <EMAIL REMOVED> ] On Behalf Of Dan Conley
>> Sent: Monday, August 03, 2009 8:58 AM
>> To: WebAIM Discussion List
>> Subject: Re: [WebAIM] Using CSS to hide a portion of the link text
>>
>> Well, if the text is auto generated it would always be kept up to date,
>> wouldn't it? I think I might switch some of my table of contents code to
>> use this, as there are quite a lot of (PDF) links after the titles, and
>> I could add in <span>$title</span> easily enough.
>>
>> Also, the W3C example uses dl/dd. Isn't that a poor use of the field,
>> since you're not giving a definition?
>>
>> Dan Conley
>>
>> Simius Puer wrote:
>>> Agreed - the method described by by the W3C is technically solid.
>>>
>>> The only potential pitfall (as they point out themselves) is an editorial
>>> one, ensuring that the hidden text is not overly verbose. I'd also add
>>> emphasis on ensuring it is 'accurate' and 'kept up-to-date' as these are
>>> easily missed unless the site editors are trained to check these
>> (or if your
>>> CMS enforces some manual checking).
>>>
>>>
>>> Andrew Hart
>>>
>>>
>>> 2009/8/3 Evans, Donald (Contractor) < <EMAIL REMOVED> >
>>>
>>>> Almost any page that uses the same link text many times could make use of
>>>> hidden link text to describe them.
>>>>
>>>> Example: An ecommerce site that has a dozen products listed, each with a
>>>> link next to the product's picture that says, "Buy". Adding CSS
>> hidden text
>>>> to the Buy link makes each link distinct.
>>>>
>>>>
>>>>
>>>> -----Original Message-----
>>>> From: <EMAIL REMOVED> [mailto:
>>>> <EMAIL REMOVED> ] On Behalf Of Geof Collis
>>>> Sent: Monday, August 03, 2009 8:06 AM
>>>> To: WebAIM Discussion List
>>>> Subject: Re: [WebAIM] Using CSS to hide a portion of the link text
>>>>
>>>> Hi Everett
>>>>
>>>> As a screen reader user and an accessibility expert I'm of the
>>>> opinion from that page:
>>>> "Other screen reader users and accessibility experts don't recommend
>>>> this as a general technique because the results can be overly chatty
>>>> and constrain
>>>> "
>>>> however if you can show me an incident where this is used and serves
>>>> a real purpose other than talking my ear off then I might change my mind.
>>>>
>>>> cheers
>>>>
>>>> Geof
>>>>
>>>>
>>>>
>>>>
>>>>
>>>>
>>>> At 03:25 AM 8/3/2009, you wrote:
>>>>> Good morning,
>>>>>
>>>>> Trying to build support for more meaningful link text in Drupal 7. To
>>>>> this end I am investigating using CSS to hide a portion of link text.
>>>>> If anyone has strong, or medium, feelings about this method I'd love
>>>>> to hear them.
>>>>>
>>>>> Also, wondering if anyone can point to examples of sites that are
>>>>> using WCAG 2.0 technique C7 - Using CSS to hide a portion of the link
>>>>> text - http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/C7
>>>>>
>>>>> Thanks,
>>>>> Everett
>>>>>
>>>>> Follow me on Twitter
>>>>> http://twitter.com/ezufelt
>>>>>
>>>>> View my LinkedIn Profile
>>>>> http://www.linkedin.com/in/ezufelt
>>>>>
>>>>>
>>>>>
>>>>>