GIF becomes low-quality when exported with Save for Web

[calm_detail7914]

Hello, I recently started learning to make gifs in Photoshop. I made several, exporting w/ "Save for Web (Legacy)", with no problem, but now all of the sudden whenever I try this the output is very low quality. I've attached an image of what the gif looks like in PS, what it looks like after I've exported it, and what my settings are. The output is low quality no matter if I export the optimized version or the original version. Please be warned: I'm very new to PS! I am using a 2016 MacBook Air btw.

[Conrad_C · Accepted solution]

Given the settings shown in the Save for Web dialog box, it can only become low quality…there is no way to avoid it. There are several reasons for this. First, GIF is a very old format that works best with simple flat graphics, its compression doesn’t work well for photos (JPEG compression works much better for photos).

Another reason is that the Image Size is 540 x 386 pixels. That is about the same as the low resolution of the screen on the original 1984 Mac from 41 years ago. If that’s the size you need, like for a website, then that’s OK, but it isn’t a lot of pixels compared to images today. 540 x 386 pixels is only 0.2 megapixels.

A third reason is that the number of colors is set to 32. So it starts out with a photo that might have millions of colors in it, and has to try and reproduce all of the colors of a photo with just 32 colors! The only way to achieve that is dithering. Again, other formats such as JPEG, PNG, TIFF, PSD, etc. all support millions of colors. But even if you were to increase the number of colors in the GIF, the GIF standard only allows a maximum of 256 colors.

So, to fix this, do the following depending on what kind of quality you want to improve:

If GIF is required for your project, then you might not have a choice there. But if it’s possible to use another file format, use something like JPEG or TIFF that reproduces photos better.

If 540 x 386 px is required, then leave it alone, but if your project can use an image with a larger width and height then increase them. That will increase the quality of details.

If GIF is required, then increase the number of colors it uses to its maximum of 256. That will increase the quality of colors and tones. But the GIF maximum of 256 colors is still such a low number that a photo still won’t look as good as a JPEG or TIFF version.

[LAMY2017]

You may want to research the relatively-new animated PNG format (APNG) that can be transparent and animated.