Information Technology Reference
In-Depth Information
In unserem Fall definiert
header
in Kombination mit dem Logo als
img
-Element
sowie zwei Headings (
h1
und
h2
), die von einem
hgroup
-Element umschlossen
werden und den Blogtitel sowie einen Untertitel enthalten, die Kopfzeile des
HTML5-Blogs.
War es in der bisherigen Praxis durchaus gebräuchlich,
h1
- und
h2
-Elemente
direkt untereinander zu schreiben und damit Titel und Untertitel anzudeuten,
so ist dies in HTML5 nicht mehr erlaubt. Zur Gruppierung solcher Headings
muss jetzt
hgroup
verwendet werden. Der Gesamtrang des
hgroup
-Elements
ergibt sich dabei aus dem höchsten vorkommenden Heading. Zwar dürfen auch
andere Elemente innerhalb von
hgroup
vorkommen, der Regelfall wird aber
wohl das Kombinieren von
h1
- bis
h6
-Tags bleiben.
Ein kleines, aber bedeutsames Detail können wir der Markup-Spezifikation
entnehmen:
header
sind, wie alle anderen strukturgebenden Elemente per Vor-
gabe als
display: block
in CSS zu formatieren. Damit können auch Browser,
die mit den neuen Tags nichts anfangen können, dazu
überredet
werden, das
jeweilige Element richtig darzustellen. Ein paar Zeilen Code reichen aus, um
dem Internet Explorer 8 zum Beispiel unser neues
header
-Element beizubrin-
gen:
<!--[if lt IE 9]>
<script>
document.createElement("<header");
</script>
<style>
header { display: block; }
</style>
<![endif]-->
Selbstverständlich gibt es für diesen Workaround auch eine ausgefeilte
JavaScript-Bibliothek, die nicht nur
header
, sondern auch viele andere neue
HTML5-Elemente abdeckt. Remy Sharp stellt sie unter
http://code.google.com/
p/
html5shim
/
für den Internet Explorer
zur Verfügung.
HINWEIS
Der Ausdruck
shim
bezeichnet in der Computersprache einen Kompatibilitäts-
Workaround für eine Applikation. Vielfach wird fälschlicherweise auch
shiv ver-
wendet - ein Begriff, den John Resig, der Erfinder von
jQuery
, in einem gleich-
namigen Posting geprägt hatte (
http://code.google.com/p/html5shim/). Ob er in
Wirklichkeit
shim damit meinte, bleibt unklar…
