C19. Image
- Japneet Kaur (Deactivated)
Analytics
Release notes
Date | Update | Updated by |
|---|---|---|
14 Dec 2021 | Component finalised | @Japneet Kaur (Deactivated) @Steven Mao (Unlicensed) |
Overview
Objective:
The Image component enables content authors to embed a visual image on a page.
This helps to break up a content heavy page, and improves the visual appeal and readability of the page.
Use case:
As a content author, I want to use an image component so that I can add visual image to a page.
Business rules
BR-# | Business rules |
|---|---|
BR-1 | Authors should select an image that is at least the same size or larger than the placeholder to ensure that the quality of the image is retained |
BR-2 | The recommended dimensions for the image are dependant on the placeholder it is added to and the screen size on which the page is viewed, but generally the standard HD image size is 1920 x 1080 pixels. |
Design
Desktop | Mobile |
|---|---|
 Variation 1 (Full width)  Variation 2 Variation 3 (Overlapping with the hero banner) | Variation 1 (Full width) Variation 2 Variation 3 (Overlapping with the hero banner) |
CMS elements
# | Field | Type | Mandatory | Notes |
|---|---|---|---|---|
1 | Image path | Image path | Y | A link to browse and select an image |
3 | Image caption | Text | N | Alt text is added so users can make sense of an image when it can’t be viewed. |