Discover the best of the web!
Learn more about Digg by taking the tour.
The Ultimate Tabbed Menu
dragon-labs.com — A synergistic synthesis of modern web technology to attempt to create the Ultimate Tabbed Menus – for users of all skill levels. The Ultimate Tabbed Menu features well styled tabs, with support for shadows, using a three piece assembly method – somewhat similar to the Sliding Doors technique.
whalesalad- 1562 diggs
- digg it
- kshag, on 10/12/2007, -39/+18good stuff good stuff
+DUGG- michaeljh, on 10/12/2007, -43/+2true dat
- whalesalad, on 10/12/2007, -45/+5Word.
- pcgeek101, on 10/12/2007, -24/+13Wow that is some high quality work ... I love the fade-in effect of the menus
digg++ - stokestack, on 10/12/2007, -4/+3WTF, these don't work right in Firefox 1.5 either. The selected tab is never brought to the forefront; the first one is always the "current" one.
Lame. - slackerbox, on 10/12/2007, -0/+3"WTF, these don't work right in Firefox 1.5 either. The selected tab is never brought to the forefront; the first one is always the "current" one.
Lame."
---
Because they're just static CSS layouts showing the menu and how it works. To show the tabs change it'd need to refresh or load a whole new page. There's nothing wrong with the browser.
The only one that does work as you want is the AJAX one since it doesn't need to be refreshed to change.
- superdog87, on 10/12/2007, -31/+6Awesome! Hey digg..... we like it!
- oni0n56, on 10/12/2007, -24/+8Wow it's got an "ajax" implementation as well as a bunch of decent styles. And if you don't like how it looks, it goes over how to make your own.
- GeniusCube, on 10/12/2007, -28/+7CSS and AJAX! I sense a front page coming on! I wish something else would make it once in a while, oh well, Digg.
- toastyghost, on 10/12/2007, -3/+21A lot of these are broken in IE 6; the remote ones and the ones under 'more menus' for example.
Lovely tabbed menus, but some checking for those stuck on, or not smart enough to use something other than IE would have been nice.- Mugros, on 10/12/2007, -19/+2Man, i feel so sorry for you. Maybe you should a real browser instead of the outdated junk called IE.
- Arbinshire, on 10/12/2007, -19/+17"A lot of these are broken in IE 6;"
You should change the wording to something like:
"Unfortunately, IE 6 doesn't render this correctly as they use valid, structured code that IE fails to display correctly. Perhaps we should email Microsoft and urge them to adhere to web standards. I'm writing my email now."
IE6 (and 7) = Broken. - Chewie67, on 10/12/2007, -4/+16You should change the wording to something like:
"Unfortunately, IE 6 doesn't render this correctly as they use valid, structured code that IE fails to display correctly. Perhaps we should email Microsoft and urge them to adhere to web standards. I'm writing my email now."
Granted, but you can't call this the "ULTIMATE" menu system if it doesn't work with the browser that 80% of the world uses.
It also doesn't work on Safari, so perhaps this is just the "Ultimate Firefox Menu System". - phill, on 10/12/2007, -1/+7I think that more web designers/coders should move to not supporting MSIE. If we all stop supporting MSIE, maybe it will just die (or get fixed).
We are just shooting our own feet by continuing to support bad browsers. - warrenfalk, on 10/12/2007, -2/+3Is a standard a standard because someone calls it a standard, or is it a standard because that's the way it is done everywhere?
Like it or not, IE6, sucky and different as it is, still has a larger share of the userbase out there than the others combined, so it is still the standard in that you have to support it if you expect the majority of regular users to use your site.
The people supporting the browsers are the people using them. If you protest and make a bad site that doesn't work in IE, then you will be shooting yourself in the foot because to IE users they will simply not support what looks to them like a "bad site." - mayflyjac, on 10/12/2007, -0/+0@warrenfalk
is that true? i'm not saying you're wrong about ie usage but i would love to see some stats. as a web designer it would be useful to know what browsers people are using. but with open source brazil and a lot of people in europe using open source and the faults in ie a lot of people are using alternate browsers. with browser usage i think those that use ie just don't know about the other options. we need to educate. honestly. ie needs to change, even if it dominates the market. it should change to at least gain some cred. come on...no tabbed browsing...that's insane!
- Grimdotdotdot, on 10/12/2007, -7/+5Direct link to an example: http://www.dragon-labs.com/articles/utm/demo_4/
- CosmicJustice, on 10/12/2007, -1/+11Click several tabs then click your browser back button.
- conigs, on 10/12/2007, -1/+12I like how this method is described as AJAX, yet all the data for that page is already loaded in divs. The tabbed menu simply shows and hides those divs. I think this guy missed the part where AJAX stands for Asynchronous Javascript And XML... actually, a lot of people missed that. Most of what is considered AJAX now is simply re-used "DHTML" techniques.
(Feel free to correct me if I'm wrong. I just glanced at the source for the page and the js pages.) - ghoppe, on 10/12/2007, -4/+4Guess you missed the part where he wrote in his description:
"Also, this isn't really AJAX, but just javascript. However, many people nowadays have no clue what AJAX really is and use it to refer to any dynamic javascript effects, so I use the term colloquially." - Cirieno, on 10/12/2007, -5/+2@conigs:
To quote from the article:
"Also, this isn't really AJAX, but just javascript. However, many people nowadays have no clue what AJAX really is and use it to refer to any dynamic javascript effects, so I use the term colloquially."
Edit: doh! @ghoppe got there first!
- lumpy, on 10/12/2007, -3/+15They don't work in IE. With at least a 50% market share, smart or not smart they for the sake of accessibility I would fix that. Also it loads like very slow for me (could be in the throws of a digg effect)
- looklikecontest, on 10/12/2007, -1/+7At least 50%? More like 85%.
http://en.wikipedia.org/wiki/Web_browser_usage_share - TheTankengine, on 10/12/2007, -4/+450%? Its a hell of a lot more than that. Firefox is touting a 10% breakthrough marketshare recently. Unless opera is cranking out a 35% share (which ain't happening anytime soon), you are way off.
- Murdats, on 10/12/2007, -3/+1well maybe if lots of pages use this, then lots of people will switch so they can view this
in short maybe it will make ms get off their ass and make a decent browser - d03boy, on 10/12/2007, -1/+5Why adhere to non-standard standards? So that MS will keep making their browsers non-standard and we can continue to debate this for the rest of our lives? If everyone wrote their pages according to standard then people would stop using IE (or even better, IE would start adhering to the standards) and we could all get on with our lives.
- clintonforbes, on 10/12/2007, -1/+2murdats, your average mum or dad is not going to upgrade because of tabs not rendering properly on certain sites. They will just stop visiting those sites. Despite IEs many flaws, if your HTML/CSS doesn't look right in IE5/5.5/6 then you are annoying the bulk of your audience. (Unless it is a geek site.)
- raremage, on 10/12/2007, -0/+2"Why adhere to non-standard standards? "
How about so the vast majority of surfers can see your content?
Look, I "get" the argument that we should all be pushing standards, and that's a great thing ~philosophically~ But it's sort of depressing to stand by your convictions and never make a sale / get a hit / have success because of it. For the time being, failing to work with IE pretty much locks stuff into a niche space.
- looklikecontest, on 10/12/2007, -1/+7At least 50%? More like 85%.
- jnorris441, on 10/12/2007, -4/+23"synergistic synthesis"
Dude, get over yourself. - rebz, on 10/12/2007, -0/+13good design and very pretty, but the functionality lacks a little. while the tabs "work", simple browser commands like the back button don't let you retrace your steps through the information, instead, its a history item that just reloads the current page your in. for moving around content, that could be very frustrating for a novice user.
but, like i said, it looks really nice. - Genius16, on 10/12/2007, -10/+8i still wonder why things like this are dugg so much. i mean, amazing. someone showcasing the use of tabs in a webpage. almost as unique as frames. but a website showing you how to use frames will never make it to the homepage... they're not that popular anymore. (this is a good replacement if you ask me)
yet im still wondering, why is something like this dugg? please, explain, really. i want to know why this is so unique and important? am i just a moron? justify your answers please. - Annon, on 10/12/2007, -2/+4looks pretty cool. The design of your site looks pretty cool, but gets really annoying after a while. Do you reall need to have a box that fades in over ever link that shows the first half of the url it goes to?
The menu at the top adds a description to the link, but come on... Hovering on Services reads "Information about the services I can provide." What else would you put on a Services link?
Don't sacrifice simplicity for over the top crap like that. - fatlip, on 10/12/2007, -7/+3this site is CRAWLING
- timbo1234, on 10/12/2007, -6/+1Well they work in my IE (using IE engine within Firefox).
- paulringo, on 10/12/2007, -3/+3yeah... its awesome how the banner image aligns incorrectly...
the menu's are cool, but the site is budget. - oni0n56, on 10/12/2007, -0/+2All the tabs work in IE, but theres a slight issue with the hover, just because of IE's bad support for !important. It can be fixed by re-ordering the CSS.
- subESC, on 10/12/2007, -7/+7Why are people getting modded down for simply stating that they liked this article.
- Genius16, on 10/12/2007, -3/+13because its unimportant and doesnt add anything to this digg's "content". by digging it you're saying you like it. no need to post "cool. +dugg" that does nothing but fill up the bbs.
- tehnico, on 10/12/2007, -6/+7Here's another reason, these tabs suck.
- bboyle18, on 10/12/2007, -4/+3I'm really that impressed. Its seems very buggy.
- Dangerman, on 10/12/2007, -0/+9Low quality, and to misquote the words of the great Zeldman:
'If you need !important, you have done something wrong.'
The portfolio isn't real, the basic structure fails in standards compliant browsers and the code is a mess.
The pngs are nice in a web 2.0 aqua glass aero facey sort of way.
Although the fade in titles indicate a lack of understanding with regard to affordances. If you need to out a big ole label that says what your link does, you haven't properly thought out the architecture and cues. A door doesn't require a sign that says 'turn knob to open' likewise your affordances should speak for themselves. Additional information design indicates lack of semiotic planning. mmmm....semiotic. - SpookyET, on 10/12/2007, -0/+9Not only that they do not work in IE, they also do not degrade well when you resize the text. So, No! It is not the ultimate tabbed menu.
- kerin, on 10/12/2007, -0/+3It doesn't just not work - the page is completely broken, with none of the content available at all. As this doesn't work in one of the few 'modern' browsers (Gecko, Safari/WebKit, Opera), this is far from 'the ultimate tabbed menu'.
- outbreak, on 10/12/2007, -1/+10doesnt work in safari.
- Annon, on 10/12/2007, -1/+3Confirmed here too.
- m242, on 10/12/2007, -0/+2Yes-- this site looks terrible in Safari.
- tehnico, on 10/12/2007, -1/+9Pfft, no digg.
Words should never jump, and if they do, they could at least maintain their position on the tab. The gradient background is directly halfway through the words, on the jump, the baseline is on the gradient change. So are the words tied to the Tab, or are they floating aimlessly? That's just my usability feedback, don't start me on the design. Cus the spacing is *****.
Why are all the comments of praise getting modded down? Cus these tabs don't deserve it. - accidental, on 10/12/2007, -2/+9Uh this isnt impressive whatsoever.
- Genius16, on 10/12/2007, -0/+1see my post above asking why people digg this stuff. asking for justified answers... to date, -2 diggs on it and nobody has responded. i guess people dont know why they're digging this?
- antdude, on 10/12/2007, -1/+4It doesn't seem to work well in Mozilla v1.7.12. :(
- HiddenPeanuts, on 10/12/2007, -1/+5It looks nice, but killing back/forward functionality is a deal-breaker. That's the same reason I hate flash pages.
- MarkoBarko, on 10/12/2007, -1/+1hmmmm....it's already been stated that it doesn't work in IE6....but...the tabs don't work in Firefox 1.5 for me...
- pfarrell4, on 10/12/2007, -1/+1All of them work great in IE, but half of them don't work for me in Firefox--the tabs just show up as a bulleted list.
- arizonagroove, on 10/12/2007, -1/+6Calling something 'The Ultimate [whatever]' just makes it sound lame. Ultimate implies that a better alternative will never come along, and that is very unlikely to be the case.
Good work speaks for it self. It doesn't need labels like 'Ultimate' or 'Awesome'.- mark1372, on 10/12/2007, -0/+1At least they didn't use the usual Digg submitter habit of excess exclamation marks with atrocious grammar: "Best tabbed menu ever!! ya u read that rite must read!!!!!lol"
I don't think it's "the ultimate" by any means and don't really get why people are digging this so much, but it's nice to have a proper description instead of sounding like a nine year-old on MSN Messenger wrote it. Though "synergistic synthesis" was a little pretentious.
- mark1372, on 10/12/2007, -0/+1At least they didn't use the usual Digg submitter habit of excess exclamation marks with atrocious grammar: "Best tabbed menu ever!! ya u read that rite must read!!!!!lol"
- wrinkles, on 10/12/2007, -1/+3The whole site craps out in Safari. "Professional Web Design"? It's a joke. I see he's hosting his clients on the same server that is being hosed by dig right now, I bet they will appreciate that.
- WATYF, on 10/12/2007, -1/+3I must be missing something. I tried it in IE6 and all I saw was a very plain, basic tabbed nav panel with nothing impressive to note (ooooh... the words moved up a few pixels on mouseover... that's "groundbreaking" :op). Then I tried it in Firefox (1.0) and it was even less impressive since the submenus wouldn't appear after clicking on a tab.
Can anyone tell me why this is so "ultimate" and what the big deal is?
No Digg
WATYF - toconnor, on 10/12/2007, -0/+2"modern web technology"? I'm sorry, but I don't see anything here that wasn't being done years ago.
- stevensj2, on 10/12/2007, -0/+0Agreed. I've been using this technique in all of my sites (and clients' sites) for at least 2 years now.
Although it is a great tutorial on a very nicely presented site, I'm not seeing anything new.
(Not to be a downer....just pointing out the title gives a false sense of something new and ground-breaking)
- stevensj2, on 10/12/2007, -0/+0Agreed. I've been using this technique in all of my sites (and clients' sites) for at least 2 years now.
- judgeFire, on 10/12/2007, -0/+3As a usability design tidbit, have you ever noticed how the Mac OS X menus don't fade in, but only fade out? And how Win XP menus do fade in, like this 'Ultimate Tabbed Menu' example?
If you want to wait for a menu to fade in, you're welcome, but generally that's pretty bad design.
J - wrinkles, on 10/12/2007, -0/+3Why are all the criticisms being modded down? I'm guessing someone with a vested interest in that junk is busy modding.
- BugMeNot2, on 10/12/2007, -0/+3Bad JPEG artifcacts on their header image.
lol. - lbermude, on 10/12/2007, -0/+2We really need an "no-digg" button......
- Digitalmafia, on 10/12/2007, -0/+2"Synergistic synthesis" - having worked and lived through the dot com bomb of the 90's any time I hear any thing that begins with Synergistic my skin crawls....I think the word alone caused the market to crash....its an evil word.
This sites "Ultimate Tabbed Menu" is about as Ultimate as the UMD is Universal. Nice job getting your 3rd grade site onto Digg and tossing yet another lame CSS Tab story into the ranks. I couldn't get myself to click on the "Tabtastic Demo (AJAX) link" for fear of mental castration. - V1ncent, on 10/12/2007, -0/+4Anyone that doesn't take into account IE, despite it's not following standards is implementing bad design right off the bat.
- MrDolomite, on 10/12/2007, -0/+5Dugg, reluctantly. Article is good, with technical details. Personally, however, I hate websites that use these. Fumbling with the mouse to get the damn menu to reappear is a pain!
- mark1372, on 10/12/2007, -0/+2Not only that, but having to WAIT while each tab fades in and out and then read an unnecessary URL in the each description (why?). Why is this being dugg when there are loads of better examples?
- souc0011, on 10/12/2007, -0/+2Um...its a menu. Just a menu. Nothing special about it. And as a web designer I can say with confidence that this is lame. Tabs are so 1998.
- kenwestin, on 10/12/2007, -0/+4No digg. In order for something like this to be useful to folks it needs to be cross browser compatible. The site itself doesn't even work in IE.
- rino, on 10/12/2007, -0/+1The thing I don't like is how the "tabs" have a hover element which appears as if you should mouse down and click on it... but it disappears. It's a usability problem.
- Slipdisc, on 10/12/2007, -0/+2marked as lame
- spyres, on 10/12/2007, -0/+3lame and a dupe I believe.
- raremage, on 10/12/2007, -1/+2Also a shameless plug. I especially like when the author of the site (who is the same as the poster of this item) argues with comments. Afraid I just can't Digg this.
- webgodjj, on 10/12/2007, -0/+1Ya.... They should have tested the menu system on other browser's before calling it ultimate. In fact it would have been nice to test their own website as well...
- ForbesBingley, on 10/12/2007, -1/+4"because its unimportant and doesnt add anything to this digg's "content". by digging it you're saying you like it. no need to post "cool. dugg" that does nothing but fill up the bbs."
Net Nazis strike again.
Get a grip. Get a perspective.
Better yet, get a *****' life.
Poncing around with 'bbs' politiks .. eh? Who do you people think you are?
Please note: if you value your right to an opinion .. look elsewhere. Digg.com is no longer the venue for such things... - coffeegeek, on 10/12/2007, -0/+1All I have to say is Synergistic Synthesis? This guy watches The Office too much.
- alexisthemovie, on 10/12/2007, -0/+1@ raremage, i know both the submitter and author of the site and i can gaurentee you that they are not the same people.
Digg is coming to a city (and computer) near you! Check out all the details on our 
© Digg Inc. 2008 —
Content posted by