How to use GIF’s: the only guide you need


How to use Gif’s ? A question that a lot of people ask but get unanswered to. So, I’m going to show you how to use gifs- be it your webpages or social media sites.

The popularity of gif’s(.gif) in web-design can’t be unseen. It’s amazing, it’s popular, it’s free, it’s supported, yadda,yada,yada. I’m not here to talk about gif’s, but rather how to use gif’s. So, let’s get started.

History

I know, we weren’t here to talk about the history or stuff, but it’s good to know a little about gif’s. So, I’m no expert, so this excerpt is from Wikipedia:

The Graphics Interchange Format is a bitmapimage format that was introduced by CompuServe in 1987 and has since come into widespread usage on the World Wide Web due to its wide support and portability.

The format supports up to 8 bits per pixel for each image, allowing a single image to reference its own palette of up to 256 different colors chosen from the 24-bit RGB color space. It also supports animations and allows a separate palette of up to 256 colors for each frame.

Oof! Thanks to wikipedia to do all the heavy lifting for us. Hope it stays forever. Ok, that’s besides the point. Now, let’s get to the point.

In this post, I’ll show how to make gif’s and use them to your advantage.

First, go to makeagif.com. From there, you can see the home screen. It has a big green button that says add pictures. It’s ought to do what it says.

makeagif homepage
makeagif.com homepage

So, from there, we click on the add pictures button, then you select which pictures you want to use. [several, of course]. The, it will upload the images:

how to use gifs, step 2 | WDA

Then, click on continue. it will load a screen on which you can select various options and details of your gifs. For demonstration purposes, I’ve named it wda example gif. With animation speed, slow [750ms delay], resized image to the smallest cropped and chose  the miscellaneous category. Then selcect the type of images you have made. And, finally you’re done. Click “create your gif ” button. After some time, depending on the size and number of images, your gif will be there for you to download. Click the download button, And you’re done!

You’ve finally created a gif which you can use anywhere you want. Also, you may notice, that there is a watermark called makeagif.com. In case, you want to remove that, register for the site and you’ll have watermark free images. Here’s the one I created in the tutorial:

How to make a gif result | WDA

So, what are your creative examples with a gif ? Perhaps a product demo, fun, etc. Do tell me these in the comments below.

Enter your email address to follow this blog and receive notifications of new posts by email.

Add your Awesome voice. Let's have a meaningful conversation. And remember, don't be a spammer (We hate 'em).

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s