Pardon me for a moment while I stroke my ego a little. About two years ago I designed a contextual carousel for Download.com Music. Across the top were tabs with genre names, and within each genre was a featured artist and four others that you could view. Mousing over the list swapped the featured (large view) artist with the one under your mouse. It looked like this:

One of its traits was that it remembered which genre you last clicked on (a cookie) which meant that if you were a Jazz fan, the next time you visited you’d get a page full of jazz content right up front. Call it cheap personalization.Last fall Download.com started adding a bunch of carousels in the same vein that mp3.com and tv.com and others around the network (including the CNET front door) have been sporting: carousels that have 5 items, numbered 1-5, that cycle.

My problem with these are:

• They offer no context for each item. The number “3″ doesn’t mean anything to me, and is far less likely to inspire me to click on it than, say “cellphones” or “browsers” or “jazz”.
• The argument for these generic lists is that you can put anything in them, but if you built the tabs using css, you could easily have the names on the tabs change. As it is, you’re stuck with 1-5, and the layout itself is used to feature big images as features rather than collections around a topic.
• They don’t offer that opportunity for that cheap personalization.
• The way we use them, we usually feature large graphics. Producing these is a challenge, and so we only produce a few a day (if that). This means that if we, say, know something about that user (they want cellphones) we can’t just pull content out of the database to show them targeted features, because we don’t have these slick images for every product or whatever.

So Yahoo, launches it’s new home page, and the carousel it’s sporting has almost exactly the features that mine did two years ago:

I like that each tab isn’t a number; it’s a topic. I like that each item in each tab features four features on that topic (clicking on any one of the sub feature links swaps out that feature into the bigger image and copy above it). I like that the content featured contains more than one link to topics in that context.So I’ve emailed a few people to see if we can’t A/B this kind of carousel against what we have now. Another option would be to let the user choose which tabs are visible – something like this:

Or something like this:

On a related note, here’s a post from ajaxian about someone who has released a little cookie-cutter library for making these things using ajax. If we implemented it, we’d probably write it ourselves, but I might as well share.

Ajax Tabs Content script

DynamicDrive.com has provided yet another helpful script today in the form of this download – an ‘Ajax tabs content script’. The script makes it simple to grab content from extern files (in the same domain, of course) and pull them into a simple tabbed interface right there on the page.

We got our inspiration for this script from Yahoo’s new homepage, which employs such a concept to show news in an organized fashion.

As you can see, this Ajax Tabs Content script was designed to be much more than look pretty, but usable. FYI its CSS tabs interface is plucked directly from Shade Image Tabs Menu, which is easily swappable with another CSS menu of your choice. See how it all comes together like that?

They show an example of the script in action and give you complete details on how to implement it, including the download with all of the files (including sample pages and images) that you�ll need. The tutorial portion covers both the use of a single tab and multiple tabs on the page, depending on your needs.