HTML5. Do like.

11.02.2010

Es gibt mehr semantisch-wohlklingende Elemente, wodurch sich Quelltext besser lesen lässt. Damit gewinnt man mehr Übersicht und findet sich besser zurecht. Weniger <div>s, hooray! Von woorkup.com gibt es ein Cheat Sheet für HTML5; wobei das vorige mir besser gefällt.

So sind derzeit meine Blogeinträge aufgebaut:

<article class="post" id="post-504">
	<header>
		<h2><a href="…">HTML5. Do like.</a></h2>
		<span>? <a href="…">Informatik</a></span>
	</header>

	<div class="content">
		<p>Es gibt mehr semant… [Endlosrekursion voraus!]</p>
	</div>

	<footer>
		<a class="comments" href="…">0 Kommentare</a>
		<time datetime="2010-02-11">11. Februar 2010</time>
		<span class="author"> … </span>
		<span class="tags"> … </span>
	</footer>
</article>

Und das größere Bild:

<DOCTYPE html>
<html>
<head> … </head>
<body>

<header id="top"> … </header>

<aside id="icons"> … </aside>

<section id="middle">

	<aside id="sidebar"> … </aside>

	<section id="posts">

		<article class="post" id="post-504"> … </article>
		<article class="post" id="post-503"> … </article>
		<article class="post" id="post-502"> … </article>

	</section>

</section>

<footer id="meta"> … </footer>

</body>
</html>

Ja, <DOCTYPE html> ist der gesamte Doctype, mehr gehört nicht dazu. Mehr nicht! Mit steigender Unterstützung von HTML5 in modernen Browsern, wagt auch YouTube den langsamen Umstieg auf das neue <video>-Tag als Ersatz für den momentan noch eingebundenen Flashplayer. Wer das mal sehen möchte, kann auf youtube.com/html5 das soon-to-be YouTube ausprobieren.