Your site navigation is one of the most important parts of your website, in terms of SEO and usability. This is an SEO blog but I will briefly touch on usability. Bad navigation, from a users perspective, is when your navigation leads to pages where there is no way to go forward or backward. A number of pages quickly maintaining the consistency of your navigational layout is therefore important, on every page and all pages should have a link going back to the home page. Right then, down to business, in regards to navigation and SEO this is important on two fronts; firstly, the flow of PageRank thoughout your site. All links on your site pass on PageRank. Therefore, the link in your primary navigation should be tailored to your important pages. By having something like your privacy statement in your primary navigation is a bad idea, as this will have PageRank flowing to it from every page in your site. Secondly, is how you create your navigation:

Option One: Flash navigation. Although it might look nice, it is a major problem to the search engine in terms of reading the link. Therefore, many pages will not get spidered easily and PageRank will not flow through your site properly.

Option Two: Javascript navigation. This is also a no no, as the fragment of Javascript code in relation to the URL can, and often does, confuse the spider in where the destination is located.

Option Three: Table based navigation. This is better than the last two, but if your navigation cleverly contains your keyword, it can be misinterpreted as spam and it is not the easiest option for the search engines to crawl.

Option Four: CSS lists. Lists are the Google preferred type of navigation and allows for the search engines to quickly spider your link. Also, because it is a list, it will never be considered spam. With todays advances in CSS, I can safely say that there is not much that you can’t do in CSS, which can be done in both Flash and Java Script.

So there you have it, CSS lists are the best type of navigation of any website. Now, I just wish that every one else would just come to realise it.

In this part of the SEO (search engine optimisation) Manual, we are talking about site navigation and in this article I am going to be talking about CSS navigation. CSS is used the world over by beginner developers and advanced developers. One of the main reasons it is so widely used is because it’s accepted by near enough all of today’s browsers and is widely known as a standard used when developing websites. CSS navigation has a huge advantage over the common JavaScript navigation when it comes to web site accessibility, this is because most JavaScript navigations require you to tell the script what links go where and it requires you to do this in JavaScript code and then simply calling the script using a function call e.g. myfunc(). The problem with this is that this function is used to write information to the browser, rather than convert already existing elements on the page. This is where CSS comes in, the way in which CSS works is it styles the elements of the page, it doesn’t recreate the HTML and print the final output to the screen. So in other words you would write your site navigation using simple HTML which can be applied to each page, a great way of doing this is using unordered lists. JavaScript navigation scripts rarely allow you to work of prewritten HTML code like a HTML list; this is usually because the JavaScript navigation sometimes uses tables to display the data, or even div elements. It then either replaces the current text within a specified container with the output of the script or it just prints out the script where the script is called on the page.

The reason using a CSS navigation is great for search engine optimisation is because of the HTML it uses to display the data, this is because search engine crawlers are able to read the HTML code much easier and determine what pages are navigation links. Whereas with JavaScript navigation the search engines crawlers are unable to see the result of the script. This is because search engine crawlers do not understand JavaScript, meaning any links that are generated by the JavaScript won’t be seen by the search engine, meaning those vital pages of your website won’t be seen by the search engines. For these reasons alone CSS navigation is the better choice, there are also other reasons for example using JavaScript navigation may cause the web page to load slower, or even worse not even work. A lot of errors come from JavaScript, a main cause of this is different browser versions or browser upgrades. However with CSS even if the browser does not fully understand the CSS being provided, it can still display the links. The links could be disfigured but they are still there and still usable. Another great feature of CSS navigation is the ability to make it look near enough however you want, the styling and layout is whatever you imagine it to look like, you may need to use images to make the layout look perfect but this is still fine and still search engine friendly which is of course the main reason we would suggest to use CSS navigation.

I hope this article is found to be informative and helpful and encourages you to replace your current JavaScript navigation with a CSS alternative. There are hundreds of sites out there with tutorials and CSS navigations free to use by anyone and everyone. A lot of websites exist to help others learn web technologies. Simply search google for more information on CSS navigation.