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. 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
JIFF...
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!