You are absolutely right that you can’t get a tabbed effect in all browsers without JavaScript (forget IE6 and you can use element:hover). The idea of the post is not to abandon the tabs that Shannon is trying to implement but, rather, build the tabs in such a way that everyone can play.

For example (and note that I haven’t spent much time going over the HTML provided in that post), alter the menu and tab structure such that the tab titles are elements within the LIs (span, h6, etc) and the tab contents are div structures, also within the same tab. With such a construct, a JavaScript-less visitor would see (appropriately styled, of course):

* Home
* eSolutions
SEO, SMO, R&A, etc
* Resource
Downloads, Blog, Guides, Training
* Contact

Incidentally, the nav should be built with this type of structure anyway, and only reconfigured after the document has loaded.

Does this view match the visual goal, when JavaScript is disabled? No, probably not. Have you now provided a way for all visitors, regardless of scripting capabilities, to access your primary navigation? You bet.

You can’t make the blanket statement that we should abandon non-ideal layouts for script-less visitors else you run the risk of alienating what may be an essential part of your audience.

Shannon, while we’re on the topic, if one of your primary navigation items is search engine optimization, you should probably employ techniques like those I described here, to represent a little of that SEO expertise your site proclaims. Moving forward, though, I would think about writing some HTML to mimic the structure I described above, then using JavaScript to show/hide the tab content and set the layout classes for the LI tags. If you don’t feel like writing your own block of JavaScript to do all this, I would check out the jQuery UI Tabs – http://jqueryui.com/demos/tabs/. The jQuery and UI libraries do add a little bloat, but tab functionality is easy with this plugin.

Check this link out:

http://www.xul.fr/javascript/tabs.php

And this one:

http://css-tricks.com/examples/TabsNextPrev/

There’s no way to get tabbed panels without using some kind of Javascript. Which really goes back to my original post; at what point do we let content presentation reign over accessibility? At some point, we simply need to ignore something as small as 6% or less of the web surfers (this is highly subjective depending on the site and its target demographics) if we want to continue to evolve in web design/content presentation.

Hope those links help!

The sorter is a huge culprit, when it comes to ignoring the needs of all users. One of the key elements I should point out about the Netflix sorter we have pictured here is that it also includes the actual, editable sort number in an input box that is tab-in accessible. Reordering without a mouse is not as easy, but is at least possible.

Thanks for the comment – and the reminder that there is always more to be had.

I realise that this statement was not intended to be a complete list, but one important and relevant category that you should have included is users who cannot operate a mouse. I fall into that category and it has heavily influenced my choices in development work and career path. It also means that I use the web without JS, because there is quite a lot of JS fluff that is poorly designed and either fails to work for keyboard users or at least gets in their way. Ironically, I had to enable JS just to add this comment, which should not be necessary!

From the comments: “It’s hard to imagine a site that has no JavaScript in the background, and still looks attractive to users.”

It’s not difficult…. There are so many attractive, distinctive, and highly usable websites that do not use JS and are none the worse for it. JS is (or should be) about adding function; it does not add attractiveness.

Also, be very careful of Alexa – it only tracks stats reported by Users who have a toolbar that includes the Alexa reporting script installed. get someone with no toolbar and you get no Alexa data. They even acknowledge that the sample may be skewed

[QUOTE]
The traffic data are based on the set of toolbars that use Alexa data, which may not be a representative sample of the global Internet population
[/QUOTE]
- http://www.alexa.com/help/traffic_learn_more

To be fair, theCounter.com is just as suspect – these are aggregate numbers of all stats reported from sites owned by paying customers. What we don’t know is who has paid for theCounter.com’s service. It could be Google or it could be some fanboy site with 6 visitors per month. Again, the point is that no matter the source, the percentages come out around 6%.

The hard part about this is that no one can get the statistics exactly right, and your stat tracking should be done on a site-by-site basis. There is no certainty in predicting your static audience, even when predicting based on your own site stats. We have to all take the approximate numbers on faith and do with them what we will.

Ps, Web developer plugin for FF has an option to disable JS for testing.

http://www.thecounter.com/stats/2009/January/javas.php shows 6% JavaScript disabled but I don’t really know who these guys are or who their clients are so these stats don’t mean that much to me. It kind of looks like they’re providing an odometer-style counter that was all the rage in 1996. I don’t really get a high level of confidence from their site.

I really wish some of the top sites would release stats like percentage of JavaScript enabled from their visitors.