I operate a web site that is very well indexed by Google. We hit all our keyword targets pretty much and rank really well. We have Google sitelinks etc.

For the last couple of years I've been using sifr/cufon text replacement for our navigation bar links (so text is beautified to some font).

This hasn't impacted our sitelinks, in fact they "appeared" shortly after I started using Cufon, but this is more down to the age of the site, frequency of content updates etc. I'm sure.

My concern is, we have a new design going live soon that does away with text navigation links (home, about us, news etc.) and replaces them with rollover images.

This isn't really optional due to the way to design has been put together - I simply have to use these image rollovers.

My primary concern is, if I do this, I risk losing my sitelinks because Google might have issues crawling the navigation links/buttons as they are images.

I've spent a lot of time reading up on SEO impact on switching to using images instead of text links for site navigation and there are a lot of conflicting articles/views on it.

  1. ALT tags: Some of the articles I have read state that simply using an Alt tag on my rollover navigation images (e.g. the Home Page text link which is listed as a sitelink on our Google listing, would become and image with an alt tag of "Home Page" thus hopefully preserving the Google sitelink as "Home Page"?)

  2. TITLE tags: Some articles state using a combination of Alt and Title tags (set up as point 1).

  3. Text-indent: Some articles suggest using both of the above and "hide" a text link of the button underneath it...

In addition to this, some sites have thrown doubt on the best method to use to implement the rollovers.

  1. IMG tag with CSS styling.
  2. CSS Sprites: Some say to use them with Alt/title some say to use IMG tag only.

So my question is, what is the safest combination of the above to go for in order for me to preserve our sitelinks on Google and indeed allow other search engines to crawl the rollover images without issue?

I appreciate it is best to use text but as I say, I really need to use these graphics instead.

If someone could help me with this (preferably someone with direct experience with this, rather than assumptions and guesses) I'd really appreciate it.

2 Answers 2


If you leave text links (for spiders and people who have scripts disabled and will therefore never enjoy the rollover effect) and run an unobtrusive Javascript to replace the plain-looking text with rollover elements you won't have to consider this potential disadvantage.

  • would not this be cloaking? as defined by google, showing bot and user different content? It is the best option out of 3 though. +1
    – user11237
    Jul 20, 2012 at 13:58
  • @SandroDzneladze Cloaking typically refers to changing the document presented to search engines - in this case, both the search engines and the users download the same document - client-side Javascript transforms the document after it is downloaded.
    – danlefree
    Jul 20, 2012 at 14:13

well it seems you did the research, so you should understand that there is no consensus. Nobody can tell you this is the right way, or this is not... for some people certain strategy worked, and for some not. I don't think anyone has done a conclusive research on this issue.

I personally think this is so minor it will not affect anything. I've personal preference for text-indent solution.

And as a side-note, rollover images in a navigation are ubiquitous, I think google algorithm is clever enough to not penalize them.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.