Accessibility and Usability Guide
Create accessible and usable images
What will I need?
- Use whatever image manipulation software you are familiar with, providing it can reduce the file size of an image.
- Photoshop is the 'industry standard' generally preferred by designers.
- Perhaps IT can suggest a cheaper (or free) alternative for common use.
How do I make image files accessible and usable?
Further information about the following guidelines are available from the appropriate page of the portable document format (PDF) file, "Usability: LAWs (Local Authority Web site) Guidelines".
Reduce the file size
Aim to reduce the file size of all images as much as possible without losing too much quality. This will minimise the page download size (p. 62).
Use an appropriate font style
For images containing text, use a style of font with visual characteristics that are appropriate to the type of information being displayed (pp. 80-81).
Use appropriate colours
When using colours in images:
- Choose a text foreground colour that is at least 30 percent lighter or darker than the background colour (p. 81).
- Use appealing colours (pp. 81-82).
- Use common colour conventions (p. 82).
- Use a small set of colours to reduce the amount of visual information citizens need to process (pp. 82-83).
- Use strong colour sparingly (p. 83).
- Where there is a need to attract the citizen's attention, use strong colours (pp. 83-84).
Avoid ambiguous symbols
Use images of body parts and cultural symbols only when they are essential (p. 85):
- Do not use metaphors based on these symbols.
- The meaning of an image may be interpreted differently by certain cultures.
- For example, in certain cultures, a handprint on a wall has associations with identity, whilst in other cultures it has associations with death.
Use pictures of people properly
For pictures of people:
- Only use images of children in suitable dress (pp. 96-97).
- When using photographs of children, avoid associating names to photographs (pp. 97-98).
- When using images of people, ensure the correct level of permission has been granted (pp. 109-110).
How do I save my images?
Images should be saved as either Graphic Interchange Format (GIF) or Joint Photographic Experts Group (JPEG) files, using either the .gif or .jpg file extension. (JPG is the same as JPEG)
- Use JPG for images containing continuous tones, no text, and few lines or edges - for example, photographs.
- Use GIF for images containing solid colors, with text, lines or sharp edges.
- If the image contains a transparent background, you must use GIF.
- Always ensure JPG images are progressive.
- Always ensure GIF images are interlaced.
Please note: Do not edit JPG copies of original images. Start with the original image wherever possible. JPG uses lossy compression to save files. So each time an image is saved as a JPG, quality is lost and the file size expands.
- More about Graphic Interchange Format (GIF) - http://www.scantips.com/basics9g.html.
- More about Joint Photographic Experts Group (JPEG) - http://www.scantips.com/basics9j.html.
- GIF vs. JPG: Which Is Best? - http://www.siriusweb.com/tutorials/gifvsjpg.
How do I add images to the website or intranet?
- To publish image files on the website or intranet, you will need Adobe Dreamweaver.