How to Optimize a Web Site Using JavaScript Menu

OptimizationIn this web site optimization case study, the author takes a look at using JavaScript menus in order to optimize your web page for top search engine placement. “With 3.3 billion searches conducted every month in the U.S. alone, and with thousands of new websites being added to the global network of the Internet, making sure your website ranks highly is becoming increasingly important.”

The Importance of a Misnomer

I avoid using the term search engine optimization, when describing what I do, because I believe this term is misleading. I do not optimize the search engines, not at least the major ones, although I have worked on optimizing the search features of a number of web sites. What is more appropriate, in my opinion, is to use the term web site optimization.

Whatever way you call it, the act of optimizing your site so that it may rank as best as it can for particular keyword phrases, especially with crawler-based search engines, is an important part of any web site’s marketing. Taking full advantage of the power of search engines to bring targeted traffic to your web site will be an important step in increasing its return on investment (ROI) – after all, if no one can find your web site, it does not matter how attractive or user friendly your web site is.

This article does not deal with search engine submission, which is another important part of your web site marketing campaign. Getting your web site submitted to the search engines would not necessarily result in your site’s reaching the top rankings for your selected search terms. It simply means that the search engines know your site exists. For more information on search engine submission, visit WebSage.

{mospagebreak title=Do Search Engines Matter?}

A web site can be found by following a link from another web site, or by going directly to the site’s URL advertised either by word-of-mouth or by expensive branding campaigns. In addition, a web site can receive a lot of traffic through the search engines if properly optimized for both their web crawlers and web viewers. The power of search engine optimization should not be underestimated.

With 3.3 billion searches conducted every month in the U.S. alone, and with thousands of new websites being added to the global network of the Internet, making sure your website ranks highly is becoming increasingly important. According to WebSideStory, one of the web analytics market leaders “As of Thursday, March 6, 2003, search sites accounted for more than 13.4 percent of global referrals, up from 7.1 percent the previous year…”

Referral Type

As of 03/06/03

As of 03/07/02
Direct Navigation65.48%50.21%
Web Links21.04%42.60%
Search Engines13.46%7.18%

How are these 13.46% of the total web site referral traffic distributed among the major search engines? According to, as of November 2003 the 7 largest search engines on the web are:

1. Google with 56.1% of the global usage share
2. Yahoo with 21.5% (with results currently provided by Google but soon to be provided by its own Inktomi)
3. MSN Search with 9.4% (with results currently provided by LookSmart which is to be replaced by Inktomi in January 2004 and by its own algorithmic search engine by 2006)
4. AOL Search with 3.7% (with results provided by Google)
5. Terra Lycos with 2.3%
6. Altavista with 1.9%
7. Askjeeves with 1.6%

Web site optimization for search engine positioning is the most cost-efficient way of web site marketing, and is particularly appropriate for small businesses and non-profit organizations which cannot afford costly online branding campaigns. In this article I will use the example of a non-profit organization’s web site,, and will analyze the way it utilizes a JavaScript-based menu for improving the usability of its navigation, while achieving high rankings with the major search engines.

{mospagebreak title=Search Results as the One of the Ultimate Tests of Web Site Optimization… }

(Hint: The Other Test is Usability)

BBFA, the Bahá’í Business Forum of the Americas, is a non-profit organization dedicated to the promotion of spiritual principles and values in business. If you run a Google search for “spiritual principles in business” or just “spiritual principles business”, you will see one of the BBFA pages on top of the “non-sponsored” search results page (sponsored search results are often out of budget for many small businesses and volunteer organizations).

Google: Number 1 ranking

Number one out of 324,000 pages – not bad for a small non-profit with no marketing budget!

Following the BBFA link listed on Google’s search results will take you to a page sporting a nice JavaScript-based flyout menu – that is, if your web browser has JavaScript enabled.

JavaScript Menu

The BBFA website utilizes one of the best JavaScript-based menus, developed by Milonic Solutions Ltd., and freely available to non-profit organizations.

Optimization Targets: Site Navigation and Content

So, how did BBFA manage to rank #1 on Google? To rank highly on a search engine’s result pages, any website (including your website) needs to be optimized and indexed. As you prepare to launch your newly redesigned website you should keep in mind two important points:

  1. Make it easy for the search engine crawler to index your website
  2. Make sure your content is optimized for top rankings

Every search engine’s crawler is different as are the algorithms used by the search engines to rank their results. What is the same is that every search engine’s crawler automatically and periodically crawls the URLs of different websites and then inserts them into the search engine’s index.

{mospagebreak title=JavaScript and Search Engine Crawlers}

Web crawlers essentially behave as archaic pre-browser-web-war, circa 1995/6, web browsers – they do not understand JavaScript and cannot see layers (<div> tags). For those of you who do not remember (or know much about) the wild childhood of the world wide web, JavaScript was introduced in 1995 LiveScript, in order to enable client-side interactivity in the Netscape web browser. It evolved into multiple vendor-specific JavaScript/Jscript versions, and finally matured into the standard ECMAScript.

Since the JavaScript menu used by is built exclusively on JavaScript and hidden layers, the web crawlers are unable to follow the links placed in the menu. You can use the Search Engine Spider Simulator, which, as its name suggests, emulates what a web spider would see.

Just put your URL in the form and pay close attention to the links listed there. You will notice that if there were any links listed at all, they would be the ones placed in the content or the footer of the web page and not the ones placed in the menu itself. Why? Because the web crawler is unable to follow the links composed by JavaScript statements. All it can do is follow plain HTML links, i.e. <a href=”mypage.html”>My page</a>

{mospagebreak title=Tip One: Do Not Depent on the JavaScript Menu Alone}


