1.3 Der Weg in die Zukunft ist steinig
Es gibt einige Hürden, die der weiteren Verbreitung von HTML5 und CSS3 im Wege stehen. Manche sind offensichtlich, andere nicht.
Der Internet Explorer verfügt derzeit über die größte Anwenderbasis, und die Versionen 8 und darunter bieten eine äußerst schwache Unterstützung für HTML5 und CSS3. Beim IE 9 sieht die Situation schon besser aus, aber er ist noch nicht weit verbreitet. Das bedeutet nicht, dass wir HTML5 und CSS3 nicht trotzdem für unsere Websites verwenden können. Wir bekommen es hin, dass unsere Websites im Internet Explorer funktionieren, sie müssen ja nicht genauso funktionieren wie die Versionen für Chrome und Firefox. Wir müssen lediglich Ausweichlösungen anbieten, sodass wir keine Benutzer verärgern oder Kunden verlieren.
Die Benutzer müssen mit unseren Websites interagieren können, ganz gleich ob sie seh- oder hörbehindert sind, ältere Browser, langsame Verbindungen oder mobile Geräte verwenden. In HTML5 werden einige neue Elemente eingeführt, zum Beispiel audio
, video
und canvas
. Mit Audio und Video gab es immer schon Schwierigkeiten in puncto Barrierefreiheit, aber das canvas
-Element stellt uns vor neue Herausforderungen. Mit diesem Element können wir Vektorbilder über JavaScript innerhalb des HTML-Dokuments erstellen. Hieraus ergeben sich Schwierigkeiten für Sehbehinderte, aber auch für die fünf Prozent der Webbenutzer, die JavaScript deaktiviert haben.[8]
Wir dürfen nicht mit den neuen Technologien davongallopieren und dabei die Barrierefreiheit aus den Augen verlieren. Wir müssen geeignete Ausweichlösungen für die neuen HTML5-Elemente bieten – ebenso wie für Menschen, die den Internet Explorer verwenden.
Kuchen und Zuckerguss
Ich mag Kuchen. Ich mag Torte lieber, aber Kuchen ist auch ziemlich gut. Am allerliebsten mag ich Kuchen mit Zuckerguss.
Wenn Sie Webanwendungen entwickeln, dürfen Sie nicht vergessen, dass die hübsche Benutzeroberfläche und die schicken JavaScripts lediglich der Zuckerguss auf dem Kuchen sind. Ihre Website kann auch ohne dieses ganze Zeug richtig gut sein. Und genau wie bei einem Kuchen brauchen Sie ein Fundament, auf das Sie den Zuckerguss auftragen können.
Ich habe einige Leute kennengelernt, die keinen Zuckerguss mögen. Sie kratzen ihn vom Kuchen ab. Ich habe auch Leute kennengelernt, die Webapplikationen aus verschiedenen Gründen ohne JavaScript verwenden.
Backen Sie für diese Menschen zuerst einen wirklich tollen Kuchen. Und tragen Sie erst dann den Zuckerguss auf.
In HTML5 wurden eine Menge neuer Elemente eingeführt, aber die Spezifikation schafft auch einige gebräuchliche Elemente ab, die Sie eventuell in Ihren Webseiten verwenden.[9] Diese sollten Sie beim Umstieg entfernen:
basefont
big
center
font
s
strike
tt
u
Einige dieser Tags sind ziemlich veraltet. Aber da draußen finden Sie viele Seiten, die mit visuellen Editoren wie zum Beispiel Dreamweaver bearbeitet werden und deshalb eine Menge font- u
nd center
-Tags enthalten.
Neben gestalterischen Elementen wurde auch die Unterstützung von Frames entfernt. Frames waren immer sehr beliebt in Enterprise-Webanwendungen wie zum Beispiel PeopleSoft, Microsoft Outlook Web Access und sogar in speziell entwickelten Portalen. Trotz der weit verbreiteten Verwendung haben Frames so viele Schwierigkeiten im Hinblick auf Benutzerfreundlichkeit und Barrierefreiheit mit sich gebracht, dass man sie loswerden musste. Dementsprechend sind die folgenden Elemente verschwunden:
Sie sollten Möglichkeiten finden, das Layout Ihrer Benutzeroberflächen mit regulärem CSS und ein bisschen JavaScript auch ohne Frames zu gestalten. Falls Sie mit Frames dafür sorgen, dass Kopfzeile, Fußzeile und Navigation auf jeder Seite Ihrer Anwendung gleich angezeigt werden, können Sie das auch mit den Tools Ihres Webentwicklungs-Frameworks erreichen. Einige andere Elemente sind verschwunden, weil es bessere Optionen dafür gibt:
acronym
wird durch abbr
ersetzt.
applet
wird durch object
ersetzt.
dir
wird durch ul
ersetzt.
Zusätzlich zu den veralteten Elementen sind auch viele Attribute nicht mehr zulässig. Dazu gehören Darstellungsattribute wie zum Beispiel:
align
link
, vlink
, alink
und text
für das body
-Tag
bgcolor
height
und width
scrolling
für das iframe
-Element
valign
hspace
und vspace
cellpadding
, cellspacing
und border
für table
Falls Sie für Ihre Links target
verwenden, wie z.B. in:
<a href="http://www.google.com" target="_blank">sollten Sie stattdessen JavaScript verwenden, da auch target
abgeschafft wurde.
Das Attribut profile
des head
-Tags wird auch nicht mehr unterstützt. Das ist etwas, was Sie tendenziell in einer Menge WordPress-Vorlagen finden.
Zu guter Letzt ist das Attribut longdesc
für img-
und iframe
-Elemente verschwunden. Für Verfechter der Barrierefreiheit ist das ein bisschen enttäuschend, da longdesc
die allgemein anerkannte Möglichkeit war, Benutzern mit Bildschirmlesegeräten zusätzliche beschreibende Informationen zu bieten.
Falls Sie vorhaben, HTML5 für Ihre vorhandenen Websites zu verwenden, sollten Sie diese Elemente ausfindig machen und entfernen oder durch semantischere Varianten ersetzen. Validieren Sie Ihre Seiten unbedingt mit dem Validierungsservice des W3C[10], der Ihnen dabei helfen wird, veraltete Tags und Attribute aufzuspüren.
Konkurrierende Unternehmensinteressen
Der Internet Explorer ist nicht der einzige Browser, dessen Entwickler die Einführung von HTML5 und CSS3 hinauszögern. Google, Apple und die Mozilla Foundation haben ebenfalls ihre eigenen Vorstellungen und kämpfen um die Vorherrschaft. Sie streiten über die Unterstützung von Video- und Audio-Codecs und bringen ihre Standpunkte in ihren Browser-Versionen klar zum Ausdruck. So spielt Safari beispielsweise MP3 über das audio
-Element ab, aber keine ogg
-Dateien. Firefox unterstützt dagegen ogg
-Dateien, aber keine mp3
-Dateien.
Irgendwann werden diese Unterschiede entfallen. Bis dahin können wir lediglich intelligente Entscheidungen darüber treffen, was wir selbst unterstützen – indem wir unsere Implementierungen auf die von unseren Zielgruppen verwendeten Browser beschränken oder alles mehrfach implementieren, für jeden Browser einmal – bis die Standards endgültig feststehen. Es ist aber alles nicht so schlimm, wie es sich anhört. Mehr darüber erfahren Sie in Kapitel 7.
HTML5 und CSS3 befinden sich noch in der Entwicklung
Die Spezifikationen sind noch nicht endgültig. Das bedeutet, dass sich alles innerhalb dieser Spezifikationen ändern kann. Firefox, Chrome und Safari bieten eine gute Unterstützung für HTML5. Aber wenn sich die Spezifikation ändert, werden sich die Browser mit ihr verändern, und dies kann wiederum zu veralteten und defekten Websites führen. Während dieses Buch geschrieben wurde, wurde die CSS3-Eigenschaft box-shadow
aus der Spezifikation entfernt und wieder hinzugefügt. Das Protokoll Web Sockets wurde verändert, und die Client-Server-Kommunikation wurde dadurch zunichte gemacht.
Wenn Sie den Fortschritt von HTML5 und CSS3 mitverfolgen und immer auf dem Laufenden bleiben, ist alles gut. Eine ganze Menge der Dinge, die wir in diesem Buch diskutieren, wird lange funktionieren.
Wenn Sie über etwas stolpern, das in einem Ihrer Zielbrowser nicht funktioniert, verwenden Sie einfach JavaScript und Flash als Spachtelmasse, um diese Lücken zu füllen. Sie entwickeln Lösungen, die für alle Benutzer funktionieren. Und im Laufe der Zeit können Sie JavaScript und die anderen Ausweichlösungen nach und nach entfernen, ohne Ihre eigentlichen Implementierungen zu ändern.
Aber bevor Sie zu viel über die Zukunft nachdenken, fangen wir einfach an, mit HTML5 zu arbeiten. Eine ganze Menge neuer struktureller Tags warten darauf, Sie im nächsten Kapitel kennenzulernen. Und wir wollen sie doch nicht so lange warten lassen, oder?