culture.gov.au
Connecting you with Australian culture online
Top 10 Stories
Australian weather and the seasons The Australian Gold Rush European discovery and the colonisation of Australia Sydney Olympic Games, 2000 Convicts and the British colonies in Australia Great Barrier Reef Australian Indigenous cultural heritage The Great Depression Modern Australian fashion Australian food and drinkGuide 7. How do I create my website?
Using graphics on your website (screen 11 of 17)
Why use graphics on your website?
Web designers use graphics because, when used well, they can enhance the look of the website. They create a relationship between your organisation's offline promotional materials and its online presence. Graphics, along with your text and layout, determine your website's look and feel.
But use graphics carefully and sparingly. Things to consider:
- They can give a cluttered appearance to a site.
- Too many graphics slow the time it takes users to download each screen.
- They can create problems for users with special needs using voice readers.
As with any publication, the graphics you use on your website should be appropriate, and add to the screen's message. They need not be in colour, and they can range from photographs to simple line drawings.
You also need to be aware of your copyright(1) responsibilities. If you are using someone else's photograph or drawing you must have their permission to use it on your website. You are not allowed to download images from the Internet and use them on your site unless you have the copyright owner's permission.
Graphic Buttons
Graphics can be functional, and not only illustrative or decorative. Graphics are commonly used as hyperlinks(2) to take users to another screen or site. For example, a graphic can act as a link to take users to another screen or site, or another part of the same screen - like this graphic which will take you to our Home page.
Remember the message about 
colour(3) - colours can look different on different platforms and browser applications. Other colours 'bleed' when displayed on screen. Take these factors into account when selecting any graphic for your website.
Incidentally, some users turn off downloading graphics in their browser application. This means that all graphics, especially those that are navigation aids, need text equivalents somewhere on each screen.
Graphic elements and colour choices
You can obtain some graphic elements from the Web at sites such as ArtServe(4), Timo's
WWW Gifs Gallery(5), Color
Maker(6), Frameshop(7),
Webdeveloper's
Library(8) and Table
Maker(9).
Lview
Pro(10) is a software program which enables you to manipulate images.
Think carefully how you use these graphic elements. Backgrounds, for
example, should not interfere with the readability of text - so avoid
dark or deep colours, textures and pictures as backgrounds. Use a colour(11)
which works well with your body text colour. This might sound a little
prescriptive but it still allows an enormous range of possibilities.
White text on black (or any lighter colour on a dark colour) is difficult
to read if there is a lot of text. There is nothing wrong with a white
background and grey/black text - think of your users first. Choosing
colours(12)
is worth spending some time over.
GIF or JPEG?
Any graphic used on a website should conform to one of the two main standards: GIF (Graphics Interchange Format) or JPEG (Joint Photographics Experts Group).
Both are ways of compressing files and allowing them to be viewed on any type of computer.
GIF files are restricted to 256 colours, but they are the only truly universal format, able to be viewed on all computers and browser applications. For images of the same dimensions, the fewer the colours, the smaller the file.
JPEG files are more popular than GIF files because they can be higher quality images with more than 256 colours. Most computers can handle JPEG files.
As a rule of thumb, illustrations that can be displayed well in 256 colours or less should be provided as GIF files, and illustrations like photographs that need more than 256 colours should be provided as JPEG files. Large illustrations with few colours should be provided as GIF files, since large areas of the same colour may not display well in JPEG files.
Graphics software
Creating graphics for websites requires graphics software. This can be assisted by a scanner which allows input of images into a computer.
If you want to learn how to use some particular software packages there
are tutorials
on the Web(13) on Photoshop, Paintshop Pro, Corel and other graphics'
development(14) applications. Most Web screen design will require
a graphics'
package(15) to help you manipulate images. There are a range of
them available.
|
11 of 17 |
References
- Guide 7 screen 13 http://culture.gov.au/resources/guides/g7/s13.htm
- Guide 7 screen 10 http://culture.gov.au/resources/guides/g7/s10.htm
- Choosing colours http://www.webdeveloper.com/
- ArtServe http://rubens.anu.edu.au/
- Timo's WWW Gifs Gallery http://www.uwasa.fi/~ts/gifs.html
- Color Maker http://www.bagism.com/colormaker/
- Frameshop http://www.bagism.com/frameshop/
- Webdeveloper's Library http://www.webdeveloper.com/
- Table Maker http://www.bagism.com/tablemaker/
- Lview Pro http://www.lview.com
- Leafdigital http://www.leafdigital.com/class/lessons/graphicdesign2/2.html
- Web colour tool box http://lightsphere.com/colors/
- Tutorials on Photoshop, Paintshop Pro, Corel http://www.grafx-design.com/tutorials.html
- Other graphics' tutorials http://webreference.com/authoring/graphics/tutorials.html
- Graphics' packages http://webreference.com/authoring/graphics/software/index.html
If you can see this message, you are probably not seeing this site in the way it was designed. This site uses cascading style sheets (CSS2) to control the way in which elements are displayed on the page.
You will still be able to access everything in this site, but we do recommend you upgrade your browser to a more recent, standards compliant, browser.