Web design: HTML5 is a W3C Recommendation
HTML5 became a W3C recommendation last week (28 October 2014). Therefore I have now changed the doctype of my main websites from XHTML 1.0 Strict to HTML5. Since I have been thinking in terms of the HTML5 semantics a long time, only very minor changes had to be made in order to make the pages make full use of the new language. Besides changing the doctype, I have performed substitutions such as <div id="footer">
to <footer>
. Indeed, the main benefit of the new doctype is that I can use the new HTML5 semantic elements, such as <header>
, <footer>
, <main>
, <nav>
, and <article>
, to make the markup more semantic. For instance, consider the main layout of a typical web page on this site:
The markup of this body is now
<header>
<div id="chlang"></div>
<div id="logobar"></div>
<nav></nav>
</header>
<main>
</main>
<footer>
</footer>
Recall that the <nav>
contains an unordered list of list items, each being a hyperlink.
In addition, the News page, which contains a number of articles, makes perfect use of the <article>
and <header>
elements:
<main>
<h1>News</h1>
<article id="ITEM208">
<header></header>
<p>Body text...</p>
</article>
<article id="ITEM207"></article>
<article id="ITEM206"></article>
<article id="ITEM205"></article>
<article id="ITEM204"></article>
...
</main>
(Recall that each article header contains a heading and a metadata name–value DL.)
Of course, HTML5 has many more benefits in addition to the semantic elements listed above. For instance, I can now use the <video>
element to embed videos. I have actually already done so for quite some time on a small number of pages, but not until now will pages with such content validate.