HTML5 & CSS3 (Prags) (eBook)
280 Seiten
O'Reilly Verlag
978-3-86899-471-1 (ISBN)
Brian P. Hogan arbeitet seit 1995 als freiberuflicher Webdesigner und Berater. Zurzeit beschäftigt er sich mit der Entwicklung von Web-Anwendungen mit Ruby, jQuery, HTML5 und CSS 3. Er liebt es, vor allem im Bereich Webdesign und -entwicklung IT-Schulungen zu geben und als Autor zu arbeiten. Außerdem setzt er sich für die Zugänglichkeit von Websites ein, insbesondere für Menschen mit Sehbehinderungen.
Brian P. Hogan arbeitet seit 1995 als freiberuflicher Webdesigner und Berater. Zurzeit beschäftigt er sich mit der Entwicklung von Web-Anwendungen mit Ruby, jQuery, HTML5 und CSS 3. Er liebt es, vor allem im Bereich Webdesign und -entwicklung IT-Schulungen zu geben und als Autor zu arbeiten. Außerdem setzt er sich für die Zugänglichkeit von Websites ein, insbesondere für Menschen mit Sehbehinderungen.
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.
Internet Explorer
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.
Barrierefreiheit
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.
Veraltete Tags
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:
-
frame
-
frameset
-
noframes
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 durchabbr
ersetzt. -
applet
wird durchobject
ersetzt. -
dir
wird durchul
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
undtext
für dasbody
-Tag -
bgcolor
-
height
undwidth
-
scrolling
für dasiframe
-Element -
valign
-
hspace
undvspace
-
cellpadding
,cellspacing
undborder
fürtable
Falls Sie für Ihre Links target
verwenden, wie z.B. in:
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?
Erscheint lt. Verlag | 23.5.2012 |
---|---|
Verlagsort | Heidelberg |
Sprache | deutsch |
Themenwelt | Mathematik / Informatik ► Informatik ► Netzwerke |
Mathematik / Informatik ► Informatik ► Web / Internet | |
Schlagworte | CSS3 • HTML5 • Web • Webdesign • Webstandards |
ISBN-10 | 3-86899-471-8 / 3868994718 |
ISBN-13 | 978-3-86899-471-1 / 9783868994711 |
Haben Sie eine Frage zum Produkt? |
![PDF](/img/icon_pdf_big.jpg)
Größe: 6,3 MB
Digital Rights Management: ohne DRM
Dieses eBook enthält kein DRM oder Kopierschutz. Eine Weitergabe an Dritte ist jedoch rechtlich nicht zulässig, weil Sie beim Kauf nur die Rechte an der persönlichen Nutzung erwerben.
Dateiformat: PDF (Portable Document Format)
Mit einem festen Seitenlayout eignet sich die PDF besonders für Fachbücher mit Spalten, Tabellen und Abbildungen. Eine PDF kann auf fast allen Geräten angezeigt werden, ist aber für kleine Displays (Smartphone, eReader) nur eingeschränkt geeignet.
Systemvoraussetzungen:
PC/Mac: Mit einem PC oder Mac können Sie dieses eBook lesen. Sie benötigen dafür einen PDF-Viewer - z.B. den Adobe Reader oder Adobe Digital Editions.
eReader: Dieses eBook kann mit (fast) allen eBook-Readern gelesen werden. Mit dem amazon-Kindle ist es aber nicht kompatibel.
Smartphone/Tablet: Egal ob Apple oder Android, dieses eBook können Sie lesen. Sie benötigen dafür einen PDF-Viewer - z.B. die kostenlose Adobe Digital Editions-App.
Zusätzliches Feature: Online Lesen
Dieses eBook können Sie zusätzlich zum Download auch online im Webbrowser lesen.
Buying eBooks from abroad
For tax law reasons we can sell eBooks just within Germany and Switzerland. Regrettably we cannot fulfill eBook-orders from other countries.
![EPUB](/img/icon_epub_big.jpg)
Größe: 4,9 MB
Digital Rights Management: ohne DRM
Dieses eBook enthält kein DRM oder Kopierschutz. Eine Weitergabe an Dritte ist jedoch rechtlich nicht zulässig, weil Sie beim Kauf nur die Rechte an der persönlichen Nutzung erwerben.
Dateiformat: EPUB (Electronic Publication)
EPUB ist ein offener Standard für eBooks und eignet sich besonders zur Darstellung von Belletristik und Sachbüchern. Der Fließtext wird dynamisch an die Display- und Schriftgröße angepasst. Auch für mobile Lesegeräte ist EPUB daher gut geeignet.
Systemvoraussetzungen:
PC/Mac: Mit einem PC oder Mac können Sie dieses eBook lesen. Sie benötigen dafür die kostenlose Software Adobe Digital Editions.
eReader: Dieses eBook kann mit (fast) allen eBook-Readern gelesen werden. Mit dem amazon-Kindle ist es aber nicht kompatibel.
Smartphone/Tablet: Egal ob Apple oder Android, dieses eBook können Sie lesen. Sie benötigen dafür eine kostenlose App.
Geräteliste und zusätzliche Hinweise
Zusätzliches Feature: Online Lesen
Dieses eBook können Sie zusätzlich zum Download auch online im Webbrowser lesen.
Buying eBooks from abroad
For tax law reasons we can sell eBooks just within Germany and Switzerland. Regrettably we cannot fulfill eBook-orders from other countries.
aus dem Bereich