How then, if it is using a JavaScript menu, has this page managed to adorn itself with multiple links to the major sections of the site? The BBFA website incorporates breadcrumb links and bottom navigation links so that even if the search engine spiders are unable to follow the links built into the JavaScript code, the crawlers would be able to navigate throughout the rest of the site following the secondary navigation.

So, in order to enable the web crawler to follow the links to the rest of your site, make sure there are regular HTML links throughout the body of your page in addition to implementing bottom (or footer), side/top navigation, as well as breadcrumb navigation.

By the way, an added benefit of having breadcrumb navigation is the increased usability of immediately indicating where you are located and how to find your way home (to the home page), regardless of which web page you end up landing on from the search engine results pages.

{mospagebreak title=Tip Two: The noscript Tag}

In addition to implementing the breadcrumb and bottom navigations on the BBFA website, adding alternative set of links in the <noscript> pair of tag would enable the search engine crawler to get to the links at the top of the page!

Links Uptop

If your page did not contain any links interspersed throughout the content, or in the breadcrumb and bottom navigations, without the help of the <noscript> tag, your web pages would be unreachable to the web crawlers, and any other browser and user-agent with disabled JavaScript.

Thus, adding a list of the main navigation links in plain HTML between the <noscript></noscript> tags can be a handy way of assisting the web crawler in accessing the most important pages of the site.

Since web crawlers behave like old web browsers (pre JavaScript, pre frames), the <noscript> tag enables you to put additional information which would be hidden from the new, JavaScript-enabled browsers, but would be seen by the browsers who are unable to understand JavaScript, or who simply have their JavaScript turned off.

One thing to keep in mind, though, is that the moment you put irrelevant information in the <noscript> tag, you might cross the line of search engine spamming. Search engines, like all of us, dislike spamming and in their determination to show relevant search results, they would in no time remove a keyword spamming website from their indexes. So, before you do anything for improving your web site ranking, ask yourself – would you do that if the search engines did not exist, and would it benefit the readers in addition to the search engines.

{mospagebreak title=Tips Three and Four: The Sitemap and Keyword Choice}

Tip Three: The Sitemap

Having a sitemap can be another good way of providing access to the most important links of the website so that a web crawler can follow them and index the whole site.

The more pages the web crawler can follow, the more pages it will be able to index, the more interlinked the website will appear. Having a number of properly interlinked web pages within a website would indicate to the search engine that the information architecture of the site is solid and this would help you achieve higher search engine rankings.

Tip Four: The Keyword Choice

Now that we have made sure the site could be indexed, let us look at what would cause it to rank high on the search engine results.

Andy has selected a set of keyword phrases, which are not only popular but also effective. You would want to select not a single but two-three keyword phrases. Properly selected keyword phrases will increase the chances of your site being found and will bring more targeted audience.

A wonderful web service, which can be used to select effective keywords is WordTracker. Alternatively, use the Term Suggestion Tool provided by the paid search engine Overture for their key term analysis.

{mospagebreak title=Tip Five: Keyword Placement and Density}

The BBFA page has its chosen key phrase in most of the critical places:

  1. at the page title tag;
  2. throughout the content;
  3. at the text of web link pointing to relevant web pages;

It does not have a description meta tag but it should! The description meta tag is often used by search engines to list a brief description of the site. Thus a good description meta tag not only would improve the usability of the search engine results, but would educate the person making the search if that page is the one sought before the actual visit to the site.

While different search engines have different algorithms for ranking web pages, one of the general rules is the importance of frequent appearance of the key phrases throughout the content of the page. Of course, simply stacking keywords could backfire unless their presence is purposeful and aims to inform the readers. Again, follow the rule: “whatever is good for the reader should be good for the search engine”.

The BBFA key phrase of choice “spiritual principles” appears 4 times throughout the content of the home page. Different keyword combinations including “business” appear multiple times as well. With such keyword density, no wonder the page shows high on the search engine result pages.


To see a full report on the keyword density of your web page, go to the Keyword Density Analyser Tool.

Using keyword density analysis tool will help you see your pages through the eyes of a web spider. It will help you understand if indeed the keyword phrases of your choice appear throughout the page title, meta tags, and page content consistently and often enough to convince the search engines that this page is relevant, has substantial content, and is worth high ranking.

{mospagebreak title=Conclusion}

In summary, what this article has covered are some of the best practices for web site optimization and search engine marketing as applied to websites using JavaScript-based menu:

  1. Do not depend on the DHTML menu alone for navigation – provide additional links throughout the body of the page, through breadcrumb and bottom navigation;

  2. Build a list of links to the most important sections of your site in the <noscript> tags which both the archaic browsers and the search engine crawlers will be able to see and follow;

  3. Build an informative sitemap to enable access to the most important sections of the site; in addition, provide links to these sections from the footer of every page;

  4. Select several two-three word keyword phrases and place them within the page title, the meta tags, and most importantly, throughout the body of the page;

  5. Whatever you do, do it to make the page readable and usable for the people who will find your website via a search engine – do not do it just for the search engine positioning. After all, if you are number one on Google but nobody stays at your website to read or purchase from it, your search engine optimization has been a waste of time and energy;

  6. Be patient – the search engines take their time to crawl and index the newly discovered pages. Do not expect improved results within the first 3-4 weeks; sometimes this can take several months.

If after several months your web site’s position on the search engines result pages has not improved, you might want to consider the services of a professional web site optimization and search engine placement expert.

This article did not cover the equally important subjects of search engine submission and building links to your site, both of which would help your web site attain high search engine rankings. If you want to learn more on these subjects and on how to achieve top rankings with the search engines, you can visit WebSage.

If you have any questions on search engine optimization and submission, or if you decide that you do not have the time or patience to do your own search engine optimization, feel free to contact me at

[gp-comments width="770" linklove="off" ]