Museo&Web
Planning Kit for a Quality Site for Small and Medium Sized Museums
Digital images
Every digital image has 3 characteristics:
- resolution; This is the relation between size and visual quality of the image and includes 2 further aspects: the number of points - measured in pixels - that make up the image, and the density of these points in visualisation or print. The latter is measured in DPI or dots per inch,
- depth of colour; This is the maximum number of possible colours and is measured in bits (8 bits = 256 colours, 16 bits = 65,000 colours, 24 bits = millions of colours),
- format or compression; This is the format in which the file is saved or codified. Some formats allow data to be compressed and thus the resulting files are smaller or less “heavy”.
The Web uses 3 formats for compressing images:
- GIF (Graphic Interchange Format) uses a form of compression that keeps the quality of the image unaltered, or rather, it reduces the size of the file without compromising graphic quality of the image. The depth of colour in GIF images is 8 bit. This uses 256 colours. The fewer the colours used, the greater is the possibility for compression and the smaller the size of the file. Most images on the Web are in GIF format, which is supported by all browsers.
- JPEG (Joint Photographic Expert Group) is often used to reduce the size of graphics files. Unlike GIF images, JPEG images are polychrome (24 bit or 16.8 million colours). The level of compression applied to JPEG images can be adjusted or chosen and thus the quality of the image can be controlled. The more the image is compressed, the more quality is reduced. After converting an image to JPEG format, the original image quality can no longer be recovered.
- The PNG (Portable Network Graphics) was developed
specifically for the Web. This format compresses images to 8 bits
without loss of information and thus produces smaller files than
GIF.
PNG allows text to be incorporated and offers the possibility of doing research on images. A string of data that identifies the image itself can be memorised in the file of the image.
NB. Overuse of images in the same page extends loading time. Text and images should therefore be balanced and the graphic potential of HTML should be used to the full. Take care not to insert heavy images (always remember to optimise files). Avoid overloading pages with too many images. Most users still navigate with analogical modems at 56Kbs and inserting too many images means creating pages that are slow and heavy to load. Playing with background colours and script is often enough to create a graphically attractive site.
Save the image in desired size at 72 DPI.
 GIF image at 72 dpi download time 1sec at 28.8Kb/s |
 jpg image at 72dpi download time 2sec at 28.8 Kb/s |
Where possible, it is advisable to use thumbnail images.
 click on the image to see the original format (.jpg 148kb) |
A thumbnail is simply a copy of a larger image. This copy has been modified to reduce the size of the file. A simple link to the larger image means that users can see the original image if they desire.
Open
source software for creating thumbnails
http://www.thumbshots.org/download.pxf
When an image is inserted it is important to use the ALT function. This specifies the alternative text until the image is loaded or when it is not loaded at all. The Alt function is incredibly useful for making the site accessible to all users; Disabled users cannot see images clearly on the screen and could have problems if this function is not specified. If the description of the image is particularly long, then the synthetic description – supplied by the ALT function - can be extended thanks to another function: LONGDESC (long description). This specifies a file with a longer description of the image.
Further notes on digitalisation of images:
- Digitisation guidelines: a selected list
http://www.minervaeurope.org/guidelines.htm - Good practices handbook
http://www.minervaeurope.org/publications/goodhand.htm