• RSS
  • Twitter

Sunday, December 12, 2010

Website Navigation Design

Website Navigation Structure
Website Navigation
Website navigation structure and behavior affect the ease with which search engine spiders can navigate through the site and index it. Your site navigation should facilitate the uninterrupted movement of crawlers within the site. 

Search engines prefer sites which are easy for them to navigate and retrieve information related to the site’s topical information, and consequently rank them higher for the site keywords. Therefore it is very important for the site to have a simple navigation structure that is easy for the spiders to crawl.

There are many types of navigation structure that can make it search engine friendly or not.

1.  Simple text-based navigation is the most search engine friendly. Apart from being easily followed by spiders, text-based navigation gives an opportunity to include the keywords in the page content. The keywords included in the navigation are valued by all search engines.

2.  JavaScript based navigation: Search engine crawlers can read JavaScript but cannot parse it; hence, they are unable to follow the links embedded in the JavaScript code. Usage of JavaScript based linking would not allow the crawlers to follow the links and crawl/index the sites completely. If the navigation has to be JavaScript based, it should be made sure that in case the scripts are blocked by user settings, they should still be able to navigate through the site. It’s recommended to use the html noscript tag.

Example: Use of the <noscript> tag:

<script type="text/javascript">
document.write("Hello World!")
</script>
<noscript>Your browser does not support JavaScript!</noscript>

The <noscript> tag is used to provide an alternate content for users that have disabled scripts in their browser or have a browser that doesn’t support client-side scripting. The content inside the noscript element will only be displayed if scripts are not supported, or are disabled in the user’s browser.

3.  Flash navigation: Flash is not parsed by search engine crawlers in normal circumstances (unless the text/HTML alternative is provided or unless the flash movie is using deep linking to all the content). The reason for search engines being unable to read flash code is that flash is published in the .swf format which does not contain the code (code is embedded in .fla files) which are not published on the pages. This means that in order for search engines to read the flash embedded content and navigation, they will have to decompile the flash movie, which is not done by search engines at this point. It’s recommended using SWFObject to replace flash video on a webpage, so you can include text.


4.  Image based navigation: Often, the site design requires the navigation to be in form of images. Search engines can follow the image links (as long as they are not JavaScript based) but using image based navigation takes away the ability to create keyword targeted navigation. Quite often while embedding rollover or other interactive images for navigation, JavaScript is used for linking. It should be made sure that the links behind the images are not JavaScript based.
Note: It’s recommended to use the Alt attribute whenever an image-based navigation must be used.

5.  Sliding/DHTML menus: If the site structure and architecture requires the use of rollover menus. Most often, the sliding menus are implemented on the sites using pure JavaScript for interactivity and functionality of the navigational links. The best practice is to use the CSS/JS hybrid navigation to make sure that the links embedded in the navigation are readable and followed by search engines. In case JavaScript has to be used, it should be made sure that the JavaScript code is placed in external files instead of page code.

Using a drop-down or pull-down menu helps you save on screen space when you have a lot of material that needs to be displayed on your pages, or a complicated multi-level navigational structure. In general it is recommended to use XHTML and CSS style sheets to present drop-down or pull-down menu navigation so that the search engines will still see the href links when indexing your Web page. If you must use drop-down or pull-down menus using JavaScript or a CGI script as your main navigational format, remember to include a secondary form of navigation to allow search engine spiders to follow links to the sections of the web site easily.
Example: footer text links.

0 comments:

Post a Comment