Image blocks are similar to icon blocks and are used to display groups of related content and/or links. They can also be used to display a single link, but cards are the preferred option for displaying a single link.
Component breakdown
Image
- Should provide additional context.
- Image should support and re-enforce the content. Don’t use an image for decorative purposes only.
- If a suitable image can’t be sourced, consider using an icon block or text block.
- Image should follow image guidelines.
- Mandatory
Label
- Limit of 50 characters.
- Optional
Heading
- Limit of 50 characters.
- Mandatory
Description
- Should be a short descriptive sentence to provide some context.
- Limit of 200 characters.
- Try to keep the length of each description similar if using multiple blocks in a row.
- Optional
Link list
- Limit of 5 links.
- Links are optional as this component can also be used to display a single link or simply display content.
- Optional
Link
- Should link to the page that the “Heading” describes.
- For single image blocks, the link should be an outlined button as seen in the examples below.
- Link is optional as this component can also be used to simply display content.
Guidelines
- Should only be used on full-width pages (like landing pages, not content pages).
- Supported layouts include:
- 2, 3, or 4 column.
- Use image blocks, rather than icon blocks, when a photo better describes the content or when a suitable icon can’t be sourced.
- Don’t use images for decorative purposes only.
- Limit of 6 blocks per section.
Live examples
You can see live examples of how agencies have applied images to their content.
- Create NSW – Get funding and support for arts and culture
- Customer Service – Free training and coaching
-
Transport for NSW – Smart places in NSW
Need any more help?
If you have any questions, or require assistance with anything mentioned in this article, submit a request via the webform.