<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
  "http://www.w3.org/TR/REC-html40/strict.dtd"
<HTML>


 <HEAD>
  <TITLE>
   Image Formats
  </TITLE>
 </HEAD>
 <BODY>
 Hypertext Skills Group 
  <H1 ALIGN=Center>

  </H1>

Image Formats

 
  <P>

The two most commonly used image formats on the Web are .GIF and .JPG (or .JPEG) files. Both these types of graphic file minimise the amount of time taken to transfer the image across the Internet by storing their data in a compressed form. 

  </P>
 
  <H2>

  </H2>

.GIF Images

 
  <P>

.GIF images can display at most 256 different colours, which makes them unsuitable for photographic quality pictures. However, they are good for line drawings and other images using a restricted palette of colours. One particular feature is the ability to designate a particular colour as being transparent, so that the underlying background colour or image can show through. This is useful when an image is not rectangular in shape. 

  </P>
 
   <P ALIGN=Center>
   <IMG SRC="logo.gif">
 

  </P>
 
  <P>

Here the HSG logo is displayed with the transparent colour made visible. 

  </P>
 
  <H2>

  </H2>

.JPG Images

 
  <P>

.JPG images can display millions of colours, making them appropriate for photographic images. Unlike .GIFs they use a form of compression which results in some degradation of the image. Under normal circumstances the degradation is not perceptible but care should be taken to avoid images with smooth, evenly changing areas of colour, such as those produced by using a "gradient fill" in a graphics package. Although the .JPG format does not support transparent colours a similar effect can be achieved by making the edges of the image the same colour as the background of the web page they will appear on. 

  </P>
 
   <P ALIGN=Center>
   <IMG SRC="links.jpg">
 

  </P>
 
  <P>

In this .JPG the picture frame and the string it is hanging by are both a part of the image. 

  </P>
 
  <HR>
 
  <P ALIGN=Center>
   <A HREF="images.htm">

   </A>
  </P>

Images 

 </BODY>
</HTML>