Welche Einstellungen verwende ich, um eine qualitativ hochwertige *.gif-Datei zu exportieren?

Ich habe mit dem Formwerkzeug (Ellipse) ein Loader-Animationssymbol erstellt. Aber wenn ich meine Animation exportiere, hat der Kreis gezackte Kanten und die Qualität ist nicht gut.

Was sind gute Einstellungen, um diese Kanten zu vermeiden und eine hohe Qualität .gifals Ergebnis zu erzielen?

Hallo Bushra, willkommen bei GDSE und danke für deine Frage. Wenn Sie mehr über die Website erfahren möchten, besuchen Sie bitte das Hilfezentrum oder pingen Sie einen von uns im Chat an , sobald Ihr Ruf ausreichend ist (20). Tragen Sie weiter bei und genießen Sie die Seite!
Exportieren Sie es mit transparentem Hintergrund? .gifskann keine Halbtransparenz anzeigen, sodass Sie gezackte Kanten erhalten würden.
"high quality gif" erscheint mir wie ein Oxy-Idiot.

Antworten (3)

Es gibt wirklich kein hochwertiges GIF. Das Format wurde Anfang der 1990er Jahre entwickelt und ist auf 256 Farben begrenzt, von denen eine vollständig transparent sein kann.

Das Beste, was Sie tun können, ist, es für die aktuelle Hintergrundfarbe zu optimieren und Füllungen und Mischungen zu wählen, die nicht viele Zwischentöne beinhalten.

Wenn Sie ein einfaches Spinner-/Throbber-Symbol wünschen und Ihr Ziel moderne Browser sind, können Sie mit CSS-Animationen und/oder SVG viel bessere Ergebnisse erzielen.

Gifs unterstützen nur 1-Bit-Transparenz (was bedeutet, dass ein Pixel entweder vollständig transparent oder überhaupt nicht transparent ist). Je nach Fall können Sie also die Dithering- Option (altmodisch) verwenden oder die matte Farbe an Ihre Hintergrundfarbe anpassen. Eine frühere und vollständige Antwort finden Sie in diesem Thread: Wie kann ich die weißen Pixel an den Rändern entfernen, wenn ich ein transparentes GIF exportiere?

Oder erkunden Sie neue und moderne Möglichkeiten mit SVG-Symbolen und CSS3-Animationseigenschaften , um saubere und skalierbare Ergebnisse zu erzielen. Werfen Sie einen Blick auf diese Website, um diese Option zu erkunden: http://codyhouse.co/gem/animate-svg-icons-with-css-and-snap/

Ich habe mir erlaubt, etwas klarzustellen. Fühlen Sie sich frei zu bearbeiten oder zurückzusetzen, wenn ich Grenzen überschritten oder Dinge über Ihre Absicht hinaus geändert habe.

Wo verwendest du dieses GIF? Auf einer Webseite?

Wenn dies der Fall ist, würde ich empfehlen, CSS3-Animationen als primären Loader zu verwenden, da diese die reibungslosesten Ergebnisse liefern. Hier sind einige Beispiele . Beachten Sie, dass dies keine Bilder sind, sondern Formen, die vom Browser gerendert und transformiert werden.

Eine animierte Dateisicherung ist jedoch keine schlechte Idee, da ältere Browser (wie IE9 und darunter) keine CSS3-Animationen unterstützen.

Leider sind GIFs, wie bereits erwähnt, nicht wirklich großartig, sodass Ihr Fallback von schlechterer Qualität sein wird als native CSS3-Lösungen.