3. Design of your site

Professional web sites are often designed using graphics packages such as Adobe Photoshop. However, there are many other commercial, shareware and free graphics packages which can be downloaded from legitimate sites on the Internet. These are perfectly suitable to design a template for your site. Some packages will also convert your graphical site design into a HTML-based template, which you can then use in an HTML editor.

Graphics on the web are generally either in the GIF or JPEG formats, although there are newer file formats such as PNG and SVG, which are likely to replace older formats in the future.

Graphics tips:

  1. You should aim to make your graphics as small as possible, but without too much loss of clarity. 
  2. GIF file format is good for images with consistent blocks of colour, such as a logo, lines, text and screen shots. It can support both transparency and animation but is limited to 256 colours.
  3. JPEG file format should be used for complex images such as photographs. It can support 16 million colours and compresses very well. However, you should only save in this format when you are certain you have finished, as each time you save in JPEG format you lose some picture quality.
  4. Many graphics packages will allow you to specify a web colour swatch so that you can choose safe colours when designing your images.The web-safe hexadecimal numbers for colours can be found at: http://www.dtp-aus.com/htmlchrt.htm
  5. There are tools available from the web to splice your images if necessary.
  6. There are tools on the web to make image maps - often used in navigation systems.
  7. There are sites on the web which will optimise your images for you.
  8. Scale graphics to the size you actually want, rather than doing it dynamically from within a web page.

Up: Contents Previous: 2. Structure of your web site. Next: 4. Accessibility Issues