A fundamental problem with Ajax websites and hiding content

I just realized a really annoying problem using Ajax to hide content. An obvious example would be if you have a set of Ajax tabs that you use to show different content in a set space, as seen in several jQuery example sites.

a screen cap from jQuery.com
a screen cap from jQuery.com

SEO people and IA’s seem to be telling me that all that content has to exist in that page. The problem with this is that if I come from a Google search for a specific phrase and that phrase has been hidden by Javascript because it’s on a different tab, then I am annoyed because I can’t see the reference that I searched for on this page. My usual reaction when this happens is to crack out the find function to search for the text but that doesn’t work because the content has been hidden.

This results in a thoroughly infuriating experience of me clicking on random things in order to try and get my desired content appear. NOT what we want.

The solution has been around for a while but is the concept of weaving the back end and front-end code together, so they Javascript acts as an interchangeable presenter layer that can be swapped out for the back end if Javascript is enabled. Apparently now it’s called SOA (service orientated architecture – before it was just good OO, but apprently that needed rebranding). I am working on auto trader at the moment and we seem to have achieved a framework that works this way but I don’t totally understand how – I need to interrogate those friendly chaps at Thoughtworks on Monday. This does throw open a whole barrel of worms where we have to be vigilant about writing functionality that’s essentially dumb to what’s being displayed, but intelligent as how to function. Hmmm, i think the amazing new jQuery1.3 $().live functionality will be required…


I have written a follow-up post with a possible solution here:
smartTabs :: SEO friendly AJAX tabs

Leave a Reply