Die bringen Bewegung ins Web: GIFs, Flash, HTML5 & Co.

Lesezeit ca.
Minuten

Die bringen Bewegung ins Web: GIFs, Flash, HTML5 & Co.

Denkt man an Animationen im Internet, fallen einem unweigerlich die gruseligen kleinen bunten GIF-Bildchen ein, die vor einigen Jahren fröhlich über gefühlt jede zweite Website wackelten. Sie sorgten für Unterhaltung oder vertrösteten die Besucher von „Under Construction“-Seiten mit animierten Schaufeln.

Denkt man an Animationen im Internet, fallen einem unweigerlich die gruseligen kleinen bunten GIF-Bildchen ein, die vor einigen Jahren fröhlich über gefühlt jede zweite Website wackelten. Sie sorgten für Unterhaltung oder vertrösteten die Besucher von „Under Construction“-Seiten mit animierten Schaufeln.

Nach und nach wurden die GIF-Animationen von Flash abgelöst. Nicht nur Banner, sondern auch ganze Flash-Websites fanden ihren Platz im World Wide Web. Allerdings ließ die Freude über das damals als Nonplusultra geltende Flash bald nach, als Stimmen über gravierende Sicherheitslücken im Adobe Flash-Player laut wurden. Dazu kamen kritische Worte des Apple-Gründers Steve Jobs, denn Flash leerte die Akkus von Smartphones im Handumdrehen.

Apple schoss durch die Decke und fand immer mehr begeisterte User – allerdings schlug das System niemals eine Brücke zu Flash. Die fehlende Kompatibilität mit Apples mobilen Betriebssystemen und die Modernisierung der Webbrowser verdrängte die Flash-Animationen mehr und mehr. „Bye bye Flash“ könnte man meinen, denn sogar der Hersteller Adobe selbst verkündete im Juli 2017 das Ende seiner Software. Ab dem Jahr 2020 will das Unternehmen keine Flash-Updates mehr veröffentlichen.

Trotzdem findem sich hin und wieder noch Websites, deren Betreiber scheinbar nicht von Flash loslassen wollen – oder einfach den Wandel der Zeit und den damit verbundenen Fortschritt der Technik ignorieren.

Grenzenlos flexibel: HTML5

Dabei gibt es mittlerweile einige wunderbare Alternativen! Zum Beispiel HTML5-Animationen. Sogar YouTube hat komplett von Flash auf HTML5 umgestellt. Nicht ohne Grund: HTML5 hat beispielsweise den Vorteil, dass jedes Endgerät und alle modernen Browser damit umzugehen wissen – auch wenn die Darstellung evtl. aufgrund der noch recht jungen Technologie nicht überall zu 100% gleich ist. Und auch mit Blick auf die Performance tut sich HTML5 positiv hervor.

Websites mit viel Textinhalt lassen sich nicht nur durch statische Bilder auflockern. Um ein Vielfaches ansprechender werden sie beispielsweise mit bewegten HTML5-Infografiken, die den Inhalt des Textes veranschaulichen. Komplexe Systeme oder Arbeitsvorgänge können dem Betrachter auf diesem Weg nähergebracht werden.

Ein Beispiel: die von uns umgesetzte Website von Veramaris

Totgesagte leben länger: die Rückkehr der GIFs

Doch nicht nur mit HTML5 kann man im Web punkten. Wer hätte gedacht, dass die GIF-Animationen noch einmal ihr Comeback feiern? Genau das passiert zurzeit: Vor allem die in Sozialen Netzwerken kursierenden GIFs erfreuen sich an wachsender Beliebtheit. Zu finden sind die kurzen Clips aber nicht nur auf Facebook & Co., sondern auch in Messenger-Diensten wie WhatsApp.

Die oft sehr unterhaltsamen GIFs sind vergleichbar mit einem Daumenkino: es ruckelt, anstatt zu fließen, macht aber trotzdem Spaß. Für Social Media sind GIFs also derzeit eine gute Wahl. Zum Präsentieren von Icons, Infografiken oder Logos hingegen ist das Format eher ungeeignet. Zumal je nachdem, was gezeigt werden soll, die Dateigröße sehr schnell anwächst.

Denn um eine Bewegung zu simulieren, müssen in einem GIF etliche Bilder nacheinander abgespielt werden. Mit unterstützenden Tools kann man den Megabytes zwar an den Kragen gehen, indem man die Datenmenge komprimiert. Aber am Ende bleibt ein GIF eben doch ein GIF, dessen Anmutung sich auch nach einer Komprimierung nicht verändert hat.

Scharfe Technik: SVG

Relativ jung, aber definitiv im Kommen ist die Animation von SVG-Dateien. Durch den Einsatz von CSS, Javascript oder SMIL (basiert auf XML) laufen SVG-Animationen deutlich flüssiger als GIFs. Zudem kann das ganze Farbspektrum genutzt werden. Verlustfreies Skalieren ist ebenfalls ein großer Pluspunkt für die SVG-Animation.

Das bedeutet, dass die Grafiken bei jeder Bildschirmauflösung gestochen scharf und nicht – wie zum Beispiel GIFs – pixelig sind. Darüber hinaus können bei SVG-Dateien Transparenzen dargestellt werden. Und die Dateigröße ist im Vergleich zu anderen Dateiformaten extrem gering.

Auf welche Art und Weise auch immer Sie nun eine Grafik animieren lassen möchten, wir beraten Sie gerne!

Zurück

Interesse geweckt?

Fragen, Feedback oder Themenwünsche?
Sprechen Sie uns an!