Search Engine Watch
SEO News

Go Back   Search Engine Watch Forums > Search Engine Marketing Strategies > Search Engine Optimization > Dynamic Website and Technical Issues
FAQ Members List Calendar Forum Search Today's Posts Mark Forums Read

Reply
 
Thread Tools
Old 11-19-2004   #1
sew2002
Member
 
Join Date: Nov 2004
Posts: 58
sew2002 is on a distinguished road
Drop Down Menus - CSS DHTML vs. JS

I've heard that Java Scripts kill search engine crawlers, so I'm weary of using JS drop down menu scripts.

Does anyone know of (or actually use) a CSS-based drop down menu? Are CSS drop down menus search engine friendly?

Thanks in advance
sew2002 is offline   Reply With Quote
Old 11-19-2004   #2
orion
 
orion's Avatar
 
Join Date: Jun 2004
Posts: 1,044
orion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to behold
Exclamation

Quote:
Originally Posted by sew2002
I've heard that Java Scripts kill search engine crawlers, so I'm weary of using JS drop down menu scripts.

Does anyone know of (or actually use) a CSS-based drop down menu? Are CSS drop down menus search engine friendly?

Thanks in advance
CSS-based menus of all kind are preferred over scripted menus. Hand-coding the menus populated with links right after the body tag and then repositioning the menu to be displayed where you want them not only improves link relevance but facilitates the crawler finding right away the links. Most definitely coded in this way, CSS-based menus help to raise relevance.

For details, you may want to check
Mike Hall's site http://www.brainjar.com/
Eric Meyer's site http://www.ericmeyeroncss.com/
Andy King's site http://www.websiteoptimization.com/


Orion
orion is offline   Reply With Quote
Old 11-20-2004   #3
Anthony Parsons
Rubbing the shine of the knobs who think they're better than everyone else...
 
Join Date: Jun 2004
Location: Melbourne Australia
Posts: 478
Anthony Parsons will become famous soon enough
Here's another stroke of genius!

http://www.alistapart.com/articles/horizdropdowns/

Honestly, how can you go wrong, when your menu is coded like this:

Code:
 
<ul id="nav"> 
  <li><a href="#">Home</a></li> 
  <li><a href="#">About</a> 
	<ul> 
	  <li><a href="#">History</a></li> 
	  <li><a href="#">Team</a></li> 
	  <li><a href="#">Offices</a></li> 
	</ul> 
  </li> 
  <li><a href="#">Services</a> 
	<ul> 
	  <li><a href="#">Web Design</a></li> 
	  <li><a href="#">Internet Marketing</a></li> 
	  <li><a href="#">Hosting</a></li> 
	  <li><a href="#">Domain Names</a></li> 
	  <li><a href="#">Broadband</a></li> 
	</ul> 
  </li> 
  <li><a href="#">Contact Us</a> 
	<ul> 
	  <li><a href="#">United Kingdom</a></li> 
	  <li><a href="#">France</a></li> 
	  <li><a href="#">USA</a></li> 
	  <li><a href="#">Australia</a></li> 
	</ul> 
  </li> 
</ul>
And looks like this: http://www.alistapart.com/d/horizdro...orizontal2.htm

There is just no comparison IMO. CSS blows JS away when it comes to search friendly. People continually say, "but Google reads JS", well big deal! What about the rest? They don't. Always go with CSS over JS anyday, if available.
Anthony Parsons is offline   Reply With Quote
Old 11-20-2004   #4
sew2002
Member
 
Join Date: Nov 2004
Posts: 58
sew2002 is on a distinguished road
Thanks for the advice, that was exactly the type of information I was looking for.

So CSS is clearly better than JS. But how does CSS compare to regular menus? Better, worse, no difference?

Are there any special things I should watch out for while implementing the CSS as to avoid upseting the SE gods?

BTW Anthony, "33 & Retired" is my dream since I was 11.
sew2002 is offline   Reply With Quote
Old 11-20-2004   #5
seomike
M·d_Rewrite Guru
 
Join Date: Jun 2004
Location: Dallas, Texas but forever a Floridian!
Posts: 627
seomike is a splendid one to beholdseomike is a splendid one to beholdseomike is a splendid one to beholdseomike is a splendid one to beholdseomike is a splendid one to beholdseomike is a splendid one to beholdseomike is a splendid one to behold
Some drop downs like the ones generated by Fireworks just use java to build a css type drop down with divs and all. the only difference is java creates it dynamically and uses document.write to let the browser know but leaves no trace of it in the source code.

css drop downs use java to just change divs from visible to hidden. So basically your site is going to have

invisible div layers
transparent gifs (to trigger the visible / hidden functions)
link text inside divs with parameters that says hidden.

Even though that's old school spam techniques it only take one stupid spider to junk your site. Even though to you and I it's totally legit try telling that to a freaking algo...

Last edited by seomike : 11-20-2004 at 03:18 AM.
seomike is offline   Reply With Quote
Old 11-20-2004   #6
Anthony Parsons
Rubbing the shine of the knobs who think they're better than everyone else...
 
Join Date: Jun 2004
Location: Melbourne Australia
Posts: 478
Anthony Parsons will become famous soon enough
Yep, I've worked hard to get to retirement quickly. It all paid off. Now to let the financial advisor continue to do his job and keep me accustomed to the life I'm used to. Wife still works, though she likes what she does. Not sure if I would like to have her around all day anyway! World War?

