senäh

17senäh und so…

HTML/CSS/JS
12. Okt 2011
Kommentare: 0

Was ist HTML5?

Kategorien: HTML/CSS/JS | 12. Okt 2011 | Kommentare: 0

Angestachelt durch meine Bachelorarbeit und einem Vortrag musste ich mich mit der Erklärung von HTML5 auseinander setzen. Die Frage nach einer Definition von HTML5, die oberflächlich betrachtet leicht zu beantworten ist („HTML5 ist halt die Fortsetzung von HTML4!“), besitzt im Detail einige Fallstricke. In verschiedenen Kontexten wird HTML5 anders verwendet und der enthaltene Funktionsumfang variiert. Deswegen werde ich meine (unvollständigen?) Rechercheergebnisse mit euch teilen und euch eine nützliche Linkliste für den Einstieg in HTML5 geben.

Grob betrachtet, lassen sich zwei Erklärungen für HTML5 finden. Es gibt die HTML5 Spezifikation bzw. den eigentlichen HTML5 Standard und es gibt das Schlagwort HTML5.

HTML5 als Spezifikation

Die HTML5 Spezifikation ist eine Möglichkeit HTML5 zu definieren. Leider, leider gibt es aber nicht DIE eine Spezifikation, sondern gleich zwei. Wer sich mit der geschichtlichen Entwicklung von HTML5 auseinandersetzt wird herausfinden, dass zwei verschiedene Institutionen an der Entwicklung eines neuen HTML-Standard beteiligt waren: W3C und WHATWG.

Beide Institutionen werkelten an HTML5 – teilweise unabhängig voneinander, teilweise miteinander. Auf diese Weise entstanden zwei verschiedene Spezifikationen, welche sich größtenteils gleichen, aber in einigen Punkten auch unterscheiden. So liegen die Spezifikationen der Web Workers API bei WHATWG innerhalb der HTML5 Spezifikation, aber bei W3C in einer eigenen Spezifikation.

Hinzukommen einige HTML5-nahe Spezifikationen, welche häufig im Zusammenhang mit HTML5 genannt werden, obwohl sie streng gesehen nicht zur HTML5 Spezifikation gehören. Zu diesen zählt bspw. die Geolocation API.

Hier findet ihr die jeweiligen HTML5 Spezifikationen, welche alle Informationen für Entwickler bereithalten:

HTML5 als Schlagwort

Weit geläufiger, wenn auch unpräziser, ist die Verwendung von HTML5 als Schlagwort. Da die meisten Leute, wenn sie über HTML5 sprechen das Schlagwort meinen und nicht die Spezifikation, sollten sich Entwickler auch (oder besonders) mit diesem auseinander setzen. Eure Kunden werden in den wenigsten Fällen wissen was W3C oder WHATWG bedeuten, deswegen müsst IHR den Unterschied der Spezifikation und dem Schlagwort kennen. (Ja, ihr!)

Was bedeutet „HTML5 als Schlagwort“ jetzt aber genau? Die meisten Leute fassen den Begriff HTML5 über seine Spezifikationen hinaus und fügen in unterschiedlichem Maße weitere offene Standards hinzu.  Daraus ist ein teilweise undurchschaubares Kuddelmuddel entstanden. Wie kam es dazu? Dafür gibt es viele Gründe zu denen Unwissenheit, aber auch Bequemlichkeit gehören. So nützt mir das feinste Canvas-Tag (ein Teil der HTML5 Spezifikation) nichts ohne die Manipulation dessen durch JavaScript (kein Teil von HTML5). So ist es in vielen Fällen unvermeidbar HTML5 in einem Atemzug mit JavaScript zu nennen. Hier hätten wir unsere Bequemlichkeit. Dann gibt es da aber noch die Unwissenheit, welche durch falsche Informationen über HTML5 in verschiedenen Blogs geschürt wurde. (Gut möglich, dass ich gerade dazu beitrage. Wenn ihr Fehler entdeckt, meldet euch bitte in den Kommentaren!) Zu dieser Unwissenheit führte W3C teilweise selbst, als sie das missverständliche HTML5 Logo veröffentlichten. So sollte dieses nicht nur HTML5 repräsentieren, sondern noch zahlreiche weitere offene Standards wie SVG oder CSS3. Durch lautstarke Empörung der Entwickler über diese schwammige Eingrenzung wurde die Definition des HTML5 Logos mittlerweile angepasst, aber die alten Spuren sind immer noch sichtbar. So wird auf der Seite des HTML5 Logos CSS3 fälschlicherweise als Teil von HTML5 beworben.

HTML5 Logo

HTML5 Logo

Mihai Florin Ionescu von Google bringt es auf den Punkt: „What is HTML5? We all know it is a W3C standard proposal, but you like to think of it as a generic name for the open web. A collection of open web standards.“

Nach meiner Erfahrung sehen viele Entwickler HTML5 als Zusammenfassung der HTML5 Spezifikation, von CSS3 und von JavaScript.

Was ist HTML5 nun?

