Przezroczystość działa w przypadku 8-bitowych gif / pngs, ponieważ piksel jest albo całkowicie przezroczysty, albo całkowicie nieprzezroczysty .
W rogach koła, w których koło miesza się przezroczyście z tłem, zwykle znajdują się piksele półprzezroczyste, aby wygładzić przejście. To płynne przejście nie może być w pełni odtworzone za pomocą 8-bitowych gif / pngs.
Jednym ze sposobów udawania jest wybranie tła matowego dla wszystkich półprzezroczystych pikseli. Oznacza to, że piksele, które nie są w pełni przezroczyste, obliczane są tak, jakby były na wierzchu koloru matowego.
Białe piksele w twoim gifie koło tak się dzieje, ponieważ gif został stworzony do użycia na białym tle. Półprzezroczyste piksele oryginalnego koła zostały rastrowane względem białego matowego koloru, co spowodowało powstanie prawie białych, ale całkowicie nieprzezroczystych pikseli wokół rogów.
Sposobem na zaradzenie tym , jeśli masz oryginalny, całkowicie przezroczysty okrąg jest save for web & devices
i wybierz kolor matowy, który odpowiada Twoim tła. W ten sposób potencjalnie półprzezroczyste piksele zostaną scalone w całkowicie nieprzezroczyste piksele w stosunku do koloru matowego, a oglądane na twojej stronie internetowej z podobnym kolorem tła, będą wyglądać w pełni gładko. Zauważ, że a) grafika z małymi zakresami półprzezroczystych obszarów (w pikselach) działa najlepiej, i b) wymaga to, aby tło, na którym wyświetlany jest gif, było częścią tego, co w jednolitym kolorze, który wybierzesz jako matowy.
Na tym obrazku:
- W lewym górnym rogu znajduje się oryginalna okrągła grafika z wygładzonymi, tj. Wygładzonymi narożnikami.
- Taki sam efekt, jaki otrzymujesz w przypadku png-24, jak widać w prawym górnym rogu - ale to nie działa w przypadku animacji.
- Lewy dolny widok pokazuje, w jaki sposób półprzezroczyste piksele grafiki są transponowane na wybrany czerwony matowy kolor. Zwróć też uwagę, jak te piksele, które są całkowicie przezroczyste, pozostają całkowicie przezroczyste. Podczas gdy tylko te piksele, które mają odrobinę przezroczystości, są „podkładane” kolorem matowym, a w pełni nieprzezroczyste piksele pozostają całkowicie niezmienione przez ustawienia przezroczystości (jednak wpływają na nie wybory typu ditheringu i kolorów).
- Dolny prawy róg przypomina rodzaj opcji eksportu, które zostały użyte dla twojego przykładowego obrazu. Po wybraniu białego elementu matowego te same piksele, które pokazują kolor czerwony na lewym dolnym obrazie, pokażą biały na prawym dolnym obrazie. Jest to całkowicie do przyjęcia, jeśli pokażesz to na białym tle. W przypadku innych, ciemniejszych tła białe piksele są wyświetlane, ponieważ użycie niewłaściwego koloru matowego powoduje utworzenie w pełni nieprzezroczystych pikseli dla pikseli, które nie są w pełni przezroczyste.
Zobacz oba gify eksportowane z czerwoną i białą matą na tym obrazie, na innym tle. To pokazuje, jak czerwony mat ładnie miesza się z czerwonym tłem, ale także jak niepokojący jest biały mat na czarnym tle.
Jeśli znajdujesz się w niefortunnej sytuacji, że nie masz oryginalnego pliku z pełnym anty-aliasingiem alf (tj. Masz tylko 8-bitowy gif), kłopotliwe jest odwrócenie tego matowego rastrowania - piksel po pikselu musisz usunąć matowy kolor z półprzezroczystych pikseli, a następnie ponownie wyeksportuj je z bardziej odpowiednimi ustawieniami.