Das Markupforum war eine feine, interessante und gut organisierte Veranstaltung in einem angenehmen universitären Umfeld. Etwa 150 Besuchern wurde eine Menge geboten, unter anderem 8 Vorträge von namhaften Referenten, darunter Dr. Michael Kay, Mit­au­tor der W3C-Spe­zi­fi­ka­tio­nen XSLT 2.0 und XPath 2.0, Prof. Dr. Felix Sasaki vom Deutsch-Österreichischen W3C-Büro und andere in ihrer Branche sehr bekannte XML-Experten wie Michael Müller-Hillebrand, Prof. Tobias Ott oder Prof. Dr. Marko Hedler.

Ich durfte einen Vortrag zu HTML5 halten, also einem Thema, das eigentlich nicht oder nur am Rand mit XML zu tun hat. Er passte dennoch gut in den Rahmen, der Vortrag kam sehr gut an und war Anknüpfungspunkt für zahlreiche interessante Gespräche in den Pausen. Die tolle Atmosphäre lud förmlich zum Gespräch und Wissensaustausch an – aber so muss es auch sein bei einer Tagung, die im Hörsaal einer Universität stattfindet und auch für die Studierenden der Hochschule offen stand. Einige von ihnen werden mich übrigens bald wiedersehen: Tobias Ott hat mich in seiner Funktion als Lehr­be­auf­trag­ter an der Hoch­schu­le der Me­di­en gefragt, ob ich Lust habe, im Rahmen seiner Vorlesung »Elektronisches Publizieren« mein Wissen über (X)HTML5 und CSS weiterzugeben – habe ich natürlich.

Meine Vortragsfolien habe ich wie immer bei Slideshare hochgeladen.

Frank Bültge: WordPress Child-Themes verstehen

Mit der Version 3.0 haben die WordPress-Entwickler die Funktion der Child-Themes integriert. Darüber können Sie ein bestehendes Theme anpassen oder als »Framework« nutzen und dabei komplett eigene Ideen umsetzen. Das eigentliche Theme bleibt dabei unangetastet. Frank Bültge zeigt am Beispiel des neuen Standard-Themes TwentyTen, wie Sie ein Child-Theme aufbauen.

WordPress Child-Themes verstehen

Zum Seitenanfang

Peter-Paul Koch: Combining media queries and JavaScript

Mit CSS3 Media Queries ist es möglich, die Einbindung von CSS nicht nur von einem bestimmten Medium abhängig zu machen, sondern auch davon, ob das Medium oder Ausgabegerät bestimmte Merkmale aufweist oder nicht. Dadurch kann eine Website abhängig von der Art und Größe des Geräts komplett unterschiedlich aussehen, auf einem 24-Zoll-Bildschirm beispielsweise ganz anders als auf einem Smartphone. Mit CSS Media Queries können Webentwickler allerdings keine Skripte oder Grafiken medienabhängig ausliefern, d.h. ein Smartphone lädt dieselben Ressourcen wie ein Desktop-Browser, obwohl das vielleicht nicht notwendig ist. Peter-Paul Koch erklärt in seinem Artikel, wie die Kombination von Media Queries und JavaScript dabei helfen kann, das Problem anzugehen.

Combining media queries and JavaScript

Zum Seitenanfang

Nico Brünjes: Die iPad Webseite

Zu Peter-Paul Kochs Artikel passt Nico Brünjes’ Bericht über seine Erfahrungen bei der Implementierung der iPad-Version von ZEIT ONLINE. Sein Fazit:

»CSS media queries sind im Moment eine schicke und elegante Lösung, wenn man seine bestehende Website mit ein paar Handgriffen an die Gegebenheiten verschiedener, zumeist kleinerer, Displays anpassen will. […] Für eine große Contentwebsite, die zweigleisig unter der gleichen Adresse unterschiedliche Styles an Desktopbrowser und Tablets ausliefert, sind sie jedoch (zumindest im Moment) nicht zu gebrauchen.«

Die iPad Webseite

Zum Seitenanfang

Frank Bültge: Eigenes CDN in WordPress nutzen

Sämtliche Analysewerkzeuge wie YSlow oder Google PageSpeed empfehlen die Nutzung eines Content Delivery Networks (CDN), um die Performance einer Website zu erhöhen. Frank Bültge erklärt in seinem Artikel, wie Sie in einer WordPress-Website ein CDN auf dem eigenen Webspace mit Hilfe von Subdomains anlegen können.

Eigenes CDN in WordPress nutzen

Der zu Beginn erwähnte Artikel Contao für Google Page Speed optimieren von Leo Feyer ist übrigens auch lesenswert. Er ist keine reine Anleitung zur Performance-Optimierung von Contao-Websites, sondern enthält viele Tipps, die sich auf andere Websites und Systeme übertragen lassen.

Zum Seitenanfang

PL002: HTML5

poly:logo ist ein Podcast von Markus Schlegel und Gabriel Shazad. In der zweiten Folge haben sie sich mit Mathias Schäfer und Peter Kröner über HTML5 unterhalten. In dem zweieinhalbstündigen Podcast geht es um die Hintergründe und die Bedeutung von HTML5, den Standardisisierungsprozess und die maßgeblichen Arbeitsgruppen, Neuerungen, Vor- und Nachteile, Browserkompatibilität, Flash, Audio- und Video und vieles mehr.

