Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

HTML5 für Webdesigner

Der HTML5-Showcase von Apple

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Dieses Vorzeigeprojekt von Apple hat im Juni 2010 für viel Furore gesorgt und dazu beigetragen, dass der Begriff HTML5 für alles steht, was gerade schick und angesagt war.

Transkript

In diesem Film möchte ich Ihnen kurz den HTML5 Showcase vorstellen, designed by Apple in California. Dieser Showcase sorgte im Jahre 2010 für Furore und war nicht ganz unschuldig daran, dass HTML5 so ein schwammiger Begriff wurde - so ein Zauberwort, dass eigentlich für fast alles stehen konnte. Dieser Showcase ist nicht aus heiterem Himmel entstanden. Der Kontext für Apple war, dass im Januar das erste iPad präsentiert wurde: 10 Zoll großes iPhone, mit dem man nicht telefonieren konnte und das v.a. keinen Flash abspielen konnte, sodass ein paar Monate später Steve Jobs in "Thoughts on Flash" begründet hat, warum das iPad keine Flash-Filme abspielt, denn Flash war damals noch sehr verbreitet im Web. Und wiederum kurz danach, im Juni 2010, erschien dann dieser HTML5 Showcase. Ich zeige das mal ganz kurz im Browser: Hier ist das Apple iPad, erste Generation. Steve Jobs hält es hoch, im Januar 2010. Im April begründet er hier auf "apple.com/hotnews/thoughts-on-flash" 6 Gründe, warum iPads und iPhones kein Flash können. Letztendlich sagt er, es ist ein Ding von gestern. Und dann kommt zwei Monate später dieser Showcase, der auf der Startseite mit Video anfängt. Hier kann man einen kurzen Ausschnitt von Drown gucken. Man kann hier skalieren, das Video grösser und kleiner machen - Ich lasse das jetzt mal nicht abspielen, dann funkt uns der Sound dazwischen - man kann sogar maskieren und Ausschnitte davon zeigen, hier mit einer Maske. Interessant wird es aber, wenn ich jetzt mit rechts draufklicke, dann kommt hier bei diesem Video kein Flash, sondern hier steht einfach nur "Start", "Stumm", "Schleife" usw. und wenn ich auf "Element untersuchen" klicke, dann sehen Sie hier: Das ist ein Element "Video", das es bis dahin nicht gab. Das ist also neu im HTML5: Zum Abspielen von Videos braucht man also nicht mehr unbedingt zwangsläufig Flash. Weiter geht es hier mit Typographie: Das sind so die Showcases. Der Nächste hier: Typographie im Web. Da unten steht kurz erklärt, worum es hier geht: "CSS3 und SVG scalable vector graphics allow you to embed vector based forms". D.h. also Schriften, die man wunderbar skalieren kann, die man in sämtlichen Details hier verändern kann. Natürlich müsste man in Echt "Code" schreiben, diese Schieberegler gibt es noch nicht so richtig, Schatten dran und alles mögliche. Sie können sogar selbst hier rein schreiben und dann damit rumspielen. Ich mache es mal ein bisschen kleiner, rotation wieder ein bisschen zurück, das leading also davor etwas weiter. Hier gibt es noch ein paar andere Beispiele: Hier alles, dass ist ohne Grafiken realisiert. Das ist nur CSS3. Und da ist jetzt die Frage, was hat das mit HTML5 zu tun, denn es steht hier ganz untendrunter, das ist alles CSS, was hier gezeigt wird. Genauso hier gibt es Galerien 2D und 3D. Es macht wirklich Spaß, damit herum zu spielen. Hier eine Bildergalerie - und unten drunter steht gleich: "CSS transitions and transforms" stehen hier hinter, also wieder eher CSS. Dann der nächste Showcase hier und hier "transitions", der heißt dann schon gleich "transitions". CSS 2D und 3D . Da kann man dann zum nächsten Bild Übergänge bringen - allerdings, wie gesagt: Das ist nur begrenzt HTML5. Hier haben wir den Typographie, den hatten wir schon. Hier kommt der Showcase mit virtual reality: Da kann man rumgehen. "CSS 3D transforms" steht darunter - das ist die opening vom Apple Store Fifth Avenue oder so etwas wird hier gezeigt. Das ist schon recht beeindruckend hier auch diese virtual reality Geschichte. Mit HTML5 hat das Ganze aber nur begrenzt zu tun, denn hier wird HTML5 gebraucht als Begriff, als Umschreibung für das eigentliche HTML5, das CSS3 und JavaScript - also für die gesamte Sammlung und JavaScript spielt hier eine sehr große Rolle, bei dem hier Gezeigten. Nichtsdestotrotz macht es Spaß, sich das einmal anzugucken. Hier noch ein kurzer Blick auf "Audio" - den sind wir eben übersprungen: Hier kann man Sounds abspielen, hier ist ein Abspielgerät und wenn ich hier auf "Elemente untersuchen" gehe, dann werden Sie gleich sehen, dass hier das Element "Audio" -- Genau wie "Video" gibt es das Element "Audio": ein HTML-Element, wie wir browser native - also nativ, wie man Neudeutsch so schön sagt - das abspielen kann, ohne Plugin. HTML5 ist also ein Synonym dafür, dass das Web fit wird für Webanwendungen, dass Browser von Haus aus Dinge können, für die Sie vorher Plugins wie Flash und andere Dinge benötigten.

HTML5 für Webdesigner

Lernen Sie, wie Sie in HTML5 Layoutbereiche strukturieren, die richtigen Elemente für Inhalte benutzen, Formulareingaben optimieren und Multimedia ohne Plug-in einbauen.

3 Std. 14 min (39 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!