Wie kann ich beim Exportieren eines transparenten GIF die weißen Pixel an den Rändern entfernen?

Ich habe die Lader von xooplate.com genommen und sie dann mit Hilfe der enthaltenen Aktion in ein GIF exportiert. Aber ich habe einige weiße Pixel um den Lader, die wirklich ärgerlich sind, wenn sie auf einem dunklen Hintergrund angezeigt werden. Sie können es hier in einem Frame sehen, den ich aus dem GIF extrahiert habe:

Wie kann ich diese weißen Pixel verhindern und den transparenten Hintergrund beibehalten?

Die Art und Weise, wie Transparenz mit 8-Bit-Gifs / PNGs funktioniert, besteht darin, dass ein Pixel entweder vollständig transparent oder vollständig undurchsichtig ist .

An den Ecken eines Kreises, an denen der Kreis transparent mit dem Hintergrund verschmilzt, befinden sich normalerweise Pixel, die halbtransparent sind, um den Übergang zu glätten. Dieser reibungslose Übergang kann mit 8-Bit-Gifs / PNGs nicht vollständig reproduziert werden.

Eine Möglichkeit , Fälschen Dies ist ein Hintergrund wählen matt für alle , die halbtransparente Pixel. Dies bedeutet, dass die Farbe der Pixel, die nicht vollständig transparent sind, so berechnet wird, als ob sie über der matten Farbe liegen.

Die weißen Pixel in Ihrem Kreis-GIF sind so passiert, weil sie für die Verwendung vor weißem Hintergrund erstellt wurden. Die halbtransparenten Pixel des ursprünglichen Kreises wurden gegen die weiße matte Farbe gerastert, was zu fast weißen, aber vollständig undurchsichtigen Pixeln um die Ecken führte.

Die Art und Weise , dies zu beheben , wenn Sie das Original haben, vollständig transparent Kreis , ist , save for web & devicesund wählen Sie eine matte Farbe , die Anzüge Ihr Hintergrund. Auf diese Weise werden potenziell halbtransparente Pixel zu vollständig undurchsichtigen Pixeln mit der matten Farbe zusammengeführt und auf Ihrer Website mit ähnlicher Hintergrundfarbe angezeigt. Sie erscheinen vollständig glatt. Beachten Sie, dass a) Grafiken mit kleinen Bereichen von halbtransparenten Bereichen (in Pixel) am besten funktionieren und b) dies erfordert, dass der Hintergrund, vor dem das GIF angezeigt wird, etwas von dem ist, was Sie in einer konsistenten Farbe für Ihre Matte auswählen.

In diesem Bild:

• Oben links befindet sich die ursprüngliche runde Grafik mit anti-aliasierten, dh geglätteten Ecken.
• Das gleiche Ergebnis erhalten Sie mit png-24, wie oben rechts zu sehen - dies funktioniert jedoch nicht für Animationen.
• Die Ansicht unten links zeigt Ihnen, wie die halbtransparenten Pixel der Grafik auf die ausgewählte rote Mattfarbe übertragen werden. Beachten Sie auch, wie diese Pixel, die vollständig transparent sind, vollständig transparent bleiben. Während nur die Pixel mit etwas Transparenz mit der matten Farbe "unterlegt" werden und die vollständig undurchsichtigen Pixel von den Transparenzeinstellungen völlig unberührt bleiben (sie sind jedoch von der Auswahl des Dithering-Typs und der Farben betroffen).
• Unten rechts ähnelt die Art der Exportoptionen, die für Ihr Beispielbild verwendet wurden. Wenn eine weiße Matte ausgewählt ist, werden dieselben Pixel, die im Bild unten links rot angezeigt werden, im Bild unten rechts weiß angezeigt. Dies ist durchaus akzeptabel, wenn Sie es vor weißem Hintergrund anzeigen. Bei anderen, dunkleren Hintergründen werden die weißen Pixel angezeigt, da die falsche matte Farbe verwendet wird, um vollständig undurchsichtige Pixel für nicht vollständig transparente Pixel zu erstellen.

Sehen Sie die beiden mit rot und weiß matt exportierten Gifs in diesem Bild vor unterschiedlichem Hintergrund. Dies zeigt, wie sich die rote Matte gut in einen roten Hintergrund einfügt, aber auch, wie störend sich die weiße Matte vor einem schwarzen Hintergrund zeigt.

Wenn Sie sich in der unglücklichen Situation befinden, dass Sie nicht über die Originaldatei mit vollständigen Anti-Alias-Alphas verfügen (dh Sie haben nur das 8-Bit-GIF), ist es schwierig, dieses matte Raster umzukehren - Pixel für Pixel müssen Sie entfernen die matte Farbe aus den halbtransparenten Pixeln und exportieren Sie sie dann mit geeigneteren Einstellungen erneut.

Stellen Sie im Dialogfeld "Für Web speichern" sicher, dass die Mattfarbe rechts im Fenster auf die Farbe Ihres Webseitenhintergrunds eingestellt ist.

GIFs unterstützen keine vollständige 8-Bit-Transparenz, sondern nur 1-Bit-Transparenz. Das Beste, was Sie tun können, ist, eine Farbe zu verwenden, die dem Hintergrund der Webseite entspricht, damit sich das Bild leicht in diese Farbe einfügt.