Video-Training HTML5 und CSS3

Webmaster tragen seit jeher ein Kreuz mit sich herum, das der Browser. In unser aller dĂĽsterer Erinnerung bleibt der IE6. Jetzt haben sich die Zeiten nicht wirklich gebessert, auch mit Blick auf die neuen Standards HTML5 und CSS3 nicht, lehrt uns Peter Kröner, der Autor des Video-Trainings „HTML5 und CSS3 – Die neuen Webstandards im Praxiseinsatz“.

Browser-Entwickler sind sich uneins, wie sie diese in ihre Software implementieren. Im Beispiel oben (*) muss noch mit einem sog. „vendor prefix“ fĂĽr Browser gearbeitet werden. Doch in einem sind sich alle einig: HTML5 und CSS3 sind die Zukunft, nachzulesen u. a. auf der Website von Peter Kröner. Deshalb lohnt es sich, dass sich Webmaster bereits jetzt mit der Thematik befassen, zumal beide Standards in Teilen auch heute schon eingesetzt werden können.

„Alles, was toll und neu im Browser ist“
Der Autor Peter Kröner begrüßt die Nutzer zu Beginn des Trainings und fasst vor jedem neuen Kapitel den zu erwartenden Inhalt zusammen. Diese klare Strukturierung erleichtert dem Benutzer die Orientierung bei der wirklich großen Vielzahl an Themen.

Das Video-Training wendet sich an etablierte Webentwickler, so dass jeder während des Trainings selbst herausfinden wird, welche Kenntnisse ihm ggf. noch fehlen. Die Aussicht, dass im Browser berechenbares Verhalten herauskommt, so Kröner sinngemäß, dürfte Motivation genug sein, sich mit der Spezifikation zu beschäftigen.

Wer sich an die neuen Webstandards heranwagt, besitzt natürlich Vorkenntnisse in HTML und CSS, hat zumindest von JavaScript, XML und Ajax schon einmal etwas gehört und versteht günstigstenfalls etwas mehr von allem. Auch bestimmte Begriffe, wie DOM-Baum und Event-Handler werden als bekannt vorausgesetzt.

Peter Kröner führt seine Zuschauer im Video an das Thema HTML5 und CSS3 heran: ein Ausflug in die Historie (wirklich nicht langweilig), klare, kurze Sätze, Beispiele, grafische Übersichten, Gliederungen zum Mitlesen, persönliche Meinungen und eine auf das Wesentliche konzentrierte Ansprache, gewürzt mit einer frischen, lebendigen und bildhaften Sprache (z. B. „DIV-Suppe“, „Classitis“) erleichtern es dem Lernenden, die teilweise ganz neue Materie aufzunehmen. Kröner hält die Spannung während des gesamten Videos aufrecht:

Das klingt kompliziert, ist es auch.

oder

Wo bleibt das Spektakel?

Didaktisch hat der junge Autor wirklich was drauf, im gesamten Video sind beispielsweise Zusammenfassungen, Zwischenfragen, Ansprache der Benutzer, Bezug zu bereits Gelerntem probate Mittel, den „Stoff“ zu vermitteln.

Zum Verständnis der HTML5-Spezifikation notwendigen Informationen stehen am Anfang des Trainings. Bereits in den ersten Sätzen betont der Autor, dass die Web-Entwicklung unglaublich schnell an allen Fronten abläuft. Wer das Video durchgearbeitet hat, befindet sich demnach nicht am Ende, sondern an einem neuen Anfang. HTML5 wird nicht irgendwann fertig sein, bekräftigt Kröner. Das ist heute Web-Normalität.

Kröner macht keine leeren Versprechungen, sondern nennt die Dinge beim Namen: Da diverse Technologien aus dem „HTML5-Universum“ unterschiedlich stabil ausfallen, mĂĽssen sich Webentwickler mit Workarounds und Tricks behelfen. Er kann sich in dem 9-stĂĽndigen Training auch nur auf eine Auswahl der Möglichkeiten beschränken und empfiehlt daher einen Blick in die „furchteinflößende“ HTML5-Spezifikation.

Wer sich vielleicht an seine eigenen HTML-Anfänge erinnert, dem wird die Arbeitsweise bekannt vorkommen: Niemand hat HTML-Tags komplett auswendig gelernt, sondern tastete sich mit Grundkenntnissen in die Webentwicklung vor. Heute ist das nicht anders, nur sehr viel komplexer.