PL002: HTML5

Gestern erschien auf heise Developer mein Artikel zur IE 9 Beta. Er wirft einen Blick auf die neue Benutzeroberfläche und zeigt, welche Neuerungen der Browser in Bezug auf Webstandards aufweisen kann, darunter die Unterstützung des HSL-Farbraums, einiger Teile des CSS3-Moduls Backgrounds and Borders, Einbettung von Schriften sowie der HTML5-Elemente audio, video und canvas.

Artikel lesen: Ein neuer Fisch im Teich

Den Artikel können Sie hier kommentieren.

Wäre Peter Kröners Buch »HTML5. Webseiten innovativ und zukunftssicher« (Website zum Buch) ein Vortrag, wären dem Autor Standing Ovations sicher. Peter Kröner schafft mit seinen ersten beiden und dem letzten Kapitel eine Klammer, die das Buch zusammen hält, er wirft einen Blick zurück, führt ein, resümiert und schaut nach vorn – sprachlich und inhaltlich in ungewöhnlich hoher Qualität. Die Kapitel zwischen Anfang und Ende sind nicht so brillant, aber auch nicht viel schlechter. Ein empfehlenswertes Buch für Webentwickler, die schon einiges an Vorwissen und Erfahrung mitbringen.

Peter Kröner zeigt in vielen Listings, wie HTML5-Dokumente aussehen und wie sie sich von HTML4- oder XHTML-Dokumenten unterscheiden. Er stellt alle neuen Elemente und Attribute vor, zeigt die neuen Möglichkeiten bei der Auszeichnung von Formularen sowie der Einbettung von Audio- und Video-Elementen. Kröner stellt die Geolocation-API vor, zeigt Beispiele für Offline-Webanwendungen (DOM Storage), kämpft sich durch den Dschungel der Drag&Drop-API und zeichnet Bilder auf das canvas-Element. Dabei bleibt er immer nah an der Praxis.

Man merkt, dass Peter Kröner versteht, worüber er schreibt. Er beantwortet alle Fragen, die der Einstieg in HTML5 aufwirft, immer genau dann, wenn der (erfahrene) Leser sie sich gerade stellt. Kröner macht auch keinen Hehl daraus, dass HTML5 noch kein fertiger Standard und noch viel in Bewegung ist. Er jongliert gekonnt mit allem, was bereits implementiert ist (wie gut und in welchem Browser auch immer), erwähnt, was standardisiert ist und hat stets Zeit für den Blick über den Tellerrand, also auf das, was noch kommt.

Das Buch bietet einen sehr guten Überblick über all das, was mit HTML5 (jetzt schon!) möglich ist. An vielen Stellen bleibt es jedoch nur bei einem Überblick. Das liegt schlichtweg am Umfang von HTML5 und dessen Komplexität, dennoch hätte dem Buch im einen oder anderen Kapitel etwas mehr Tiefe gut getan.

Ebenfalls gewünscht hätte ich mir ein durchgängiges Praxisbeispiel, das den Leser durch das Buch hindurch begleitet. Die einzelnen Kapitel stehen sehr für sich, es gibt nahezu überhaupt keine Berührungspunkte, so als wäre das Buch eine Ansammlung einzelner Fachtexte, die in einem Sammelband erschienen sind. Ein HTML5-Projekt, das Kröner in seinem Buch Schritt für Schritt mit dem Leser zusammen aufbaut, hätte dem Buch sicherlich gut getan.

Es liegt wahrscheinlich an mir und meinem fachlichen Schwerpunkt, dass ich das Buch nicht in einem Rutsch durchgelesen habe, sondern Lesepausen eingelegt und zum Teil sogar einige Seiten überblättert habe. Ich bin kein JavaScript-Programmierer und habe wenig Bezug zu dem Teil von HTML5 (ursprünglich ja mal »Web Applications 1.0«), der diesen Standard für viele vermutlich erst richtig interessant macht: die neuen APIs und zahlreichen skriptbasierten Elemente, die den Browser von einem simplen Dokumentbetrachter zur universellen Anwendungsplattform für alle Arten von Programmen machen sollen. Webentwickler mit einer stärkeren Neigung zum Programmieren sehen das vermutlich anders. Insofern bietet das Buch für jeden etwas, und hier ist es sogar ein Vorteil, dass jedes Kapitel unabhängig voneinander gelesen werden kann. Wer sich für einen Teilaspekt von HTML5 nicht interessiert, kann die entsprechenden Seiten einfach überblättern – was aber schade wäre.

Informationen und Bezugsquellen

HTML5. Webseiten innovativ und zukunftssicher

Verlag Open Source Press; 1. Auflage (Mai 2010)
398 Seiten
34,90 Euro – ISBN 978-3937514970

• Buch bei Open Source Press bestellen
• Buch bei Amazon bestellen (Partnerlink)

