1
|
Continuing this week's Tutorial 'o the Day theme of XHTML, today's focus is semantics.
Semantics refers to the meaning of an element and how that meaning describes the content it contains. Probably the easiest example is an html list. The following two snippets of code can be displayed identically in a browser:
<pre><code><p>list item <br />
list item </p>
</code></pre>
<pre><code>
<ul>
<li>list item</li>
<li>list item</li>
</ul>
</code></pre>
While to the human eye these may look the same, the later actually conveys information about what it is through the markup --i.e. it's a list.
While good semantics aren't necessarily a feature of XHTML (they're important even in HTML) as long as you're re-coding you may as well start using semantically meaningful markup.
If you'd like to see some bad semantic markup just view source on this page. Note how the post title is encoded:
<span class="title">Tutorial 'O The Day: XHTML</span><br>
Because we can use visual clues like font size and typeface to help us, most humans can find the title fairly easily, but what if you're a silly robot, like a search engine spider? You'd have no clue that this line of code is the title of the post.
Why should you care?
Do you like your pages to rank high in search engine indexes? Well, then you should care because robots rely on tags to tell them what is the main focus of the page. In the case of the Wired blog templates, our content is semantically no different than the ads being served with it.
That, as my friend likes to say, = bad.
So what should the post title be wrapped in? Well something like <code><h1>Title</h1></code> would be one option.
To get up to speed on the usefulness of semantically meaningful XHTML, check out the article, [*Semantics, HTML, XHTML, and Structure*][2] over at Brainstorms & Raves, which gives a through rundown of how, when and why to use various (X)HTML tags. Also a good read: Molly Holzschlag's [tutorial][1] on informit.com.
And since we're talking about semantics let me clarify one point, while you can and should try to write semantically meaningful XHTML, XHTML is not *technically* a semantic language. Because it isn't a true semantic language, there's lots of gray areas where several tags may both be legitimate choices.
Web designer and author Dan Cederholm ran a [series of articles][3] a while back that attempt to parse out the gray, but as the the comments on his site demonstrate, some things will always be debatable.
[3]: http://www.simplebits.com/notebook/simplequiz/index.html "SimpleQuiz Archives"
[2]: http://brainstormsandraves.com/articles/semantics/structure/ "Semantics, HTML, XHTML, and Structure"
[1]: http://www.informit.com/articles/printerfriendly.asp?p=369225&rl=1 "The Meaning of Semantics (Take I)"
|
