I’ve recently spent some time on a project that involved generating and sharing some animated gifs and I thought I’d share some insights.

Technologies

The best tool I found for generating animated gifs is Imagemagick. It’s a well established tool with a command line version and a PHP library that allows you to programmatically create almost any type of image manipulation you might need.

The only downside I could find in Imagemagick was that the animated gifs it outputs were quite large, and even using its own compression methods didn’t help a great deal. I solved this by running the results though Gifsicle which is a popular choice for optimising animated gifs.

Gifscicle has three options for compression which give different variations of speed to performance depending on your needs.

Sharing Gifs

We’ve all seen loads of examples of animated gifs shared on our Facebook and Twitter feeds and there are lots of gif search engines out there like Gifly.

I was surprised when I started looking in to these sites that lots of the time they aren’t actually showing you an animated gif but a mp4 video of it.

This is because animated gifs really aren’t a very efficient format for displaying videos. The compression methods use aren’t nearly as effective as mp4 so a 5MB gif might only take 400Kb when encoded as a video.

If you want to use open graph tags to share your gif with Facebook or Twitter you can’t add the gif path in to the og:image tag because it will only show the first frame of your animation. Instead you must convert it in to a video and use the og:video tag on Facebook or the Twitter Player Card tags.

Converting GIFs to Video

I used the FFmpeg library to convert my animated gifs to mp4 video.

FFmpeg is an amazingly powerful library and it’s always my first stop whenever I need to do anything to do with video manipulation.