Welcome to WebmasterWorld Guest from

Message Too Old, No Replies

CSS drop down menus

Would a CSS-driven menu that uses visibility:hidden cause a penalty?



9:54 pm on Nov 24, 2005 (gmt 0)

10+ Year Member

I am thinking of implementing a drop down menu using CSS not javascript, to make it more crawlable. This seems to involve setting visibility properties to 'hidden' and then 'un-hiding' them systematically as people hover over links.

Is there any risk that this could be mis-construed as deceptive and a penalty tripped?

Anyone got any experiences to share?


7:51 am on Nov 25, 2005 (gmt 0)

10+ Year Member



8:14 am on Nov 25, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member


we have recently changed from javascript menu to css menu. we noticed no difference, if anything it seems to have helped our rankings.

don't be too paranoid is my advice ;)


10:52 am on Nov 25, 2005 (gmt 0)

10+ Year Member

I know Jamie - I guess I am a bit paranoid. But, when you're ranking really well, sometimes you're afraid to change anything in case you break it!

The reason for improved rankings I think is clear: all the links are totally indexable. And, I think google frowns on anything but plain html links. That's logical. Why serve up pages that might not work for users? There's a lot of 'hobbyist' standard javascript out there.


10:55 am on Nov 25, 2005 (gmt 0)

10+ Year Member

As long as your links inside any javascript / css menu are not href links... its fine.

But if the links are generated in javascript... its not ok.

Hope this makes sense.


12:47 pm on Nov 25, 2005 (gmt 0)

10+ Year Member

We to have just implemented a css drop down and everything is fine.

The rule of thumb for CSS and javascript is one must only use it to specify styles and not to generate more html source.
This will get you banned.

Hope that calms any fears,

have a good weekend



1:32 pm on Nov 25, 2005 (gmt 0)

10+ Year Member

The way I understand it, most CSS drop downs simple use visibility parameter to hide / un hide links which clearly exists in the html source. The unhiding is done when a visitor points the mouse over the top level item.

According to suggestions so far, this is OK, as the links are all right there in the HTML source on the page, it's just you can't see them all at once?

I didn't know whether google would think we were trying to show links to it that we were hiding from our visitors?

Thanks everyone for your advice so far...


8:19 pm on Nov 25, 2005 (gmt 0)

10+ Year Member

I love using javascript document.write for adding more HTML and sites where I do it rank perfectly. I hide headers, menus and framesets this way, and no penalty occures.

But I remember to show Googlebot the same text content I show to my users, no client-side cloaking at all.


12:57 pm on Nov 28, 2005 (gmt 0)

10+ Year Member

Try to use "display: none" rather than "visibility:hidden"... depending on what you want to achieve though :-)

Visibility - "This property controls whether the content of an element box is rendered (including the borders and backgrounds.) If an element box is invisible it still affects document layout as if it were visible (to prevent an element box from affecting layout, the 'display' property should be set to 'none'.)"