Graphics Reference
In-Depth Information
Skinny GIF
Why should you optimize your file visually, instead of just saving it for the web? Every sec-
ond of wait time counts. On the left is part of a large file that will take 3 seconds to down-
load on a fast cable or DSL connection. On the right, the steps for optimizing visually.
1
Minimize the number of colors. Starting with a 64-color preset, I dropped colors from the
palette one by one until I reached the minimum acceptable number for the image.
2
Several colors dropped too soon. I stepped backwards, selected the most important colors
to preserve, and locked them. Locked colors can't be dropped as colors decrease.
3
This image has a lot of flat color and type. Through experimentation, I've found that I need
much less dither at this size. In fact, the type is crisper without it.
4
It was important to hold some details in the topic cover when decreasing the number of
colors. I created a mask of that rectangle and saved it. Then I enabled the mask by selecting
the mask button next to the palette type and protected this small detail from being posterized.
This strategy is called “weighted optimization” and it works for both GIFs and JPEGs.
5
There are different methods of selecting colors for a palette. I used Diffusion here because it
gave the best color fidelity and smallest file size.
6
As a result, the final optimized image will take a full second less to load. That doesn't seem
like much, but when your entire page goal is five seconds, one second is 20% of that time.
