Information Services Web development centre

How to work with images and colours

This page provides information and resources to help you work with images and colours as you create pages for a University of Melbourne web site.

Images

Instructions on how to work with images in the web publishing templates are available on the Images page of the Templates style guide, and in the Web templates user guide.

How to customise colours and images in the templates

Refer to the web development wiki page on customising your site's colours, graphics and include files.

Colours

Working with colour in the Web environment means having to accept some of the limitations imposed by the user's display and bandwidth capacity.

For colours, this may mean restricting your choice to what is known as a 'Web Safe' colour.

For images, this may mean restricting the colour palette of 8 bit gif or png files to as few colours as possible to reduce the file size. Most image manipulation programs such as Fireworks and Photoshop provide options to optimise colour palettes for use on the Web.

While most users have computers and monitors set to thousands or millions of colours, there still situations where colour issues occur. If there is a web safe colour close to what you need, it's probably best to use it.

Use this hexadecimal colour codes chart to find the hexadecimal code for a particular colour.

ColorZilla plug-in

An excellent aid to web developers working with colour is the ColorZilla plugin for Firefox.

top of page