Image guidelines

Use these guidelines to add images to your web pages.

As a rule, use words rather than images. Only use images that usefully add to the text content.

Image dimensions

Image Dimensions (in pixels)
50/50 banner 730 x 411px (or 16:9 aspect ratio)
Image with caption 730 x 411px (or 16:9 aspect ratio)
Page thumbnail 730 x 411px (or 16:9 aspect ratio)
Catalogue item uses page thumbnail
Wayfinder card uses page thumbnail
Content teaser uses page thumbnail
Full Bleed banner 1280 x 660px
Full Bleed banner mobile rendition 751 x 575px

Note: Images may render at slightly different sizes in different components. Using 730x411px will allow you to use the one instance of the image for various purposes (i.e. thumbnail, wayfinder image, news item image, catalogue item image, image in caption).

Image size should be less than 100KB

Keep all images under 100KB as possible. Up to 200 KB is the absolute maximum for banners where quality is a concern.

The best bet is to use the 'save for web' function in Photoshop, which you can do in large batches to make your life easier.

If you don't have easy access to Photoshop, we recommend the following optimisation sites:

Examples

50/50 banner (with button and text)

50-50 banner with text, call to action button and image 50-50 banner with text, call to action button and image
Image: 50/50 banner

Image with caption

High school students in STEM class laughing holding mechanical object High school students in STEM class laughing holding mechanical object
Image: Image with caption

News hub feature card

Screenshot of news feature cards. Screenshot of news feature cards.
Image: Feature cards

Catalogue

Screenshot of catalogue template. Screenshot of catalogue template.
Image: Catalogue Component

Wayfinder cards

Screenshot of Wayfinder cards Screenshot of Wayfinder cards
Image: Screenshot of Wayfinder cards

Where to source your images

Rules of image use

1. Evaluate your image

Always consider the role an image plays in the context of the page where it is used. Start by deciding if the image is:

Decorative

This style of image does not add any information to the page, it is just there to make the website more 'visually attractive'. Don't use these.

Informative

Images that graphically represent concepts and information, typically pictures, photos and illustrations. Do use these.

2. All images need text alternatives (alt text)

Images must include alt text that describes the information or function represented by them. This ensures that images can be used by people with various disabilities.

These web accessibility tutorials for images demonstrate how to provide appropriate text alternatives based on the purpose of the image.

Alt text for screenshots

You do not need to describe what is contained in a screenshot as you would just be duplicating the instructions that relate to the screenshot. Instead, put "Example screenshot" as the alt text.

3. Get permission to use the image

You can't publish information that identifies a person - a student, a parent or carer, or any other individual - without their permission. Find out more about permission to publish (staff only).

Don't use images downloaded from Google or other search engines without permission.

4. Don't use text images

Don't use images that are just text (words) or text added to them, such as:

  • infographics
  • posters
  • screenshots of print
  • cards.

While text images may look nice and be useful in print, the information in them can't be read by assistive technologies like screen readers.

5. Don't use icons

Avoid using icons because they can get confusing when you use the same icon for different things, or vice versa.

6. Use only pictures of Aboriginal people and Torres Strait Islanders still living

Many Aboriginal people and Torres Strait Islanders are offended by the depiction of deceased members of their communities. It is very important to follow these guidelines and to be respectful of their values.

Do

  • Make every effort to ensure that only pictures of living Aboriginal people and Torres Strait Islanders are used in the website.
  • Display a disclaimer if an image could contain a deceased person - such as a very old filed picture.
  • Have a disclaimer statement in the privacy and disclaimer page in the website.
  • Provide a way to report an incident.

Don't

  • Use old images without checking permissions and historical data.
  • Use ripped images sourced from Google or the internet (including other websites).

Images of people now deceased

While we have made every effort to ensure that only pictures of Aboriginal people and Torres Strait Islanders still living are used on this site, visitors to the site are warned that it may contain images of people now deceased. Please let us know if you know of the death of any Aboriginal or Torres Strait Islander person depicted on this site.

How-to guides

Learn how to add an image on your page using our guides:

Return to top of page Back to top