Should I use an image map to build my header?

ronaldroe

Super Moderator
Staff member
And the reasons why not are?

Well, if you're building websites in 1997, I guess there's no reason not to.

Aside from that, you're talking bloated code, large image downloads, a pain in the ass to update, and no navigation whatsoever if the image fails to load.
 

CaldwellYSR

Member
Well, if you're building websites in 1997, I guess there's no reason not to.

Aside from that, you're talking bloated code, large image downloads, a pain in the ass to update, and no navigation whatsoever if the image fails to load.

Yep... this one
 

ronaldroe

Super Moderator
Staff member

LOL. That's pretty funny. One article's date just shows up as "pre 2006" and the other 2 are about using CSS to replace image maps, including the ALA article from 2003!. So, I guess maybe not 1997, but grossly out of date for sure.

EDIT: Upon reading the "pre 2006" article further, it's also about creating an imagemap-type effect using CSS.
 
Last edited:

chrishirst

Well-Known Member
Staff member
Certainly but it does not mean that image maps should be subject to the same designer/developer "snobbery" as frames or tables are, or how XHTML is what all document should be using.

Image maps serve a purpose and to not use them simply because it's "old hat" actually goes AGAINST the "semantic coding" philosophy, where the object of the exercise is to use the correct concept (or element) for the purpose it was intended.
 

ronaldroe

Super Moderator
Staff member
Image maps serve a purpose and to not use them simply because it's "old hat" actually goes AGAINST the "semantic coding" philosophy, where the object of the exercise is to use the correct concept (or element) for the purpose it was intended.

You aren't entirely wrong on your point. Remember, though that also under the idea of semantics that content, display and interaction should be separated. Image maps don't separate content and display. In fact, they put both content and display in HTML and make interaction much more difficult. It isn't "snobbery", as you put it. It's a well thought out position based on the same best practices you subscribe to...perhaps delivered with just a slightly snobbish undertone. ;)
 
Last edited:

chrishirst

Well-Known Member
Staff member
It's a well thought out position based on the same best practices you subscribe to...perhaps delivered with just a slightly snobbish undertone.
Yes, I accede on that, perhaps the snobbery is implied rather that any real "one upmanship" attitude.
 

Phreaddee

Super Moderator
Staff member
speaking of semantic coding and separating content and style. I'm a little perplexed with a situation such as
HTML:
<h2></h2>

Code:
 h2:before { content: 'Header 2'; }
Clearly this is content within CSS, and although I can see some usage benefits of doing so, is it actually wise to do this?
 

CaldwellYSR

Member
speaking of semantic coding and separating content and style. I'm a little perplexed with a situation such as
HTML:
<h2></h2>

Code:
 h2:before { content: 'Header 2'; }
Clearly this is content within CSS, and although I can see some usage benefits of doing so, is it actually wise to do this?

The only use I've found for :before and :after is clearing floats with the :after one...
 

ronaldroe

Super Moderator
Staff member
speaking of semantic coding and separating content and style. I'm a little perplexed with a situation such as
HTML:
<h2></h2>

Code:
 h2:before { content: 'Header 2'; }
Clearly this is content within CSS, and although I can see some usage benefits of doing so, is it actually wise to do this?

The idea is to use it for content that is part of the display. Sounds like an oxymoron, but it isn't. In your example, if you're "styling" a level 2 header with the label "Header 2", then it would be a valid usage.

Also, consider this example site I made some time ago: http://roedesigns.com/clients/emily/

The branches on either side of the nav are :before and :after (except in IE, for which there are conditional comments that place them there). It's content, yes, but used for display purposes.

The question I have is about some of the new CSS3 effects. Many if not most are used solely for interaction, which should be JS...
 
The question I have is about some of the new CSS3 effects. Many if not most are used solely for interaction, which should be JS...

Yeah, thought crossed my mind on those but hey, I DO like the fact that some of the interactions will be still working if someone has javascript turned off, its a nice fallback.
 
Top