Welcome to WebmasterWorld Guest from 3.227.254.12

Forum Moderators: open

Message Too Old, No Replies

Tabs and Progressive Enhancement

     
8:56 pm on Dec 9, 2008 (gmt 0)

Junior Member

10+ Year Member

joined:Aug 30, 2004
posts: 129
votes: 0


I'm working on a website which displays information about mobile phones. It is actually for one of the big mobile phone manufacturers. The idea is that for each product a general description will be displayed then the detail will be in various tabs. The data for the tabs will be fetched using Ajax. This was all decided by the design agency and our development team who have now 90% completed the site.

Now I've been brought in for usability testing. First thing I pointed out was that the website doesn't work if Javascript is turned off. This has the senior management running round like headless chickens. I decided to look at unobtrusive javascript techniques to achieve what they want. That is, if Javascript is disabled the website will load the first tab, clicking on other tabs will load the whole page. However it doesn't seem that it is technically possible to have a Progressive Enhancement / Hijax solution with tab layouts.

The other choice would be detecting js on the server and serving different content depending on the browser capabilities.

I'm wondering if I've missed something with the PE solution?

4:19 am on Dec 10, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Nov 28, 2004
posts:7999
votes: 0


Why can't you duplicate your output with whatever JS is doing? Generally I work the other way around, server-side first, then JS to enhance the experience. You just have to reverse engineer it.
4:53 am on Dec 10, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Nov 3, 2005
posts:1585
votes: 0


Consider having all tabs load with the page request, then use javascript to manipulate what is visible, no Ajax required. Better for search engine indexing as well.
9:23 am on Dec 10, 2008 (gmt 0)

Junior Member

10+ Year Member

joined:Aug 30, 2004
posts:129
votes: 0


> Consider having all tabs load with the page request, then use javascript to manipulate what is visible, no Ajax required. Better for search engine indexing as well.

That is a solution and given the tabs don't have a lot of information in them it seems sensible to me and will be one of the propositions. The Ajax stuff has been driven by the techies who want it on their CV (note to personnel: they are obviously planning on jumping ship soon :-).

I agree with Rocknbil's approach, get it working without JS/Ajax first. However it seems like tabs are a particular case where it is not easy to apply PE.

11:38 am on Dec 10, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Nov 3, 2005
posts:1585
votes: 0


However it seems like tabs are a particular case where it is not easy to apply PE

Yes, but not difficult either. There are many ways you could go, time evaluating the strength and weakness of each re requirements, performance, usability, SEO, accessibility would be well spent.

get it working without JS/Ajax first

Would you advocate "get it working without usability first", dont like leaving any aspect as after thought

6:24 pm on Dec 10, 2008 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Oct 17, 2005
posts:5021
votes: 26


Have you looked into any of the JavaScript frameworks? The Yahoo UI Library has a TabView component which can create your tabs from existing markup. Thus, if the user doesn't have JavaScript enabled, the contents are still displayed on the page and the "tabs" are simply links to anchors on the page where the content is located.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members