(Dies ist der erste Teil der Artikelserie "HTML5". Hier gehts zum zweiten Teil>>)
Änderungen am Grundgerüst
Die erste Zeile eines HTML5 Grundgerüsts wird ein wenig übersichtlicher als bisher. Diese sieht nun wie folgt aus:<!DOCTYPE html>Der Bodybereich wurde ebenfalls stark aufgeräumt. So kann nun auf DIVs verzichtet werden - stattdessen kommen neue Strukturelemente zum Einsatz.
<html lang="de">
Eine HTML5 Webseite ist also von oben nach unten wie folgt aufgebaut:
<header>Der Header kennzeichnet wie gewohnt den Beginn eines Dokuments mitsamt den dazugehörigen Tags.
<nav>Innerhalb das Nav-Bereichs wird die Navigation in Form von Listen (<ul> oder <ol>) oder Tabellen (<table>) angeordnet.
<section>Dieses Tag unterteilt die Webseite in verschiedene Sektionen. Bisher wurden hier DIVs mit diversen Klassen bzw. IDs genutzt. Dies kann nun entfallen. Ausserdem erlaubt es einem, den Artikel semantisch besser einzuteilen.
Auch das
<article>Tag wird zukünftig die DIVs einsparen. Hiermit wird ein Artikel gekennzeichnet (z.B. in Blogs).
Mithilfe von
<aside>wird den Suchmaschinen bei der Gliederung einer Webseite geholfen. So werden Sidebars gekennzeichnet, welche oftmals Werbung oder ähnliches enthalten, und mit dem eigentlichen Inhalt nichts zu tun haben. Schon jetzt ist bekannt, dass Google Webseiten nach dieser Schematik bewertet - was bisher aber eine absolut geringe Rolle spielt.
Letztendlich wird der abschliessende Footer einer Webseite durch das HTML5-Tag
<footer>gekennzeichnet.
HTML5 und Multimediale Elemente
Doch dies sind bei weitem nicht die einzigen Neuerungen der zukünftigen Seitenbeschreibungssprache. In einem weiteren Artikel werde ich auf die Verwendung von multimedialen Elementen eingehen. Im dritten Artikel gehe ich dann auf neue Style-Möglichkeiten ein.Im abschliessenden Artikel werde ich dann ein komplettes HTML5 Gerüst präsentieren.
Haben Sie wünsche für die weiteren Artikel dieser Artikelserie? Verwenden Sie vielleicht schon HTML5 und möchte Ihr Wissen mit anderen Usern teilen? Schreiben Sie dies einfach in ein Kommentar!
