'Image + text' component
Component type | Block |
---|---|
Component possible inclusions | image, button, CTA |
Design source (in Figma) | |
Component status |
Introduction
The image + text component is an information block consisting of an image and text area.
Anatomy
Key Content
Item | Type | Notes |
Image | Image |
|
Heading | typography |
|
Description | typography |
|
CTA block | component |
|
Behavior
The whole element itself is not clickable. Clicking on a call to action will activate it (link or button);
Usage
Do’s
Use to highlight, key points of a story or product benefit.
Use an Image that is relevant to the point you are making.
Use a CTA Block to direct users to additional relevant information, rather than substituting a link for lots of content.
Don’ts
Don’t be overly verbose with your headings and description copy
Don’t link the image
Analytics & Data
Basic click tracking called by the onClick prop
Related/Similar Components
Image
Teaser
Asset Item
Picto item