Photoshop Question posted in
The official user guide can be found here.

Optimizing extra large animated gifs – Photoshop

Working on a project that requires 10 large animated gifs to be loaded on a site. We are having trouble reducing the file size. Each image is 1200px high (varying widths) and include dozens of frames. Photoshop save for web function gets them down to 4MB which is still too large and grainy.

Also good to note: uploading these to WordPress site.

Any ideas about optimizing images or load time or both?

Tags:

2

Answers


  1. 0

    Try ImageMagick and compare file sizes – it is here and free.

    Making an animated GIF is as easy as:

    convert -delay 20 -loop 0  *.jpg  animated.gif

    or using GIF input frames:

    convert -delay 20 -loop 0  *.gif animated.gif

    You can also experiment with the -quality n% option to reduce quality and size. There is also an extremely informative discussion of optimisations to palettes, dithering, compression and so on, here.

    Login or Signup to reply.
  2. 0

    To the best of my knowledge, you have to work yourself out of:

    • number of frames, reduce until the animation breaks down
    • number of colors, reduce until the image breaks down
    • image size, reduce width/height until quality degrades

    All that inside your preferred GIF animation editor. Make a batch of trial and error exports until achieving a decent setting. After that, no much gains will be possible.

    Just researched and found that

    Steps for Smaller GIFs

    If you want the smallest possible GIFs, keep LZW’s row-oriented behavior in mind: GIFs compress by removing horizontal redundancy. Try not to introduce extra vertical detail or noise into GIF images. Horizontally oriented bands of color compress better than vertically oriented bands. Avoid dithering, it breaks up those lovely minimizable rows of color. These characteristics of the LZW compression algorithm are best shown by example (Figure 11).

    GIF files can be saved in two ways: consecutive (top to bottom) and interlaced (8th row, 4th row, 2nd…). Interlacing displays a low-resolution image quickly, which gradually comes into focus, at the expense of additional file size.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search