Tabs, Tabs and Tabs

How would you do them?

[le_gber]

Currently working on a new site / project and I'm going to have amazon style tabs at the top.

Been reading 'don't make me think' second edition and it seem to fit with the general idea that tabs are good if used properly and people know what they are.

BUT how would you do them?

Would you use the CSS sliding door technique or plain images?

The site will be CSS2 / XHTML 1.0 Strict / table-less and as semantic as possible.

The problem I have with the sliding door technique is that if the text is increased too much the tabs run over the site logo and the whold nav breaks up. Also the rollover doesn't seem to work in IE if you keep the code semantic - no use of <span> in <li> for no reason.

The problem I have with images is that they are ... <img> :) - I haven't used the <img> tag for the main nav for at least two years. For accessibility and SEO purposes I'd rather use images.

Thanks for your feedback.

le_gber

[limbo]

The sliding door technique is great - just give you self a bit of room to make it work on reasonably large text sizes and offer a high contrast/large font version for those without 20x20 (myself included)

I don't think that you should drop the idea for beautiful rollovers because of a small proportion of users who adjust text sizes to extremes using their browser - if you start down that route you may as well ditch 'layout & design' and go for the 'neilsen' look.

It's a judgement call - I design for the average Joe keeping everyone else in mind...

[le_gber]

limbo - thanks for your comments. I've checked IE 7 and it seem to support the semantic version of the sliding doors technique.

so I guess +1 for sliding doors.