animated gif: Lizenz / Alternative

  • Ich würde gerne Kurzanimationen auf meiner Seite haben, bin mir aber unsicher wegen gif, gab's da nicht was mit Lizenzen? Gibt's verbreitete Alternativen?

  • Das kommt jetzt einzig auf die Bilder an, GIF - Graphics Interchange [File] Format ist nur das Dateiformat und unterliegt somit keinen Rechten um welche du dich kümmern müsstest.


    Wenn die Bilder von dir selbst sind (das schließt nicht nur das GIF-Bild sondern auch die Einzelbilder, egal welchen Formats, ein), dann kannst du sie nach Belieben einsetzen. Ausnahmen bilden hierbei Jugendgefährdende Inhalte und ähnlicher Mist der im Internet nur wenig verloren hat, hier musst du dich an einige Richtlinien halten, bei Interesse gerne ein neues Thema eröffnen.


    Wenn die Bilder von anderen Autoren stammen musst du dich schlau machen unter was für Bedingungen sie eventuell verwendet werden dürfen, oder du fragst persönlich (freundlich) nach der Erlaubnis ein bestimmtes Bild nutzen zu dürfen, ich darf zitieren:


    Copyright von Bildern


    I. d. R. unterliegen Bilder und Grafiken (auch Bereiche davon) einem Copyright - also jemand hat die
    Rechte an dem Werk. Daher sollten Sie, um rechtliche Probleme zu vermeiden, entweder nur eigene
    Werke verwenden oder den Copyright-Besitzer fragen, ob er einer Verwendung auf Ihrer Homepage
    zustimmt. Am Beispiel des oben verwendeten Verkehrszeichens war das eine freundliche E-Mail, die
    ebenso schnell wie freundlich zurückkam mitsamt der Zusage.


    Die meisten Bilder welche heute von Privatpersonen für andere veröffentlicht werden, laufen unter Creative Common Lizenzen, alles dazu kannst du auf der angegebenen Seite nachlesen. Ist dies der Fall findet sich die entsprechende Info unter dem Bild.


    Bedenke bitte auch das die Qualität der Grafiken (256 Farben lassen grüßen, lebe wohl Kantenglättung) für den heutigen Webstandard nicht mehr unbedingt geeignet ist, ich weiß ja aber auch nicht was genau du vorhast :love:


    Verbreitete Alternativen zu GIF-Bildern sind (für Designelemente) mittlerweile tatsächlich andere Techniken. Für animierte Menüpunkte zum Beispiel reine CSS-Animationen (transitions). Für größere Animationen im Hintergrund oder im Kopfbereich stirbt mittlerweile selbst Flash aus und wird von per HTML eingebundenen Videos abgelöst.


    Andere Einsatzmöglichkeiten für GIF-Bilder wären dann zum Beispiel animierte Smileys (obwohl ich persönlich selbst davon kein Fan bin), hier fällt mir keine plausible Alternative ein.


    Wenn du genauer erklären könntest was genau du mit Kurzanimationen meinst könnten wir dir sicher konkreter helfen.

  • Wenn du genauer erklären könntest was genau du mit Kurzanimationen meinst könnten wir dir sicher konkreter helfen.

    Bei Wikipedia findet man öfter Kleinst-Animationen in dieser Art: http://commons.wikimedia.org/wiki/File:Involute_wheel.gif


    Bedenke bitte auch das die Qualität der Grafiken (256 Farben lassen grüßen, lebe wohl Kantenglättung) für den heutigen Webstandard nicht mehr unbedingt geeignet ist, ich weiß ja aber auch nicht was genau du vorhast

    Mit Matplotlib (Python) Code erzeugte technische Zeichnungen, d.h. 256 Farben sind eigentlich kein Problem, aber auf Kantenglättung lege ich schon wert und Durchsichtigkeit setze ich auch gerne ein.


    Sowas würde ich z.B. gerne mit einer Handvoll Frames animieren:
    http://www.magben.de/?h1=mathematik_fuer_ingenieure_mit_python&h2=ebene_geometrie_rechteck

  • Für die animierten technischen Zeichnungen eignen sich GIF-Animationen tatsächlich ganz gut, allerdings muss man etwas mit der Kompressionsrate spielen um den Mittelweg zwischen "Qualität" und Leistung (Dateigröße) zu finden.


    Bei den bunten animierten Kästchen rate ich von GIF-Bildern ab, die Beispielgrafik ist zu groß für das Format, Transparenz ist mit 256 Farben eher nicht so hübsch und ohne genug Abstufungen von Schwarz zu Weiß sehen die schrägen Kanten später aus wie gewollt und nicht gekonnt. Ich würde mich dort an deiner Stelle auf die Grafikengine der modernen Browser verlassen, hierzu habe ich mal ein reines HTML und CSS Beispiel erstellt: http://jsfiddle.net/WktU4/
    Wenn das Ganze nicht funktioniert, kann es sein das du einen etwas älteren Browser nutzt, ändere dies oder füge das entsprechende Präfix der CSS3 Befehle transition und transform im CSS Code hinzu, für mehr Infos siehe hier.


    Ein Nachteil ist der Aufwand beim erstellen. Solange es nur kästchen sind die sich drehen, ihre Größe ändern oder sich in Farbe/Transparenz anpassen ist alle gut, sobald es zu Dreiecken oder Kreisen kommt benötigst du dafür Canvas (Kreise könnte man mit runden Ecken auch so darstellen). Coden ist eben auch noch wieder etwas mehr Aufwand als in einem Grafikprogramm animieren, jedoch machst du den Eindruck als wärest du sowieso eher der Coder ;)
    Außerdem muss mit CSS immer eine Mausinteraktion stattfinden um die Animation zu starten, ich persönlich finde das nicht schlecht da in diesem Fall das Auge nicht direkt abgelenkt wird sondern der Besucher erst interessiert den Text liest, dies ließe sich mit einem einfachen JavaScript jedoch umgehen.
    Wenn du tatsächlich zu dieser Methode greifen möchtest kannst du dich gerne noch einmal melden falls du Hilfe benötigst, ich weiß jedoch nicht einmal ob du mit HTML und CSS vertraut bist?

  • Die Frage ist: Wer ist "jemand" und worauf stütz er diese These?


    Den Interpreter wird es kaum interessieren ob da nun ein div vor der Raute zu finden ist oder nicht, außer es handelt sich um eine Klasse welche für unterschiedliche Elemente unterschiedliche Werte besitzen soll. Wenn ich an der Ladegeschwindigkeit meiner Seite arbeite dann beginne ich nicht bei CSS sondern bei Grafiken, JavaScript und PHP Requests.


    Wenn ich mich dann dem CSS zuwende dann entferne ich sicher nicht die Tags der Selektoren bevor ich nicht...

    • verschiedene CSS Dokumente zu einem zusammengefügt
    • Kommentare, Leerzeilen und eventuell nicht genutzten Code, am Schluss auch die Umbrüche entfernt
    • das Dokument mit Hilfe von Archiven und PHP komprimiert

    ...habe.


    Für mich persönlich ist das Gesamtbild meines Stylesheets einfach deutlich übersichtlicher wenn ich so genau wie möglich angebe was ich selektiert haben möchte, gerade mit CSS3 sind da einige neue interessante Möglichkeiten aufgetaucht.


    Wir wollen jetzt nicht vom Thema in diesem Thread ablenken, meiner Meinung nach ist es Geschmackssache und interessiert nur in Ausnahmen (CSS Code von über 3-4.000 Zeilen sind eher selten) ansatzweise.

  • Sofern du zufrieden bist ist doch alles gut? Theoretisch ließen sich die beiden Zahnräder auch als PNG mit transparentem Hintergrund speichern und dann per CSS drehen, letztlich bleibt es dir überlassen.


    Die Animation sieht übrigens auch mit der halben Anzahl der Frames noch relativ flüssig aus, das spart noch mal Dateigröße.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!