Anyway, Mike has an excellent point there, and to another, even if JS fits your site better, ie. you just have lots and lots of links to get in your navigation, so a nice JS menu, completely SE unfriendly could be better. There is nothing wrong with that, suit your site and users first, SE's second. A simple static link outside of the JS menu from your homepage (and even better, every page) to a sitemap will suffice. You can then better your internal link structure by ensuring you write and link specifics about other content within your pages, and link all over the place within your site. Even better, that way your doing it from inside your text, and not standing out a link by itself or with others.
Anthony Parsons is offline   Reply With Quote
Old 11-20-2004   #7
sew2002
Member
 
Join Date: Nov 2004
Posts: 58
sew2002 is on a distinguished road
Quote:
Even though that's old school spam techniques it only take one stupid spider to junk your site. Even though to you and I it's totally legit try telling that to a freaking algo...
Whoa. So spiders will treat CSS's invisible div layers and hidden links as a "spam" technique, like that old school "technique" of making links the same color as your background? That is certainly news to me. Thanks for the heads up.

Anthony, our site is brand new and we are really counting on search engines to bring in traffic. So we might be willing to sacrifice a little functionality to achieve higher SE ranks.

So retired AND the wife is not around all day to bug you? Sweet.
sew2002 is offline   Reply With Quote
Old 11-21-2004   #8
Chris_D
 
Chris_D's Avatar
 
Join Date: Jun 2004
Location: Sydney Australia
Posts: 1,099
Chris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud ofChris_D has much to be proud of
Suckerfish, and sons of suckerfish, are essential reading in this area!

http://www.htmldog.com/articles/suckerfish/dropdowns/
http://www.alistapart.com/articles/dropdowns/

Enjoy
Chris_D is offline   Reply With Quote
Old 11-22-2004   #9
eragon
Member
 
Join Date: Jun 2004
Posts: 30
eragon is on a distinguished road
Possible solution

From what I've gathered here and at other forums, if you decide to use a JS menu, you should also make sure you have a site map. This will not only assist visitors, but spiders as well.
eragon is offline   Reply With Quote
Old 11-23-2004   #10
sew2002
Member
 
Join Date: Nov 2004
Posts: 58
sew2002 is on a distinguished road
Thanks Chris! Looks like I will have some homework during Thanksgiving break.

Eragon, that's a good point. I have a question though. Does search engines consider it spamming if you put your site map on the very top of the page (i.e. as the second object on the html code, right after the company logo)?

BTW, I had a chance to meet Christopher Paolini a while back but my darn friend got sick and we couldn't go to the book signing. I haven't had a chance to read Eragon yet but it is sitting on my table and I can't wait to read it over Christmas.
sew2002 is offline   Reply With Quote
Old 11-23-2004   #11
eragon
Member
 
Join Date: Jun 2004
Posts: 30
eragon is on a distinguished road
Quote:
Originally Posted by sew2002
Eragon, that's a good point. I have a question though. Does search engines consider it spamming if you put your site map on the very top of the page (i.e. as the second object on the html code, right after the company logo)?
I don't think putting your site map at the top will negatively affect you. In fact, from what I've gathered from other threads, it would seem higher up in the page may actually help, but do what's good for your visitors first.

I love Paolini's book. Can't wait for the sequel. I highly recommend getting into that book over the holidays.
eragon is offline   Reply With Quote
Old 11-23-2004   #12
orion
 
orion's Avatar
 
Join Date: Jun 2004
Posts: 1,044
orion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to beholdorion is a splendid one to behold
Exclamation Why CSS-Based Menus

The idea of hand-coding navigation menus right after the body tag and then repositioning the menu to be displayed where you want them and that I described above makes sense for several reasons.

RELEVANCE

First, this idea fits perfectly with the recent Weighted Link Rank Algorithm presented at the 2004 W3C Conference by Dr. Ricardo Baeza-Yates. Additional information is provided at the WLR Algorithm thread.

At one point in this conference paper, Dr. Baeza-Yates and Dr. Davis explain

“Finally, the term RP(j; i) gives more weight to links that
are at the beginning of the page rather that at the end of
the page (physically in the HTML code, not necessarily in
the browser view).”

Most definitely the WLR Algorithm has implications for navigation menus.

DOWNLOAD SPEED

In general, documents download faster when there are less interactions (requests) with the browser DOM and the JavaScript DOM. This is why division-based documents download faster than table-based documents, why optimized JavaScript downloads faster than unoptimized JavaScript, why local variables are interpreted before global variables, why do loops are faster than for-to loops, and why you want to pre-cache the so-called "dot" calls when writing scripts: its name is DOM.

Now, take this a step further. If you replace altogether JavaScript menus with CSS-based menus you are removing a huge chunk of DOM interactions.

ACCESSIBILITY

Accessibility is another reason for replacing JS menus with CSS-based menus. Gov and university sites in the U.S. are required to comply with the Accessibility ACT and Section 508. This means that the site should be accessible through different technologies and platforms, including disabling scripted languages. If users have JavaScript disabled, say “adios” to your fancy dynamic menu and forget about your accessibility status.

How about if users have disabled CSS or are using old browsers? Well, if coded properly, the menu should degrade graciously and users can still navigate your site with the hand-coded links, which should appear at the top of your site. Excellent CSS design methods are described in Andy King’s Speed Up Your Site: Website Optimization book (2003, New Riders).


Orion

Last edited by orion : 11-23-2004 at 11:29 PM.
orion is offline   Reply With Quote
Old 11-24-2004   #13
sew2002
Member
 
Join Date: Nov 2004
Posts: 58
sew2002 is on a distinguished road
Times like this makes me wish I could spread more than one rep point per poster. Are you guys always this nice to newbies?

Thanks again Orion.
sew2002 is offline   Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off