Flash ist schon seit langem nicht mehr auf mehreren Plattformen verfügbar. Vor diesem Hintergrund haben wir uns gedacht, dass es nützlich sein könnte, einen Beitrag über die Grundlagen zum Ersetzen von Flash zu schreiben. Im Kern geht es im folgenden Beitrag um die folgende Frage: Was ist HTML5 und was sind seine Bestandteile?
Als erstes müssen wir erwähnen, dass HTML5 Creative nichts Neues ist, weil die Industrie HTML5 Creative schon seit vielen Jahren verwendet. Der Unterschied liegt in den erweiterten Möglichkeiten der neuesten HTML5-Spezifikation, die einen großen Sprung zu HTML4 darstellen und Flash ersetzen können. Ein paar wesentliche Unterschiede zu HTML5 sind, dass es Animationen und reaktionsschnelles/adaptives Design ermöglicht.
HTML5 vs. Flash-Dateien.
Ein Hauptunterschied zwischen einer Flash- und HTML5-Datei besteht darin, dass eine .swf-Datei nur eine einzige Datei war, die alle Bilddateien in dieser Datei enthielt (mit Ausnahme von .flv Flash-Videodateien, die extern bezogen wurden).
Bildkomponenten.
HTML5-Dateipakete bestehen aus einer .html-Datei, die auf die Quelle jedes Bildes verweist, welches Sie benötigt. Abhängig von den Anforderungen der jeweiligen Bildkomponenten werden unterschiedliche Typen von Bilddateien verwendet. Viele Grafiken wie Boxen und Schatten können mit HTML-Code erstellt werden, um die Dateigröße zu minimieren. Die Wahl der richtigen Bildformate zur Optimierung des kreativen Schaffens ist Kunst und Wissenschaft zugleich.
Videokomponenten.
Sofern das HTML5 Creative Videos enthält, ist es erforderlich, mehrere Videodateiformate wie .mp4 und .webm zu verwenden, da diese Formate von verschiedenen Browsern unterstützt werden. Wenn Sie einen externen Player wie YouTube oder Vimeo beziehen, brauchen Sie sich darüber keine Gedanken zu machen, da sie die Konvertierung für Sie durchführen.
Die .html-Datei.
HTML5 verfügt unter anderem über Animations- und reaktionsschnelle/adaptive Designfunktionen, die CSS und JavaScript erfordern. Das CSS und JavaScript kann in die .html-Datei eingebunden werden oder extern über .css- und .js-Dateien bezogen werden. Da jeder externe Aufruf aus der .html-Datei die Ladezeiten verlangsamt, kann es besser sein, diesen Code in die .html-Datei einzubinden.
HTML5 Design Tools.
HTML5-Design-Tools wie Flexitive können Designern und Entwicklern dabei helfen, schneller kreativ zu werden. Beispielsweise verfügt unsere Plattform über eine Drag & Drop-Oberfläche, die keinerlei Code erfordert und optimiert Bilder, Größen und Code automatisch, um die bestmöglichste kreative Qualität mit den kleinstmöglichen Dateigrößen zu erzielen.