¿Cómo puedo eliminar los píxeles blancos alrededor de los bordes al exportar un GIF transparente?

Tomé los cargadores de xooplate.com y luego los exporté con la ayuda de la acción incluida a un GIF. Pero tengo algunos píxeles blancos alrededor del cargador que son realmente molestos cuando se muestran sobre un fondo oscuro. Puedes verlo aquí, en un marco que extraje del gif:

¿Cómo puedo evitar esos píxeles blancos y mantener el fondo transparente?

La forma en que la transparencia funciona con gifs / pngs de 8 bits es que un píxel es totalmente transparente u opaco .

En las esquinas de un círculo donde el círculo se mezcla transparentemente con el fondo, generalmente hay píxeles que son semitransparentes para suavizar la transición. Esta transición suave no se puede reproducir completamente con gifs / pngs de 8 bits.

Una forma de fingir esto es seleccionar un fondo mate para todos esos píxeles semitransparentes. Esto significa que los píxeles que no son completamente transparentes obtienen su color calculado como si estuvieran encima del color mate.

Los píxeles blancos en su círculo gif sucedieron así, porque el gif fue creado para ser utilizado contra el fondo blanco. Los píxeles semitransparentes del círculo original se rasparon contra el color blanco mate, dando como resultado píxeles casi blancos pero completamente opacos alrededor de las esquinas.

La forma de remediar esto si tiene el círculo original totalmente transparente es save for web & devicesseleccionar un color mate que se adapte a su fondo. De esa manera, los píxeles potencialmente semitransparentes se fusionarán con píxeles completamente opacos contra el color mate, y si se visualizan en su sitio web con un color de fondo similar, parecerá completamente uniforme. Tenga en cuenta que a) los gráficos con pequeños rangos de áreas semitransparentes (en píxeles) funcionan mejor, yb) esto requiere que el fondo con el que se muestra el gif sea algo de eso en un color consistente que elija para su mate.

En esta imagen

• La parte superior izquierda es el gráfico redondo original con esquinas suavizadas, es decir, suavizadas.
• El mismo resultado que obtienes con png-24, como se ve en la esquina superior derecha, pero esto no funciona para la animación.
• La vista inferior izquierda muestra cómo los píxeles semitransparentes del gráfico se transponen al color rojo mate seleccionado. Observe también cómo esos píxeles, que son completamente transparentes, permanecen completamente transparentes. Mientras que solo aquellos píxeles que tienen un poco de transparencia se "superponen" con el color mate, y los píxeles totalmente opacos no se ven afectados por la configuración de transparencia (sin embargo, se ven afectados por las selecciones de tipos y colores de tramado).
• La parte inferior derecha se parece al tipo de opciones de exportación que se usaron para su imagen de ejemplo. Con un blanco mate seleccionado, los mismos píxeles que muestran rojo en la imagen inferior izquierda, mostrarán blanco en la imagen inferior derecha. Esto es perfectamente aceptable si lo muestra sobre fondo blanco. Con otros fondos más oscuros, los píxeles blancos se muestran porque usan el color mate incorrecto para crear píxeles completamente opacos para cualquier píxel que no sea completamente transparente.

Vea los dos gifs exportados con rojo y blanco mate en esta imagen, con un fondo diferente. Esto muestra cómo el rojo mate se combina muy bien con un fondo rojo, pero también lo perturbador que se ve el blanco mate sobre un fondo negro.

Si se encuentra en una situación desafortunada, que no tiene el archivo original con alphas completos con alias (es decir, solo tiene el gif de 8 bits), es problemático revertir este raster mate: píxel por píxel debe eliminarlo el color mate de los píxeles semitransparentes y luego reexportarlos con configuraciones más apropiadas.

En el cuadro de diálogo Guardar para Web, asegúrese de establecer el color Mate a la derecha de la ventana en el color del fondo de su página web.

Los GIF no admiten una transparencia total de 8 bits, solo admiten una transparencia de 1 bit. Lo mejor que puede hacer es usar un color que coincida con el fondo de la página web para que la imagen se mezcle fácilmente con ese color.