Semantic vs. valid markup

Scott Pennington of Matrix at Michigan State University emailed an interesting link to me. The SimpleBits blog has a post and discussion of semantic markup of a page heading. A fairly elementary quiz starts it off, but the range of perspectives in the discussion starts to show the complexity of semantic markup.

On the one hand, if something is a paragraph, mark it up as a paragraph. If it is a list, mark it up as a list. Pretty straightforward.

But, semantic markup is not the same as valid markup. You can write markup that is perfectly valid, but not at all semantic.

For instance, when I worked at Michigan State University I was working on a pretty large web project, and we had just deployed a near-final version as most of the team went on a holiday break. While on vacation I got a few calls: one from my boss and another from a consultant they were bringing in to do a little more work.

I figured everything was fine, but when I came back I found out that all of the semantic, valid paragraph markup in the web site had been replaced with double line breaks between “paragrahs.” There wasn’t an actual paragraph left in the whole site. Sure, visually there was, but in terms of semantic markup, they had vanished.

Upon asking the rationale, the answer was that line breaks gave you more control over spacing between page elements. Anyone who has a clue will realize, of course, that you don’t control spacing on web sites with line breaks, you control it with CSS.

After trying to explain the issues to my boss, I ended up having to live with the non-semantic markup. The issue was deemed as a difference of opinion between two programmers, and neither position was wrong. How very diplomatic. I personally think it devalued the end product we gave the client.

This was just at the beginning of semantic markup becoming a big issue in the web community, so I had very little literature or other examples to draw upon. I feel somewhat validated as my stance on the issue has since been backed up by some of the leading names in the web field.

Author: Davin Granroth

Davin is Chief Operating Officer for Covenant Eyes, Inc. in Owosso, MI, USA, where he gets to mix his background in user experience design, research, and strategy with the operation of a software company. For more, see his LinkedIn profile.

Leave a Reply

Your email address will not be published. Required fields are marked *