Image Group

Note: the Image Group content type now has a version 2, which should be used for all new content. Image Group v2 allows easier rearranging of the image order, and does not place tight constraints on the image size required.

Use

An image group should be used to add visual interest to a page, which can support either two or three images. This component is suggested for aesthetic use, rather than informative, and does not support captions. For image content that requires accreditation, the image embed or full width image component should be used instead. For example we see this component being useful within text heavy pages, supporting course details and research case studies.

When using the image group component, the overlapping area should be considered due the staggered layout. It is worth considering which image will sit in each position of the set, and ensure that the focal point of the selected imagery isn’t covered by another image in the set. For this reason, any image that has important visual information across the whole of the frame might be best used as a stand alone image component instead.

Key information

• An image group can contain either 2 or 3 images
• For the legacy Image Group, images used must be landscape and images within the same group must have the same dimensions (3x2, 4x3 or 16x9)
• For Image group v2:
  • two images can be added by default - click the 'Add another' button (bottom right) to add a third image
  • to rearrange the order of images, either simply click and drag to slide the repeater to the desired position, or click 'Reorder' and use the arrows or enter order number

Image guidance

• All images must be optimised using TinyJPG before uploading to T4
• For Image Group v2, images are displayed with an aspect ratio of 3:2, so this is the ideal image dimension to use (recommended dimensions 2000 x 1333px) - other image dimensions can be used, but some cropping will occur to fit the 3:2 ratio
• For the legacy Image Group:
  • Recommended dimensions are 2000 x 1333px or in ThirdLight use 'Image embed/group/gallery 3:2'
  • For an alternative aspect ratio, 4:3 images can also be used. In ThirdLight use 'Image embed/group 4:3'. Recommended dimensions for images using this aspect ratio are 2000 x 1500px
  • For an alternative aspect ratio, 16:9 images can also be used. In ThirdLight use 'Image embed/group 16:9'. Recommended dimensions for images using this aspect ratio are 2000 x 1125px
  • All images from Thirdlight should be cropped using the 'Constrain proportions' checkbox

Examples:

Example of how the images appear on a mobile phone screen: