Use CSS Drop-Down Navigation Arrays for SEO Friendly Menus



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!

If you enjoyed this post, please share :)




Learn how you can get more sales from your website

Subscribe for free and let us share with you:

  • how to submit your site to Google, Yahoo & Bing
  • how to optimise your site to get more traffic from Google
  • how to target the most valuable keywords for your business
  • how to make your site rank better in free Google listings
  • how to rank high & avoid Google penalties in 2013

Trust Hobo with your SEO plan

Find out more