How switching from image to text-based navigation can help your SEO

Jessica Hammer - June 19, 2008

We are often asked to implement new navigation on sites that have poor optimized rankings. Many times, this is due to an image-based navigation, or a navigation structure that has been poorly designed.

While we understand that everyone wants an attractive and interesting site, a CSS, text-based navigation is a must-have for almost every website. It is your choice whether or not you want to give up looks for optimization, but in most cases, the text-based navigation looks just as good as an image-based one.

Here is the SEO difference. Image based navigations display all the ‘words’ of page names inside an image (a gif, jpg or png) and while that allows for a multitude of style options, the search spiders can not read your image. It only sees an image, and perhaps an alt tag. Text-based navigations, however, have the navigation (page names) in the code, so the spider reads it as plain language, and therefore, can follow links and index pages with better accuracy.

Using CSS and limited Javascript, you can make stylish and scalable menus by formatting the text within the CSS sheet. We like son of a suckerfish and for more effect, Superfish dropdowns for their easy editing, styling and lightness of code.

For a huge selection of menu code, and great design ideas, visit this CSS Showcase page.