Sun 23 Dec 2007
Use CSS Drop-Down Navigation Arrays for SEO Friendly Menus
Blurb by Shaun Anderson (Hobo)You can create a dynamic dropdown menus on your site that meet accessibility requirements and is seo friendly and then link your pages together in a Google friendly way.
Just be sure to employ a system that uses CSS and Javascript (instead of pure javascript & HTML tables) and unordered lists as a means of generating the fancy drop down navigation on your website.
Then, if javascript is disabled, or the style sheet is removed, the lists that make up your navigation array collapses gracefully into a list of simple links.
Just be sure and include that ’skip links’ link if your lists are long or repeated page to page and appear above the content..
Remember, with Drop down menus:
- Drop-down menus are generally fine but the JavaScript triggering them can cause some problems for users with screen readers and screen magnifiers.
- A <noscript> alternative is necessary.
- The options offered in a drop-down should be repeated as text links on the same page, so use unordered lists with CSS to develop your menu.
Interested in SEO? Check out our SEO Blog, or our DIY SEO Cheat Sheet!
Did you know when you link to a Hobo SEO post we have search engine friendly links back to your site if approved? Our comments are also search engine friendly you know (once you've commented on a few posts)! Do you need any more encouragement to get involved in the conversation ;)