Mittlerweile gibt es die W3C-Empfehlung RDFa in XHTML: Syntax and Processing (mit dem Untertitel: A collection of attributes and processing rules for extending XHTML to support RDF) und mit dem neuen Dokumenttyp XHTML+RDFa die Möglichkeit, RDFa formal korrekt zumindest in XHTML-Dokumente einzubetten. Voraussetzung für dessen Einsatz ist die Angabe der entsprechenden Dokumenttyp-Deklaration. Zusätzlich müssen Webautoren dem html-Element das Attribut xmlns="http://www.w3.org/1999/xhtml" und sollten das Attribut version="XHTML+RDFa 1.0" angeben.

Dokumente, die diesen Vorgaben entsprechen, beginnen somit wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN"
 "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
 version="XHTML+RDFa 1.0">

Für HTML-Dokumente gibt es derzeit keinen vergleichbaren Standard, auch nicht für das in Entwicklung befindliche HTML5. Dennoch zieht RDFa im Web seine Kreise mittlerweile auch außerhalb der XML-Welt und sorgt dafür, dass mehr und mehr HTML-Dokumente zwar semantisch reichhaltiger werden, aber nicht mehr veröffentlichten formalen Grammatiken genügen.

Mit HTML+RDFa arbeitet das W3C derzeit an einem neuen Standard, der beschreibt, wie RDFa in HTML eingebettet werden soll. Der erste Arbeitsentwurf ist vom 15. Oktober. Er ist sehr kurz gehalten und definiert Regeln und Richtlinien, um die Empfehlung »RDFa in XHTML« für den Einsatz von RDFa in HTML-Dokumenten anzupassen, sowohl für HTML5 in beiden Serialisierungen (HTML- und XML-Serialisierung) wie auch »herkömmliches« HTML 4.

Der Entwurf beschreibt Mechanismen, wie Webautoren sicherstellen können, dass RDFa in ihren HTML-Dokumenten funktioniert. Allerdings werden HTML4-Dokumente dadurch natürlich nicht automatisch gültig. Die oben angesprochenen XHTML-2.0-Attribute sind in HTML nicht erlaubt, in keiner Version, auch nicht in HTML5. Abschnitt 5 den Entwurfs (Extensions to the HTML5 Syntax) nimmt darauf Bezug und beschreibt Änderungen, die am HTML5-Arbeitsentwurf vorgenommen werden müssen, damit HTML5 RDFa auch formal unterstützt. Dazu gehören die erwähnten Attribute und deren Werte – unter Beachtung von Namensraumdeklarationen und CURIEs. Folgendes Beispiel zeigt, was damit gemeint ist.

<span
  xmlns:dc="http://purl.org/dc/elements/1.1/"
  about="urn:isbn:3-8273-2739-3"
  property="dc:title"
>Einführung in XHTML, CSS und Webdesign</span>

Das span-Element importiert das Dublin-Core-Vokabular mittels @xmlns:dc-Attribut und weist dem URI http://purl.org/dc/elements/1.1/ den Namensraum-Präfix dc zu. @dc:title ist nun die Kurzschreibweise für http://purl.org/dc/elements/1.1/title. Dieses Konzept wird CURIE genannt (Kurzform von Compact URI).

Namensraumdeklarationen sind ein wichtiges Konzept von XML, in HTML jedoch unbekannt. Auch die HTML-Serialisierung von HTML5 kennt Namensraumdeklarationen nur in den sogenannten »foreign elements« aus dem MathML- und SVG-Namensraum, die in HTML5 eingebettet werden können. Damit RDFa in HTML-Dokumente integriert werden kann, muss HTML5 Namensraumdeklarationen auch in der HTML-Serialisierung erlauben. Daher ist es wichtig, dass alle Attribute, die mit xmlns: beginnen, nicht wie gewöhnliche Attribute behandelt werden; derzeit jedoch wirft der W3C-Validator bei der Überprüfung den Beispiels noch Fehler (»Attribute xmlns:dc not allowed here«).

Es ist fraglich, ob die HTML5-Entwickler um Ian Hickson den Wünschen der »HTML+RDFa«-Autoren nachkommen werden, schließlich versuchen Manu Sporny und die RDFa Task Force schon länger, Hickson RDFa schmackhaft zu machen. Dessen Antwort finden wir in Abschnitt 5 des RDFa-Entwurfs: Microdata.

Heute bezweifelt niemand mehr, dass HTML5 die »Lingua Franca« der Zukunft sein wird. Wie genau diese Sprache einmal klingen wird, steht jedoch noch nicht fest. Die Arbeit an HTML5 ist in vollem Gange und fast täglich gibt es neue Anmerkungen und Entwürfe. Vielleicht findet RDFa noch Eingang in HTML5, falls nicht, wird es wohl bald keine Rolle mehr spielen, denn was sollen wir mit einem Standard, den wir nicht einsetzen können?

Am besten schauen Sie sich die Präsentation im Vollbildmodus an. Nutzen Sie einfach die entsprechende Schaltfläche. Falls Sie mit der Darstellung auf dieser Seite Probleme haben, dann können Sie sich die Präsentation direkt auf SlideShare anschauen.