homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

CSS: Best practices for using it to help SEO?
Switching from JS navigation to CSS

5+ Year Member

Msg#: 3829482 posted 1:30 pm on Jan 19, 2009 (gmt 0)

My company is in the process of switching from a javascript navigation to a CSS navigation, which I understand should be better for SEO. However, I don't know much about CSS. I've read that it's helpful for SEO since it allows you to move important content to the top of the HTML file and it decreases the code to content ratio.

Are there any CSS best practices that will help our SEO and maximize natural search positions for our important keywords?

Any advice would be greatly appreciated.

Thank you!



10+ Year Member

Msg#: 3829482 posted 2:22 pm on Jan 19, 2009 (gmt 0)

Correctly done JS menus will not hamper SE's from indexing the pages. There are some very good ones and equally there are some very bad ones.

I would personally never use a JS menu for various reasons but mainly because I start limiting the amount of people who can access my sites.

Probably the easiest way of making a menu is to use an list-item. I say this becuase if you search for CSS menu templates most are created this way. I always use a list-item method because I find it easy to style and simple to configure.

There are no bad practices that I can think of. As long as the code is this kind of simple you'll have no problems:

<li><a href="link.html">Link</a></li>
<li><a href="link.html">Link</a></li>
<li><a href="link.html">Link</a></li>


WebmasterWorld Senior Member korkus2000 us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 3829482 posted 2:44 pm on Jan 19, 2009 (gmt 0)

What about class names and ID names for styling. Are those picked up by any robots? Best practices for CSS is to make the name descriptive of what the item contains. Navigation many times on a large site is dynamic and trying to make any sort of keyword rich selectors is not as helpful from a coding stand point.

For navigational elements or nested elements, like unordered lists, it is common to style the tag and not use a custom selector.

.mainPage .mainNavigation ul{width:300px;}
.mainPage .mainNavigation li{float:left;display:inline;list-style:none;}

instead of


Have people found that using named classes or ids help with rankings or help with disability programs like Jaws? What do people think about always using classes and ids and not using tag selectors?


10+ Year Member

Msg#: 3829482 posted 3:16 pm on Jan 19, 2009 (gmt 0)

The ID and class names won't make a single bit of difference to your rankings.

How you code it depends on personal preference really. I tend to flip between:

<ul class="blah">


<div class="blah">

I try to keep the LI's clear of ID's or classes because I sometimes need to style the first/last LI differently from the others. I might also need an active class for the active page. In all these cases keeping the LI's clear make it easier for me to see clearly what's going on.

As I say though, it really is personal taste.


10+ Year Member

Msg#: 3829482 posted 3:23 pm on Jan 19, 2009 (gmt 0)

In my cases I would style both as:

ul.blah {}
.blah li {}

or for the latter:

.blah ul {}
.blah li {}

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved