Dynamic HTML 5

1249533381|%d.%m.%Y

Vor ein paar Jahren meinten viele Site-Anbieter, ihren Websites flash-basierte oder gar DHTML-basierte Trailer voranstellen zu müssen. Eine Unsitte, vor allem dann, wenn die Kunstwerke sich nicht einmal übersrpringen (skippen) ließen und den Anwender auf eine unnötige Geduldsprobe stellten. Mittlerweile hat die Kritik dieses Phänomen glücklicherweise stark schrumpfen lassen. Doch sie könnten bald wiederkommen, die animierten Trailer, wenn selbstverliebte Techies wieder mal der Welt beweisen wollen, was sie Neues gelernt haben: Flashen ohne Flash, sondern mit HTML5 und JavaScript.

Das Macadelic Blog verweist auf eine HTML5-JavaScript-Anwendung, ergänzt um eine Audio-EInbindung, die in den Tiefen des Servers von 9elements zu finden ist:

Das Demo zeigt sehr schön, wozu HTML5-basierte Animationen plus Multimedia demnächst massenweise missbraucht werden könnten. Doch keine Sorge: es lassen sich auch sinnvollere Dinge damit anstellen. Bestes Beispiel wird der Google-Web-Client für Google Wave sein, der als sich „HTML5-Applikation“ bezeichnet.

Wenn man „HTML5-Applikationen“ hört, könnte man meinen, HTML würde in seiner 5. Version zur Programmiersprache mutieren. Ganz so ist das nicht. HTML bleibt auch in Version 5 die bekannte Auszeichnungssprache mit den spitzen Klammern, mit deren Hilfe man die formale und inhaltliche Struktur von Webseiten definiert. Doch was veranlasst Eingeweihte dann, von „HTML5-Applikationen“ zu reden? Es sind verschiedene Konzepte:

  • HTML5 führt eine Reihe neuer Elemente und Attribute ein, die neue Programmierschnittstellen darstellen. Dazu gehören etwa das canvas-Element, das einen Container für beliebige programmierte visuelle Inhalte darstellt, oder das datagrid-Element mit Unterelementen und -Attributen, mit dem sich komplexe, dynamische Dialogelemente moderner Anwendungen semantisch sehr fein modellieren lassen und dadurch das dahinter liegende Scripting entlasten.
  • HTML5 wird in der Spezifikation anders als frühere HTML-Versionen nicht mehr als Markup-Derivat (SGML- oder XML-Dokumenttyp) beschrieben, sondern als DOM (Document Object Model). Das bedeutet: die HTML5-Spezifikation beschreibt von Haus aus programmiersprachentypische Datenstrukturen, keine Markup-Regeln. Dadurch werden Unschärfen vermieden, die bislang bei der Übersetzung von Markup-Regeln in Datenstrukturen aufgetreten sind, und die bislang für so manchen lästigen Interpretations-Unterschied bei Web-Browsern verantwortlich waren.
  • HTML5 versucht, fertige Lösungen zu liefern statt unbestimmter Schnittstellen. Denn man hat aus der Vergangenheit gelernt und eingesehen, dass Elemente, für die es keine verfügbaren und festgelegten Anwendungen gibt, von niemandem verwendet werden. Das betrifft vor alllem den Multimedia-Bereich. So will man mit den neuen Elementen video und audio auch gleich Standard-Codecs vorschreiben, die alle HTML5-fähigen Browser mitbringen sollen, damit Web-Autoren so wie heute im Bereich Pixelgrafik wissen, was sie verwenden müssen, um Videos und Sounds einzubetten, ohne auf eine verbreitete, aber proprietäre Lösung wie Flash zurüdkgreifen zu müssen. Auch beim canvas-Element hat man sich Gedanken gemacht und liefert gleich ein fertiges JavaScript-Objekt zum dynamischen Generieren von Grafik mit.

Auch obiges Demo von 9elements basiert auf canvas plus JavaScript, wobei allerdings zusätzlich das Framework JQuery zum Einsatz kommt, das in Entwicklerkreisen mittlerweile schon quasi Standard für JavaScript-Programmierung ist. Im HTML-Quelltext ist <canvas id="theapt" width="100" height="100"></canvas> notiert. Das im HTML-Head-Bereich referenzierte JavaScript apt18.js enthält den Code, der die Effekte im canvas-Bereich erstellt und den Ablauf steuert.

Hoffen wir, dass die Schaut-her-ich-kann-es-auch-kopieren-Phase für Dynamic HTML5 schnell vorüber geht, und dass HTML5-Applikationen einhalten, was heute eher noch ein Versprechen ist.

Kommentare

Neuen Kommentar hinzufügen
oder Anmelden als Wikidot User
(wird nicht veröffentlicht)
- +
Sofern nicht anders angegeben, steht der Inhalt dieser Seite unter Lizenz Creative Commons Attribution-ShareAlike 3.0 License