After finishing the excellent HTML5 for Web Designers by Jeremy Keith and A Book Apart, I decided to dive in head first.
My first foray was with my Design Swap, and my current adventure is in progress with redesigning this site. The new semantics are one of the hardest parts to wrap my mind grapes around. I was always pretty content with XHTML 1. Specific enough that I could mark up most text with appropriate meaning, yet vague enough that I wasn’t locked into any unfavorable structure. And I got used to it.
My current dilemma is with
<mark>. The spec calls it a “a run of text in one document marked or highlighted for reference purposes, due to its relevance in another context,”… whatever that means. Jeremy recommends it for found terms within search results and quickly admits he’s hard-pressed to find another applicable scenario. And if Jeremy says anything about markup, it’s probably true. But, I think I’ve found a new use for
<mark>, though I’m not quite sure.
In general, I mark up my navigation as a list, specifically an unordered list. I’ve seen most people use a particular
class name like “current” to indicate what section you’re in. However, I’m not satisfied with this because it only denotes a visual distinction. I believe it’s meaningful to content and therefore deserves some distinction in the markup. Instead of something like this…
<li class="current"><a href="/about/">About</a></li>
…I’m more prone to do…
I believe it creates a meaningful distinction in the structure. However, I’ve never felt that strong communicates the semantic value perfectly. It gets close, but isn’t exactly right.
<mark> in HTML5. Now, I can say...
And I think that’s the best version yet.
What do you think? Have I missed the