How to create animated GIFs for your blog, website, email and messages

Use this step-by-step guide to create animated GIFs that will make your blog posts, emails and messages more fun!

Animated GIFs have been around since the early days of the web, but they are still used today and they can be funny, interesting, and sometimes irritating. Create your own with these tools.

Animated GIFs are those images that display a short animation lasting a few seconds, often repeating in a never-ending loop. They were once very popular because they were an easy way to add animated and movement to an otherwise static and boring web page.

They became over used and when a web page has several of them they can be irritating instead of entertaining. Their popularity waned and websites used fewer of them. They almost disappeared completely.

However, with the rise of social networks and messaging, the animated GIF is making a comeback. These days you can create an animated GIF that goes viral – in other words gets shared and linked to by thousands or tens of thousands of people.

That can bring a lot of traffic to your website or massively increase exposure of your blog or brand. They can be a marketing tool when done in the right way. They can also be used to brighten up a dull web page.

Another use for them is as a replacement for a slider. If you have several images that you want to show in sequence, it is possible to turn them into an animated GIF that shows each image automatically.

An animated GIF can be used to show how to perform some action or task. For example, screen shots of using software on the computer or phone, a time lapse video of a painting, drawing, construction, renovation and so on.

There are lots of uses for animated GIFs, so how are they made?

It is possible to create them with some photo editors and similar image editing tools on the computer, but there are simpler solutions on the web. There are several websites that make animated GIFs for you and they are very easy to use.

Giphy Cat

Let’s take a look at a couple of them.

GIFMaker.me

1 Use GIFMaker.me

Create animated GIFs at the GIFMaker.me website

Go to GIFMaker.me and there is an easy to use online tool for making animated GIFs. Click the Upload Images button to begin.

2 Select the images

Select images to turn into a GIF

A GIF is made up of two or more images and you must have these ready. I loaded an image of a cat into GIMP photo editor and then added some hearts, a star and Meow! text. Every time I added something to the image, it was saved with a new name. Cat1.jpg . . . Cat5.jpg.

Select the images and click Open to upload them to GIFMaker.me

3 Customise the settings

Create animated GIFs at the GIFMaker.me website

If the images are not in the right order for the animation, click and drag them to rearrange them. In the panel on the right, set the size of the image in percentage or pixels.

The set animation speed (the length of time each image is displayed), and the number of times to repeat it. A value of zero repeats forever.

4 Save the animated GIF

Save the animated GIF created at the GIFMaker.me site

Down at the bottom of the right hand panel is the link to download the GIF. Save it to disk and it is ready to be used on your blog, Facebook, email or message.

 

Giphy

1 Use Giphy GIF Maker

Giphy GIF Maker

You may have heard of Giphy and it is one of the most popular sources of animated GIFs. Go to the home page and you can browse them – there are some excellent ones.

The site also has a GIF Maker and this online tool enables you to create your own animated GIFs. It is a powerful tool and it enables GIFs to be made from a series of photos, a video or from YouTube and Vimeo videos.

Click a button to select and upload photos or a video.

2 Slideshow settings

Giphy GIF Maker

Any number of images can be uploaded, but for this GIF I uploaded just one. The length of time each image is displayed can be set.

3 Add text

Add animated text to images to create GIFs using Giphy

Text can be added to the image and there is an option to animated it. You can’t see this, but the text here is wavy, rainbow, typed and so on – all animated. This means you can start with a static image and make it into an animated GIF with these text effects.

4 Upload to Giphy

Create an animated GIF using GIphy GIF Maker

The image must be uploaded to Giphy. Enter the URL of your blog and then click the button.

5 Download the GIF

Download the animated GIF from Giphy

The animated GIF is displayed and there are options to copy a link, download it, or get code to embed it. Click Download and save it to disk. Then it can be used wherever you want.

The download options include the original size and sizes optimised for different uses, such as sharing on social media.

Why you should not use animated GIFs

Large file sizes: An animated GIF can contain several images that are used as the frames of the animation, so they can be several times the size of a single static image. This slows down the loading speed of the web page.

Irritation: Too many animated GIFs can be irritating and distracting. Keep them to a minimum

Small size: Because GIFs contain multiple images, to keep the file size reasonably small, the image dimensions are usually small. Animated GIFs are rarely more than 300 or 400 pixels square.

 

Affiliate links

Be the first to comment

Leave a Reply

Your email address will not be published.