Dropdown Menus in WordPress, an SEO and Accessibility No-No
Twice recently I went onto client’s sites to find they opted in WordPress Admin to use a category dropdown menu instead of the regular widget menu. It amazes me every time I see this. Why? Because not only is it an ugly interface in an otherwise Kickass design, but it’s also a really really REALLY bad idea from the point of view of accessibility and Search Engine Optimization.
Let’s take accessibility first, since it also covers the biggest part of SEO, since Search Engine Spiders happen to be blind. Screen readers and Search Engine Spiders cannot follow links hidden in Javascript, and since the dropdown menus that are generated by Wordpress do not have a noscript alternative, that means that SE spiders and people who use assistive technology won’t find these links. From Google Webmaster Guidelines, “While Googlebot is great at understanding the structure of HTML links, it can have difficulty finding its way around sites which use JavaScript for navigation. We’re working on doing a better job of understanding JavaScript, but your best bet for creating a site that’s crawlable by Google and other search engines is to provide HTML links to your content.”
People who can see but are not dexterous with a mouse may also have a problem using this sort of dropdown menu, though I admit I didn’t try keyboard alternatives.
Now we come to SEO. People who use WordPress generated dropdown menus have not only hidden the links in Javascript so SE spiders can’t follow them, they’ve also thrown away KEYPHRASE RICH ANCHOR TEXT that would help their site get good serps for those keyphrases. The way Search Engines index you is to report back the anchor link text that is used to point to your pages. That’s what helps to “place” you within the WWW hierarchy, and counts for both internal links AND links from external sites. So when you toss out this keyphrase rich anchor text AND the links, it’s a double whammy against you.
Purely from a geek standpoint, I find it annoying that there isn’t a noscript alternative since most of us geekytypes run with js either turned off completely or at the least throttled back via firefox plugin to make our computers more secure. Also, if you’re going to write code, at least take the time to do it right, and in this case the WP devs didn’t. Not only is the noscript alternative missing, the html code that is generated by the javascript doesn’t validate. Ugly!
Now, from a usability and psychological standpoint, I, as a visitor, am much more likely to click on an intriguing category name in anchor text than I am to click on “Select Category”. So most likely it would follow that there are most likely going to be less pageviews per visitor with this type of menu system, which translates into less conversions, less ads viewed, less ads clicked, etc.
So next time you think it might “neaten up” your page to use a category or other type of javascript generated dropdown link menu, you might want to reconsider.
Technorati Tags: WordPress usability, Wordpress Accessibility, Wordpress SEO
March 1st, 2008 at 4:23 pm
This is a great tip! I install WordPress blogs for various clients and have an SEO optimized service.
So far no one has asked for a drop down menu but now I know what to tell them.
Thanks for the insight!
March 1st, 2008 at 4:33 pm
The point is that you need to educate them. They can turn those dropdowns on at whim from admin. There goes all your SEO work.
March 4th, 2008 at 6:50 pm
Nice tips, I suppose a lot of people missed those important elements. They care too much about design and totally forget about search engine optimizing. (Or they may not even know what seo is)
March 16th, 2008 at 9:17 pm
Every now and then you would see a funky theme that is absolutely useless in terms of seo.
March 16th, 2008 at 10:25 pm
SEO, didn’t you READ the post? It has NOTHING to do with the theme. The dropdowns are turned on from Admin, and it doesn’t matter what theme you use.
March 16th, 2008 at 10:47 pm
If you were hell bent on a drop down menu you could use ordered lists and CSS to accomplish the effect without making the links not spiderable.
March 17th, 2008 at 4:40 pm
A good comment. In fact, I had several costumers with their company oficial blog with this kind of problems.
I solved more or less quickly… but it’s something to keep in mind.
Regards,
Enric
March 18th, 2008 at 11:24 am
Google Webmaster Guidelines say that their can have difficulty finding its way around sites which use JavaScript for navigation. However my experience tell me that they have actually not any problem at all with finding such a website. Maybe it comes because of placing sitemap (at least by my websites) or not…it is difficult to say but Google is in my opinion pretty good to read javascript content.
March 28th, 2008 at 12:17 am
I have been using drop down menus because of how great they look for some of my Atlanta web design clients. I will definetely be more conscientious when it comes to using javascript with links. One question though? With google being such a heavy proponent of AJAX which relies on Javascript at its very core, why don’t they develop a way to crawl javascript. I am sure it can be done. After all, most of their applications are AJAX like GMAIL which really has a nice search utility. Does anyone know anything more about this issue? I have been searching online for a while and I can’t seem to find anything relevant.
April 1st, 2008 at 5:15 pm
oooh wonderful! just what I was looking for! no wonder they never take my site!
April 2nd, 2008 at 11:59 pm
Great tip! I was not aware of this and wouldn’t have thought this would be an SEO problem. Thanks!
April 8th, 2008 at 12:35 pm
Nice post. One thing I have noticed is that SEO is a continuous process. It
cannot be done perfectly in one shot. You have to be on your toes and try out
different things to get ahead of your competitors. There have been instances
where my site’s search engines rankings have improved considerably with few
small tweakings.
- Michael
April 9th, 2008 at 10:01 am
LOL! Michael Anderson, apparently you didn’t read the part where it says some people have javascript turned off. You should take a look at your page that way sometime. Did you know that SE spiders don’t parse javascript??? So they come to your so-called SEO page and say, “Nothing to see here, move along.”
April 18th, 2008 at 2:13 am
Froma usability standpoint, the drop-down menu approach make s lot more sense if you have say, over 20 categories, and do not need them to be the center of attention. If you include a noscript version, then search engines, nerds, and bilnd people will all be happy too.
April 18th, 2008 at 9:51 am
Um, Carrie, you’d have to HACK CORE to do that. We’re talking about WordPress GENERATED category dropdown, which can be turned on from admin.
Geez, seems a bunch of people are anxious to comment about what the post isn’t about. *sigh*
April 24th, 2008 at 1:53 pm
Hi BJ, out of curiosity, can you link to an example? Also, where is this turned on in WP admin (I don’t see it in mine).
Thanks!
April 25th, 2008 at 10:29 am
I can’t currently link to an example since this article, and the comments it generated, finally convinced my clients it’s a good idea to turn it off.
It turns on and off in the newest version of wordpress from admin/presentation/widgets/category widget active/ edit category widget
So if you want an example, turn it on in your own blog, then look at source code. But then I suggest you turn it back off.
May 13th, 2008 at 6:12 am
Thanks for the tip!
I Dont have the catogories in drop down, but i do have the archive’s.
im changing it now!
Thanks alot!
May 17th, 2008 at 7:06 am
so dropdown menus=bad seo. :))
thanks!
May 20th, 2008 at 1:23 am
I’ve never been a fan of drop down boxes anyway, even on desktop applications. You know too many times we design stuff we like and don’t really think about what our readers would like. I guess drop-down lists are another good example!
May 20th, 2008 at 4:48 am
I’m not a fan of dropdown menus for a couple of reasons. First it doesn’t show the whole world, things that reside in a blog and secondly it requires users some effort (i.e to click the dropdown menu and select a category). I’m too lazy to click here and there
May 20th, 2008 at 4:27 pm
Damn, my primary blog uses drop down menus. I guess it’s back to the drawing board for me, heh.
May 21st, 2008 at 9:49 am
I agree completely, while the cat drop-down may seem to tidy things up it really isn’t the best idea when it comes to SEO.
May 21st, 2008 at 12:29 pm
This is really kickass tips. I was really comtemplating using drop menus but now I will really think twice.
May 22nd, 2008 at 12:04 pm
Dropdowns do ‘tidy things up’ but in general they are not good for the user in the first instance, before you even think about SEO. The worst dropdowns are the ones where you have to navigate to more than two levels in one go and end up losing the thing just as you finally get your cursor into right place.
May 23rd, 2008 at 6:08 am
I have a blind son, and is there something he/we hates, is it dropdowns. So thank you for enlighting a neglected problem.
/Zaga Bjækehuse - Denmark
May 23rd, 2008 at 11:02 am
This once again proves that Jacob Nielson is wrong from http://www.useit.com (a website usability company), a recent quote from him.
“I am pessimistic about the long-term prospects for SEO jobs, because the basics of search engine optimization are fairly simple and ought to be part of the core competency of anybody who makes a living in Web design, Internet marketing, or writing for the Web. You shouldn’t need a special consultant to make a Web site that follows simple guidelines.”
SEO is constantly evolving. We work with programming companies constantly that are not familiar with the advanced art of SEO.
May 23rd, 2008 at 11:10 am
Actually, I think that this issue proves Jakob Nielsen more right than wrong. Javascript dropdowns have always been a bad idea from both an accessibility and search engine perspective.
As to SEO, it isn’t rocket science. But you can say whatever it takes to justify your paycheck.