Get updates and news:
Want to get Lullabot article, videocast, and podcast announcements delivered right to your in-box? Let us know your email address (we won't share it) and we'll let you know when anything exciting happens.

Source-ordered content is flawed!

As I was working on a template for one of our clients, I stumbled upon an excellent article detailing a usability experiment about source ordered web pages. Turns out, all of the recent hype about sourced ordered pages is merely that: just hype.

The majority of screen reader users EXPECT navigation to be presented before the content.

And there you have it. People using screen readers, the people that would benefit most from source ordered pages, actually don't prefer to see content before navigation. Very interesting. Guess all of those CSS layouts that imploy various hacks and tricks aren't really needed. And that's a good thing, not only for people accessing your site with screen readers, but for your sanity too... have you ever tried to debug one of those crazy CSS layouts? Eek!

Read more about this study here: http://www.usability.com.au/resources/source-order.cfm

Comments

it depends on your motivation

Moving content to the top will get the keywords in the content at the top of the page - which, I believe, can help with some search engines.

I'd say that benefits of content ordering depends on your motivation. Unless you are making a site specifically for the screen reading crowd or with high desire for them, including screen readers in your decision making above getting good search engine performance is a trade-off I wouldn't make.

hmmmm....

I think your conclusion went to far too fast with too little discussion of caveats. You know as well as well as I do that sidebars in drupal quite often contain more noise than signal. With mobile devices,and screen readers, I think clearly "accessibility" goes beyond the structure of the document.

IMHO, drupal sites that truly want to be accessible will place the critical navigation items in the primary links area, not the sidebars. I consider sidebars to be very much second-tier navigation areas. They are great places to put "recent comments", complex menu trees that allow users to "drill-down" to very specific content, and various items that enhance the user's ability to "see" what is currently going on at the website.

Moreover, the study that was cited reached a much more cautious conclusion. To quote: "It is probably desirable however, to present the content of the page before extraneous information, such as advertisements and related links, as well as the page footer. " In this view, placing sidebars at the bottom, with primary and secondary links placed before content actually enhances accessibility.

Not to mention, I have yet to work for one person who has given a tinkers damn about accessibility. Having content ordered at top SIGNIFICANTLY increases the SEO of a page. At my blog, making the change has already produced a 25 percent increase in traffic. I don't know if its related, and we never can REALLY know, but that said, those sort of increases have not yet failed to materialize in the 4 sites I've deployed a content at the top sidebars at the bottom layout. For god's sakes man, we can't argue the "web for everyone" when we have footnotes that read: "by making your website accessible to 2 percent of the population, you may experience a 25 percent decrease in traffic".

BTW, I think this may be very promising: http://www.webstandards.org/learn/articles/askw3c/feb2004/

A wonderful dream might be to build default templates and menus for the variety of devices that might stumble upon a webpage. Clearly, in my mind at least, the dream of a web for everyone is going to happen through standards, not education and increasing poor designer's workloads, and clients bills astronomically.

Sorry for the rant.

Well said...

Nick, I agree completely. My comment might have been a bit hasty, but I think you misinterprted my point as well.

Everything you said about creating an accessible Drupal site I agree with and actually use myself in various sites. When I said placing navigation at the top, I meant exactly that: placing the Primary Links which *are* the primary navigation for all the sites I deploy. No extraneous blocks to clutter it up, which should, go at the bottom of the page.

Now, before work for Lullabot, I was previously in the US Government sector, so accessibility actually played a role. All sites need to be Section 508 compliant. Are there? Not even close. But nonetheless, I tried my best to make the ones I developed compliant.

Both yourself and Greggles brough up the SEO idea and yes, I did overlook that in my article. That does play a big factor, but like Greggles mentioned, depending on the focus of your site, you may need accessibility over SEO. I'd say that is a rarer case, but with my background, it wasn't so rare.

But nonetheless, the article was very interesting, as was the study. I've read countless articles that state putting content before navigation makes the site more accessible. According to this article, it really has no affect and is probably even detrimental. Really, these articles should boast about the SEO benefits of source ordered content.

And Nick, I wholeheartedly agree about standards... that is the only way.

Best of both worlds

If people can't find your site, then you might as well not have site. So having the content first is important from the search engines point of view.

At the same time, supporting screen readers can also be accomplished by placing a hidden menu at the beginning (which search engines will ignore).

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <blockquote> <h2> <h3>
  • Lines and paragraphs break automatically.
  • Use <!--pagebreak--> to create page breaks.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options