
July 4th, 2008, 10:42 AM
|
|
Registered User
|
|
Join Date: Jul 2008
Posts: 9
Time spent in forums: 2 h 5 m 16 sec
Reputation Power: 0
|
|
|
Image replacement for search engines?
Here's a nice little idea you can do in the never ending balance between attractive presentation and SEO. It involves CSS image replacement. In according with handicap accessibility rules for css/xhtml, there are many methods to replace an image with text if the images are disabled. This way, a blind person will hear the text for the image through their screenreader and not have to bother download the image.
You might say that there's no real difference between this and an alt tag, and that this was one of the original uses for the alt tag. True, but which would you want the search engines to read, an alt tag, or a first level header? We all know that search engines rightfully so give huge weight to the <H1> tag.
So what you can do is to replace the image with <H1> text, while the regular users still see your image and not the text and the search engines DON'T see the image, and instead see the <H1> text.
So on one site I've done, the first thing the viewer sees is a big masthead image that deals with the branding and image of the site, but the first thing the search engines see is this big <H1> that can be anything you want, regardless of the viewer because they won't see it. So you get the best of both worlds. The user sees what they want and what looks good, while the search engines sees what it needs. I don't think have to tell anybody how effective it can be to feed the search engines a lot of <H1> content that your viewers will never see (except the blind listening to a screen reader), while still keeping your site exactly the way you want it to look for your viewers. Marketing gets what they want (look and feel), search engine gets what they want (content). And you get to manipulate that content as you see fit without having to worry about what the viewers will see
It's notable to say that there are many image replacement techniques out that actually hide the text by setting it's display property to none. This is perfectly acceptable to do image replacement in this manner because search engines will not penalize you for attempting an image replacement technique because it is not spam, it's a very legitimate accessibility issue (even though I'm using it to manipulate and spam the search engines). However, I should say that while the search engines do not penalize you for this, if they detect that it's display property is set to "none", it will merely ignore it, and the effort is for naught
However, there is one image replacement technique, the Gilder/Levin technique that is read by the search engines because it doesn't set the text's display property to none, but instead layers the image over top of the text. Therefore the user sees the image, but the search engine reads the text because it's property is set to be visible. So the search engine won't pay much attention to the image layered over top of it, and will pay a ton of attention to the text that's underneath. And when you prudently apply <H1> and <H2> tags to the text and maybe even a <strong> tag for extra emphasis as search engines pay attention to it, then your text is going to get a lot of attention.
Also, through CSS, you can style your <H1> and <H2> tags to be smaller font sizes like a mere 12px so that you can fit the text underneath the image, but the search engines don't care about the font size, they are looking at the <H1> tag and because of that alone, they assign high priority to what is in between that tag.
|