The long and short of GIF and JPEG

The 2 misused file types

Do you oftentimes feel confused what to use for your web images-- GIFs or JPEGs? And more importantly why?

Great. You deserve kudos as confusion leads to comprehension. Here is what you have been looking for all the way!

Essentially, they are formats in which web images are created in. Any file with a .jpeg or .gif extension is recognized, by a browser, as an image file.

A good web site is partly one that will load quickly into a browser. Agreed? Well, for this to happen, your web page has to be small in file size. The GIF and JPEG file formats compresses images so that it is web worthy.

This is vital for you that you don't mess around when it comes to decide what to use when. Here's what you need to know (a subtle reminder and congrats for tech guys who know it)

GIF ( Graphics Interchange Format)

- Pronounced as "jiff" . Thought you got to know it. - GIF was the first-ever image format created for use on the web. This implies that all browsers of all versions can              read images in the GIF format. - GIF can icorporate transparency . This is great. Isn't this ? Especially so when you wish your graphic to blend in            with your background. - GIF compresses an image using LZW compression . Confused? Simply put, this means that the quality of your image               does not degrade when it is compressed. Deterioration in image begins to crop up only when it is having more than             256 colors. - Good results can be had using GIF when there is a large area of flat color in the image. And when it uses fewer               colors. The fewer colors, the better. - GIF can be animated . All animations, barring the more advanced Flash movies, are GIF files.

JPEG ( Joint Photographic Experts Group)

- Pronounced as "jay-peg" . Okay, as of now you know how both are pronounced. - JPEG uses a lossy compression scheme . This means that you will, in fact, lose some data during compression. The              more you compress, the more quality you lose. You will, therefore, have to strike a right balance between image               file size and quality.     - JPEG compression rate can well be controlled . The higher the compression rate, the lower the size of the image.              And as you have guessed, eh? The lower the quality. - JPEG is optimally used for photographic images . The more colors and subtle gradients an image has, the better. - Browsers take a longer time to display JPEGs.

Demarcating features of JPEG and GIF

One of the worst mistakes (hopefully you won't make any longer) a web designer can make is to opt the wrong format for a particular type of image. As a thumb rule, for images with few flat colors, choose GIF. Images with lots of colors and gradients, you may go for JPEG.

Simple enough. Here is your turn to appreciate a couple of somewhat tricky tech understanding with regard to JPEG and JIFFa?|

Pertaining to JPEG, if the horizontal rows of pixels undergo change frequently without patterns, then a JPEG may allow for a smaller file even if it is having few colors only.

For designers if they can save a few kilobytes on each image, it can drastically improve the loading time of image-loaded pages intended for users with slow connections.

Further, though you can have animated GIFs, this is rarely a good idea in terms of design.

There are a few things you can do with GIFs that you can't do with JPGs. The best way to get the smartest web images and graphics is up to you: technology is at your disposal only to be selectively used for spectacular results. So get going to harness tech understanding!