HTML5 lässt sich am besten an all den neuen Möglichkeiten erfassen, die der Standard bietet. Ich möchte jetzt aber nicht versuchen all diese Möglichkeiten aufzuzählen. Damit laufe ich nur Gefahr, dass ich irgendetwas vergesse. Außerdem haben schon viele andere vor mir diesen Versuch gestartet. Im Internet werdet ihr viele dieser Auflistungen finden, welche sich aber fast immer in einigen Punkten unterscheiden. Wundert euch nicht weiter darüber! Bei den ganzen HTML5-nahen Spezifikationen und den Unterschieden zwischen den W3C- und WHATWG-HTML5-Spezifikationen sind einige Features einfach Auslegungssache und es bleibt dem Autor überlassen, ob er diese zu HTML5 zählt oder nicht.

Damit ihr nicht lange bei Google nach einer Übersicht suchen müsst, empfehle ich euch den Artikel „Get familiar with HTML5!„. Dieser listet die neuen Features von HTML5 nicht nur auf, sondern erklärt diese kurz und gibt ggf. Infos darüber, ob sie zur eigentlichen HTML5 Spezifikation gehören oder nicht. Außerdem finden sich zu jedem Punkt mindestens ein weiterführender nützlicher Link.

Das reicht euch nicht? Na gut. Am einprägsamsten sind ja immer praktische Beispiele. In diesem Fall empfehle ich euch html5demos.com. Hier sind einige einfache HTML5 Demos aufgelistet, welche ihr schön übersichtlich nach verschiedenen Features filtern könnt.

Das reicht euch immer noch nicht? Ihr wollt auch noch Code-Beispiele? Ihr seid unersättlich! Aber auch da kann ich euch helfen. Schaut euch einfach die interaktive Slideshow von HTML5 Rocks an. Diese bietet einen perfekten Einstieg, wenn ihr gleich mit programmieren beginnen möchtet.

Folie aus der HTML5 Rocks Slideshow

Folie aus der HTML5 Rocks Slideshow

Das reicht euch trotzdem immer noch nicht, weil ihr alte Hasen seid und lieber die direkten Unterschiede zu HTML4 sehen wollte? Here you go.

Hand auf’s Herz. Ihr wollt die Crème de la Crème der HTML5 Einführungen in einem schönen übersichtlichen Design? Dann kommt ihr nicht an Dive into HTML5 von Mark Pilgrim vorbei. (Diese Seite scheint momentan down zu sein. Hier findet ihr eine gespiegelte Version.)

Und nun?

Da ihr jetzt theoretisch wisst, was HTML5 ist, könnt ihr HTML5 praktisch einsetzen. Zumindest theoretisch (pun intended). Denn das alles nützt euch nichts, wenn euer Browser das jeweilige HTML5 Feature nicht kennt.

Zum Glück gibt es caniuse.com, wo ihr nachschlagen könnt, welche Browser welche HTML5 Features unterstützen. Dank der Bibliothek Modernizr könnt ihr sogar zur Laufzeit herausfinden, ob der jeweilige Browser eurer Nutzer ein bestimmtes Feature unterstützt. Wird ein Feature einmal nicht unterstützt, findet ihr vielleicht ein Polyfill als Fallback.

Ich hoffe, ihr bekommt jetzt ein Gefühl dafür was HTML5 ist und könnt langsam damit beginnen HTML5 in euren Projekten einzusetzen. Solltet ihr euch immer noch unsicher sein, was HTML5 bedeutet, lasst den Kopf nicht hängen. Meiner Meinung nach gibt es nicht die eine große Erklärung für HTML5. Es kommt immer auf den Kontext an.

Ciaosen!

Update vom 3. November 2011

Ich bin heute über drei sehr nützliche Links gestoßen, die einiges zur obigen Problematik beitragen. Sie beschäftigen sich damit, dass WHATWG ihre HTML5 Spezifikation mittlerweile als HTML Living Standard bezeichnen und inwiefern es sinnvoll sein könnte, die Versionierung von Standards durch das eben genannte Verfahren der Living Standards zu ersetzen. Anders formuliert ist dies die Frage, ob die W3C zu Zeiten der WHATWG noch Sinn macht und ob nicht Browserhersteller allein über Standards entscheiden sollten. In dem Zusammenhang wird detailliert auf die Unterschiede zwischen WHATWG und W3C eingegangen, welche viel Backgroundinformationen über die Entstehung der zwei HTML5 Spezifikationen geben.

Zu aller letzt bietet einer der Links eine gute Übersicht über die unterschiedlichen Features der HTML5 Spezifikationen (und HTML5 nahen Spezifikationen).

  • Was sind Webstandards? bei webkrauts.de: Dieser Artikel geht auf die Unterschiede zwischen WHATWG und W3C ein und beleuchtet ihre Herangehensweisen und welche Folgen sich daraus für Webentwickler ergeben.
  • Zum Stand der Webstandards, dem W3C und der WHATWG bei molily.de: Dieser Artikel betrachtet ebenfalls die Unterschiede zwischen WHATWG und W3C an einem relativ aktuellen Beispiel.
  • Übersicht über HTML5 Spezifikationen bei molily.de: Eine gute Auflistung der verschiedene HTML5 Spezifikationen und ihrer Versionen, sowie einiger anderer HTML5 relevante Spezifikationen.

Autor: Pipo

...kommt ursprünglich aus der Designerecke, ist aber im Laufe seines Studiums in die Webentwicklung gestolpert. Kann sich seit dem nicht so richtig entscheiden wo er hingehört und wagt deswegen vielleicht die Flucht nach vorne in ein komplett neues Gebiet. Vielleicht Management? Niemand weiß es. Auch er nicht.