CSS and SEO Question

I am currently building a webiste for a client whereby I am using CSS for the menu (not javascript). For the rollovers, have a background image that contains the regular state and the rollover.

an example code is: <a id="foo" href="bar.php" ><span>BAR</span></a>

I hide the <span> and use the background image instead.

My Question Is:

Is this form of navigation good for SEO? Is hiding the <span> seen as spam by the search engines. Will search engines even pick up this form of menu??

Please Help

13.10.2009 17:49:04
I don't think it would be a problem...
halocursed 13.10.2009 17:54:32

Many/most/(all?) search engines will not understand CSS to the degree that they know you're hiding the <span>. For those, you're fine.

For any that are bright enough to understand your CSS, they'll also understand the reasons why people do that, and will recognise what you're doing. So for those you're fine too.

Many questions like this one boil down to "Are search engines just clever enough to misunderstand what I'm doing?" And the answer is no, because it's not in their interests. As the author of a search engine, you wouldn't add support for noticing CSS-hiding without also adding reliable heuristics to tell the difference between its normal use and its abuse.

13.10.2009 18:02:11

You may use text-indent css property for your <li> or <a> element. This way you won't have to hide it via css. So you'd have something like this

  <li><a id="foobar">foobar</a></li>

Then you could have following css:

li a {
  display: block;
  text-indent: -1000px;
  width: 20px;
  height: 20px;
  background: transparent url('/image/path.png') no-repeat;
13.10.2009 18:02:32

If you are simply going to hide them using display: none; then you will want to check out the question Stack Overflow thinks is most related to yours: Google SEO and hidden elements.

Summary: Google ignores anything it can determine is invisible to humans.

23.05.2017 11:55:41