Eine fĂĽr kommerzielle Webentwickler ganz wichtige Frage beantwortet Peter Kröner in den ersten Kapiteln mit einem klaren „JEIN“:

Können wir mit HTML5 heute schon etwas anfangen?

Die gesamte Palette der Spezifikation ist wohl noch nicht brauchbar, weil Browser hier unterschiedlich reagieren. Doch wenn man sich auf Teilbereiche konzentriert,

kann man schon die eine oder interessante Sache damit machen.

Die wiedergewonnene Freiheit – das Markup
Peter Kröner weckt ganz geschickt unsere Neugierde:

Machen wir das doch einmal. … Warum ist das so?

Im Video wird es nie langweilig, weil die Spielereien mit den neuen Standards auch einem erfahrenen Webmaster interessante Wege zeigen. Peter Körner zeigt an ausgewählten Beispielen den Unterschied zur bisheriger HTML(4)-Auszeichnung. Genau das ist es, was der Lernende sehen und letztlich verstehen will: Was ist neu?

Zwischenfragen, wie „Was nĂĽtzt uns das?“, „WofĂĽr brachen wird das?“ bringen ein Problem und dessen Lösung zueinander. Zu bestehenden Situationen, bspw. den Video-Codecs, gibt Kröner weiterfĂĽhrende Informationen – das alles immer kurz und knackig.

FĂĽr die meisten Anwendungen sind JavaScript-Kenntnisse unbedingt erforderlich. Wer sich (noch) nicht auskennt, kann auf die Beispieldateien auf der DVD zurĂĽckgreifen. Hilfreich: Der Autor fasst bei umfangreichen Codebeispielen das Wichtigste noch einmal zusammen.

Appetitshäppchen
Die einzelnen Inhalte sind auf der Verlagswebsite dokumentiert. Dennoch möchte ich hier ein paar Beispiele kurz beschreiben, damit der Lernende einen Eindruck von den Themen bekommt.

Beispiel Formularelemente
Mit HTML5 können nicht nur neue Formularelemente mit dynamischen Formularzielen erstellt werden. Viele Felder enthalten zudem eingebaute Validierungsfunktionen, die sich mit dem Browser des Nutzers aktualisieren. Peter Kröner stellt den Code und seine Darstellung im Browser anschaulich gegenüber. An dieser Stelle tritt erstmals JavaScript in Erscheinung. Kenntnisse sollten also vorhanden sein.

TIPP: Als weiterfĂĽhrende LektĂĽre empfiehlt der Verlag entweder das Buch „JavaScript“ € von Christian Wenz. Wer sich weiterhin per Video-Training weiterbilden möchte, sollte sich „JavaScript – das umfassende Training€ anschauen.“

Beispiele Geolocation, Audio, Video, Canvas
Die neuen Standards machen es recht einfach, Webseiten mit multimedialen Elementen zu bereichern und hierfür unabhängig von Flash-Plugins mit Boardmitteln des Browsers zu arbeiten. Das Einbinden von Audio- und Videodateien bekommen auch weniger erfahrene Webentwickler mithilfe der Trainingseinheit hin. Um das Thema kommen Webmaster auch gar nicht herum, da Hör- und Videoinhalte für kommerzielle Websites unabdinglich geworden sind.

Für das Feintuning sind wiederum JavaScript-Kenntnisse erforderlich. Mit einer JavaScript API eröffnen sich Horizonte, die man bei Flash vermisst: Webmaster können beispielsweise eigene Player-Interfaces erstellen. Der Autor bleibt uns individuell gestaltete Beispiele nicht schuldig und verweist wiederum auf die HTML5-Spezifikation, wo alle Möglichkeiten „haarklein“ dokumentiert sind.

Interessant und für viele neu ist der Einsatz von Canvas-Elementen. Angefangen von einfachsten Anwendungen baut Peter Kröner den Code immer weiter aus bis hin zu einem Objekt-System. Canvas fehlen grafische Tools, wie sie bspw. bei Flash zur Verfügung stehen, gesteht Kröner ein.

CSS3 – die Befreiung von der „Classitis“
Der Umfang an neuen CSS3-Eigenschaften ist riesig. Peter Kröner beschränkt sich bei der Erläuterung auf

Dinge, die Sie tatsächlich heute schon einsetzen können,

