Hantsweb Technical Guidelines

Graphics

Using images on your pages| Resizing images | GIFs | JPEGs

Using images on your pages

While images can make your pages look a lot more attractive, do not be tempted to overdo it. Large images can take a long time to download and may frustrate users who have only a slow internet connection. Some people have graphics turned off in their browser or are using a browser or application that is unable to display images. You must provide an alternative where the image is an important part of the informational or navigational content - for example a graph or chart.

All graphics that appear in Hantsweb must have an alternative text tag. This must be a meaningful description of the image. This not only adds value to your web page but ensures your page remains accessible to all users.

Images should be no larger than 30KB (for the whole page) and the preferred method is to publish a "clickable thumbnail" image, behind which resides a larger image for improved viewing, it is good practice to let the user know how big this image is. This larger image does not have to appear on a corporate style web page if no other navigable information is present.

Example page layout:

• Jane Austen
• South Hampshire Rapid Transport

Resizing images

If you have a large graphic which you want to reduce when you are creating a thumbnail please remember that it is not simply the size of the image (width and height) that you are reducing but also the file size (KB).  The most effective way of reducing your graphics is by using a web-specific graphics tool such as Paint Shop Pro.  Please contact us if you have queries regarding image reduction.

GIF Images

A GIF is one of the two most common file formats for graphic images on the World Wide Web usually with the file suffix of '.gif'.

An interlaced GIF is a GIF image that seems to arrive on your display like an image coming through a slowly-opening Venetian blind. A fuzzy outline of an image is gradually replaced by seven successive waves of bit streams that fill in the missing lines until the image arrives at its full resolution.

Among the advantages for the viewer using 14.4 Kpps and 28.8 modems an interlaced GIF means that the wait time for an image seems less and the viewer can sometimes get enough information about the image to decide to click on it or move elsewhere.

When to use a GIF

GIFs should always be used for a logo or for any large image material that has been produced by a graphic designer other than a photographic image.

JPEG Images

A JPEG, usually with the suffix of '.jpg' is a graphic image created by choosing from a range of compression qualities. When you create a JPEG or convert an image from another format to a JPEG, you are asked to specify the quality of image you want. Since the highest quality results in the largest file, you can make a trade-off between image quality and file size.

When to use a JPEG

JPEG images should always be used for photographs of people, places and objects.

	Next: Interactivity		Hantsweb Standards - Graphics		Technical guidelines
	Top of this page		Hantsweb Homepage

---