WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: media types; css

for

From: Keith Parks
Date: Apr 23, 2009 2:40PM

On Apr 23, 2009, at 12:08 PM, pixels 256 wrote:

> Sorry for the confusion. Both "Hello1" and "Hello2" refer to the
> company
> name.
>
> linewave.gif is a graphic file for the web that shows a jumbled
> graphic of
> the company name; it looks aesthetically pleasing and is meant for
> only
> those with "normal" web browsers. I want the webpage to look as
> clean as
> possible, so I don't want any visitor to see both linewave.gif and the
> company name ("Hello").
>
> blank.gif is a "place-holder" for the company name ("Hello"); it is
> transparent. I used it so visitors with a screenreader or Lynx will
> be able
> to "see" the name of the company ("Hello").
>
> When the page is printed, I only want "Hello" (i.e. "Hello2") to
> print but
> not the linewave.gif.

So with that clarification, then Yes, your code as originally posted
seems to me like it should do what you want. The majority of screen
readers will not "speak" content designated as display:none.

Although, depending on what other css you are specifying for those
IDs, you may not need to wrap your elements in the DIVs. You could
just have ...

<img id="logo" src="graphics/blank.gif" height="72px" alt="company
name" />

<h1 id="title">company name</h1>

ALSO, if the text version of your company name is wrapped in an H1
tag, then the image version also should be, to keep the content
structure consistent.

Having said that, it also seems like overkill to me. I assume you have
your reasons, but...

1 - I don't see a need to have your company logo as a background
image, unless you are trying to make it more difficult for someone to
download the graphic.

2 - It's hard to picture the reason for not wanting the logo to print,
but to have text instead.

So IMHO you're setting up overly complex code to solve a nonexistent
problem. Just have the logo graphic on the page as a normal inline
image, with a proper ALT value. This would also avoid the potential
problem of someone viewing the page with css OFF, and who, under your
original scenario, would see both the graphic and the text. And having
the content be readable in a normal way with css OFF is one of the
standards we set for it being accessible, here in the CSU.

-Keith

******************************
Keith Parks
Graphic Designer/Web Designer
Student Affairs Communications Services
San Diego State University
San Diego, CA 92182-7444
(619) 594-1046
mailto: <EMAIL REMOVED>
http://www.sa.sdsu.edu/communications

http://kparks.deviantart.com/gallery
----------------------------------------------------------

Proud member of D/d.U.T.R.T.W.O.C.H.S.
(Designers/developers United To Rid The Web Of "Click Here" Syndrome)