HTML5 ist die neueste Version der Markup-Sprache, mit der die älteren Versionen HTML 4.01, XHTML 1.0 und XHTML 1.1 abgelöst werden sollen. Obwohl die Entwicklung noch nicht abgeschlossen ist, sind viele HTML5-Elemente schon jetzt einsetzbar. Zeit also, die Neuerungen zu erkunden und sich fit für die Zukunft zu machen.
Um Websites anzeigen zu lassen, die in HTML5 geschrieben wurden, brauchen Besucher lediglich einen modernen Webbrowser. Die jüngsten Versionen von Apple Safari, Google Chrome, Mozilla Firefox und Opera unterstützen bereits viele HTML5-Funktionen. Mobile Webbrowser, die auf iPhones, iPads und Android-Handys von Haus aus installiert sind, bieten exzellente Unterstützung für HTML5. Auch Microsoft hat angekündigt, dass die anstehende Version 9 des Internet Explorer einige HTML5-Funktionalitäten unterstützen wird.
HTML5 ist glücklicherweise weitgehend rückwärtskompatibel, d.h., auch User, die eine HTML5-basierte Seite mit älteren Browsern ansteuern, können sie ansehen und nutzen. Die neuen HTML5-Funktionen setzen auf bestehenden Funktionen auf und ermöglichen es so, Ersatzinhalte für ältere Browser anzubieten.
Die wichtigsten Neuerungen in HTML5 auf einen Blick
Neue semantische Elemente: Schon seit Langem gibt es Bestrebungen und Initiativen, die sich dafür einsetzen, semantischen Code zu schreiben und bestimmte Bereiche einer Website stringent mit den dafür vorgesehenen Elementen auszuzeichnen. Zusätzlich zu den bestehenden Elementen wurden in HTML5 Tags für bestimmte, häufig genutzte Seitenbereiche wie <header>, <footer> und <section> ergänzt.
Canvas: Das <canvas>-Element gehört zu den spannendsten neuen Features von HTML5. Streng genommen sorgt es lediglich dafür, dass eine leere Zeichenfläche in eine Website eingebunden wird. Auf dieser Fläche lassen sich dann aber mithilfe von JavaScript beliebige Diagramme, Grafiken für Spiele oder Videos erstellen und sogar animieren. Um sich einen ersten Eindruck darüber zu verschaffen, gibt es unter http://html5demos.com/canvas ein Beispiel für das <canvas>-Element.
Video: Mithilfe des ebenfalls in HTML5 neu hinzugekommenen <video>-Elements lassen sich Videos in Websites einbetten – ganz ohne externe Plug-ins wie Apple QuickTime oder den Adobe Flash Player.
Geolocation: Die neue Geolocation-API ermöglicht es, einer Website den Aufenthaltsort eines Besuchers mitzuteilen, der mit einem mobilen Gerät darauf zugreift. Auf diese Weise können ortsgebundene Services angeboten und dem Nutzer der Website beispielsweise Geschäfte in seiner Nähe oder seine Position auf einer Karte angezeigt werden. Ein Beispiel für die neue Geolocation-API gibt es unter http://html5demos.com/geo.
HTML5 Storage: HTML5 Storage (auch Local Storage genannt) bietet Websites eine Möglichkeit, Daten auf dem Rechner eines Besuchers zu speichern und später wieder abzurufen. Ähnlich wie bei Cookies bleiben diese Daten erhalten, wenn der Besucher die Website verlassen hat oder den Browser schließt. Anders als bei Cookies werden diese Daten jedoch nicht an den Webserver zurückgespielt.
Offline-Webanwendungen: Mit HTML5 haben Sie die Möglichkeit, Websites zu entwickeln, die auch offline nutzbar sind. Dafür muss Ihr Webserver dem Browser des Besuchers lediglich mitteilen, welche Dateien er hierfür laden muss. Eine Synchronisierung der Daten erfolgt automatisch, sobald der User wieder online ist.
Mikrodaten: Mit ihnen können Sie Ihre Website mit zusätzlichen semantischen Informationen ausstatten und beispielsweise Ihre Kontaktdaten in eine vCard umwandeln.
Verbesserungen für Formulare: Die Usability von Formularen lässt sich dank HTML5 deutlich verbessern. So können Sie beispielsweise Platzhaltertext in Webformulare aufnehmen, der den Nutzern verrät, welche Informationen an dieser Stelle eingegeben werden sollen. Oder Sie nutzen die Autofokusfunktion, die den Cursor des Besuchers automatisch im ersten Eingabefeld eines Formulars platziert.
Wer sich einen Eindruck darüber verschaffen möchte, was noch mit HTML5 möglich ist, und etwas Entspannung sucht, ist auf der Seite http://html5games.com genau richtig. Hier gibt es eine große Auswahl von Browsergames, die mithilfe von HTML5 entworfen wurden.
Neugierig geworden? Dann werfen Sie einen Blick in unser Buch „Durchstarten mit HTML5“ von Mark Pilgrim. Es richtet sich an Webentwickler, die bereits HTML-Kenntnisse mitbringen und sich ganz auf die Neuerungen von HTML5 konzentrieren wollen!