Images – JPG & GIF

applejpggifGraphics, images and colors never fail to attract attention – and you will want to use some form of images on your website. This might be your logo, pictures of your products, animations and/or symbols. There are many different types of graphic and image files but for our purposes today we will be talking about the two most widely used image formats – JPG and GIF.

  • JPG stands for Joint Photographic Group
  • GIF stands for Graphical Interchange Format.

The main difference between the two is the number of colors used in the image. A JPG image will use 16 million colors while a GIF image will use only 256 colors.

You can probably figure out for yourself that an image with 16 million colors will be a sharper image than a GIF image with 256 colors. And while this is true, the JPG image file will be larger in size. For example: An 800 x 800 pixel size JPG graphic might have a file size of 1.2 MBytes, where as the same image in the GIF format would have a file size of 812 KBytes. You can see there is a significant difference.

This becomes important if you have limited hosting space or if the image is very large and you want your page to load quickly. You will have to give some thought to which format to use depending on your need. The larger the file, the slower to load – particularly if the visitor to your page is on dial-up Internet service. I have found that in most cases there is very little difference to the eye between a JPG and a GIF. And, while you may notice a difference on your monitor, remember that you have no way of knowing what type of monitor the viewer will be using to view your website. This can effect the quality of the image dramatically. Therefore, my preference is to always opt for fast loading.


Whether or not you use animation is based on what message the graphic is trying to convey. Will the animation be of benefit or will it be an irritant? Some people do not like repeated movement and personally there are a few pages I won’t visit because of the irritating animations.

If you decide to use an animation:

  • Consider the size and number of graphics inside the animation
  • What message are you are trying  convey 

Do you want to grab attention with the word ‘FREE’ and then have the second graphic in the animation display the ‘free offer itself’? If so, how many times do you want this animation to display? Once? Twice? or Continuous? And at what speed. You must decide what best serves your purpose.

Yes, you want to get attention, but not at the expense of loosing your viewers.  Also, you should consider how long will it take the animation to load. The larger the file – the longer the load time. Ask yourself . . . “Is it a good trade off to have an animation that takes 10-15 seconds to load vs. a single image that will load is less than 3- 5 seconds?”

anistarIf the animation is only meant to attract attention to a particular section of the page you can look at animating smaller images. In this case, the animation might simply be having an alternating ‘word/graphic – word/graphic’ theme or the same word on two different colored backgrounds.

Good graphics and images can make a page zing – look at how Bing uses different photos daily to get people to return to their site .  Get a good graphics program and then learn to use it. Play around with different images and techniques. There are some free programs out there you can download and use, one of which is Gimp. However, if you are planning on building a business, you will need a good graphics program that offers a variety of tools and effects. A good, affordable graphics program is Jasc Paint Shop Pro 7.0. It gives you all the applications – including animation – that you will need.

Comments are closed.