OK, ich höre es jetzt schon. „Schuster bleib bei Deinen …“, oder „Überlasse das Design doch den Designern …“. Ist mir aber egal. Ich liege gerade etwas kränklich auf der Couch und versuche die Zeit totzuschlagen und habe einfach mal mit dem HTML5 Logo herumgespielt. Dabei ist folgende Animation herausgekommen.
Das ganze basiert auf einer Reihe von Bildern, die per CSS Animation in einer Endlosschleife animiert werden.
Jeder der für sein Projekt einen CSS-Ladebalken und/oder eine Animationen benötigt, ist herzlich eingeladen, diese Arbeit zu verwenden.
Demo
http://jentsch.io/wp-content/uploads/2014/05/400/html5-topper.html
Die komplette HTML5 Logo Animation incl. HTML Code, CSS Code und Bilder kann unter http://jentsch.io/wp-content/uploads/2014/05/400.zip heruntergeladen werden.
Ein Github Fork der Animation ist unter https://github.com/msoftware/html5-loading-animation möglich.
Der Download ist kostenlos. Alle Bilder, CSS und HTML Elemente stehen unter der Creative Commons Attribution 3.0 Unported Lizenz.
Alternative Ladebalken und Animationen findet man auch unter http://t3n.de/news/inspiration-css-ladebalken-480481/.
So, nun habe ich wieder ein paar Stunden Zeit totgeschlagen und bin hoffentlich etwas gesünder geworden.