und zwar fehlerfrei in allen modernen Browsern. Eine wirklich gute Entscheidung in Anbetracht der uneinheitlichen Umsetzung in Browsern, ganz abgesehen von der zeitlichen Machbarkeit in dem Video. Obwohl – Hat Kröner den Nutzer erstmal in den Bann gezogen und begeistert, z. B. beim Thema Farbverläufen, schreit der förmlich nach mehr.

Aber ich kann Ihnen einen Link geben …

Und das macht er dann auch.

FĂĽr Webmaster wichtig sind die Angaben des Autors zur Kompatibilität einzelner CSS3-Eigenschaften, also welcher Browser ab Version X kann welche Angaben „verstehen“?

Das letzte Kapitel über responsives Design und Debugging dürfte für wirkliche Einsteiger eine ziemliche Herausforderung darstellen. Natürlich hat Peter Kröner die Bedeutung dieser Materie erkannt und die Ausführungen zum Webdesign für mobile Endgeräte deshalb in das Video aufgenommen.

Kapitel und Anhänge
Das Video-Tutorial ist in 12 Kapitel gegliedert. Eine Ăśbersicht erlaubt es dem Lernenden, zum gewĂĽnschten Kapitel zu springen oder Inhalte ĂĽber die Suchfunktion zu finden. Wichtige Meilensteine innerhalb eines Kapitels sind mit Sprungmarken versehen. Die im Training vorgestellten Beispiele befinden sich auf der DVD im Ordner „Uebungsmaterial“.

Über ein Symbol kann der Nutzer Lesezeichen speichern, um die für ihn wichtigen Stellen wiederzufinden. Eine Hilfefunktion zur Bedienung des Videotrainings ist in Form von Kurz-Videos hinterlegt. Einige wenige Einstellungen sind möglich.

Mit dem Trainingsvideo arbeiten
Die persönlichen Vorkenntnisse eines Webentwicklers sind entscheidend dafür, ob er sich das gesamte Training anschaut oder nur die für ihn interessanten Kapitel. Aufgrund seines Umfanges und Aufbaus eignet sich das Video für ein schrittweises Vorarbeiten.
So mancher wird sich berufen fĂĽhlen, anhand der Beispieldateien sofort nach einem Kapitel selbst herumzuexperimentieren. Es ist einfach zu verlockend!

Die eigentliche Vertiefung wird nur nach wiederholtem Ansehen von bestimmten Videoabschnitten möglich sein. Einige Themen, wie beispielsweise responsives Webdesign, sind recht schwierig auf eigene Aufgabenstellungen zu übertragen, ohne sich vorher mit den Spezifikationen beschäftigt zu haben.

Das Training richtet sich nach Auffassung des Autors zwar eher an Einsteiger mit JavaScript-Grundkenntnissen, aber welcher Einsteiger hat die eigentlich? Der Empfehlung von Peter Kröner ist also Folge zu leisten: JavaScript lernen! Ohne kommt man heute nicht mehr weit, ist sein Fazit.
Und auch fleißig testen, ob die implementierten Standards in dem einen oder anderen Browser wirklich das tun, was sie sollen, so ein wichtiger Hinweis des Autors. Dass der IE öfter mal aus der Reihe tanzt, daran haben wir und ja eh gewöhnt. Und übrigens: Nutzer sollten neue Browser verwenden.

Das hier besprochene Video halte ich persönlich fĂĽr ein sehr gelungenes Training sowohl in technischer wie auch in inhaltlicher Hinsicht. Der Autor versteht es hervorragend, ausgewählte Aspekte klar, deutlich und mit dem nötigen Rundumblick zu behandeln. Es ist sehr hilfreich fĂĽr den Einstieg in das Thema „neue Webstandards“.

Bestell-Informationen
Verlag: Galileo Press
Titel: HTML5 und CSS3 €
Untertitel: Die neuen Webstandards im praktischen Einsatz – inkl. Bonusheft mit umfassender Referenz
Autor: Peter Kröner
DVD – 9 Stunden Gesamtspielzeit
Preis: 39,90 Euro
ISBN 978-3-8362-1831-3
Systemvoraussetzungen: Windows, Mac, Linux

Tags: , , , , , ,

Nichts verpassen und neue Beiträge abonnieren

Privatsphäre garantiert! Jederzeit abbestellbar!

einen Kommentar schreiben

Bitte Einloggen , um einen Kommentar zu hinterlassen

Top