Using CSS to replace H1 text with graphics... too risky?

Not trying to be sneaky, but I was thinking about replacing the H1 header text with graphics to look pretty for a site design I'm doing using css.

It will be the only hidden text on the page, and the words in the graphic are essentially the same as what's in the h1 (which is pretty much the same as the title).

The technique involves a class loading the image as a background for the h1 tag, and then a span with with a class that hides the text.

Any thoughts as to whether this might be risky from a penalisation point of view.

Cheers,

Ben

 

I wouldn't do it, just not ethical. Make a sacrafice and use the text.

 

If it's for pure design reasons and the text is exactly the graphical text I disagree it's not unethical and I don't think it will get penalized, it may get flagged but hey it's not misleading it's available it's possible it's for visual enhancement.

I work under the premise as long as it's an exact replica of elements human visible / readable and is used to make life easier for inherintly stupid computers it's legit.

As a halfway house can't you just load the graphic as background and condition the text with css to fit?
M

PS By the way if it where unethical the whole H manipulation with css would be as it distorts the standard of H tags which is to stand out.

 

Interested in why people think this is unethical..... I think it is perfectly ethical.

My intention is not to deceive anyone, it's to give the client what they want (a pretty graphical website for a health massage service) while still maintaining accessibility (important in health services i think) and SEO. Each page has good, compliant (I hope) xhtml and a good structure.

Isn't this what css was designed to be used for?

I am separating content from presentation, and anyone using a text browser (and spiders) will be able to see all of the content on the site without having to deduce that the image is meant to be a header, because they won't see the image.

Not taking offense at all and not meaning to give any. I would welcome some healthy debate on the matter.

Cheers,

Ben

 

To be honest this will always be a problem.

I got fed up with the crap about whether or not is was ethical and wrote my text the way I wanted and if it was an H1 it was an H1 etc.

After that I then used css to size and make the site prettier [in my eyes] until one day I used one of those crap machines out there operating some crap system called windows and saw that even css was not doing what I wanted.

Ok so it was back to basics and use html sizing as well!

No problem!!

Now you work that one out - spam or not?

In my view not

 

I've used css to make my <h1> tag with a font-size:18px, so it will fit better to the layout, do you think SE still catch it as header tag?

 

I would do something more like that :

<h1><img src="..." alt="Alternate text" /></h1>

It has the same effect as "css to replace h1 text with graphics"

 

Yep. Love that 'alt' tag.

 

I don't think its unethical. But I don't think you should do it. If you look on the "keyword stuffing" you will see hiding keywords with css is a well known technique to the search engines. Rather use the alt tag with img.

 

Yes they will.

 

Hi Ben (not sure if you're still here or not),

Please allow me to apologize for the others' thread necromancy and my replies to their questions/comments (while I'm at it, I'll answer yours as well). In fact, let me answer your question right now so I can get that out of the way. If you're using a technique like the Gilder/Levin method illustrated here, you won't have to worry about the search engines considering this to be hidden spammy text since it's a legitimate image substitution technique (substituting plain text with images for those who can see them, while ensuring that everyone else who can't see the image can still see the plain text regardless of whether CSS is enabled/supported or not). I'm sure this was just as true back in 2004 as it is today.

Yes, because CSS does not alter the semantics of an element, only its appearance in the browser window.

While this is valid, it's not appropriate since images are not headings. A heading is a section header (akin to an article title and subheadings in a newspaper article or term paper). Images are a different type of content and should thus be used appropriately.

I'm sure you mean attribute. There is no "alt" tag, never has been and probably never will be.

Again, as I've said before, it's perfectly fine to use, as long as it's done so properly. Like I said on another thread tonight, if the content matches what's in the image, you'll be fine (since you're merely substituting one delivery method for another while ensuring it's still accessible to everyone). If you use it to spam the search engines (sending them content that your visitors will never see) then you'll have the problem the keyword stuffers are having.

 

i totally agree with that.. hiding text is unethical .. no matter what