- Taxonomic name: IMAGE
- Added on: v3.0.0 (15/09/17)
- Updated on: v5.6.0 (20/04/21)
Imagery
Imagery is key in better representing content, esecially when considering the use of photographs on our sites. For full guidelines on the use of imagery, please see the photography style guide in the Global Standards section of the Abeille Assurances DESY website.
Examples
Image
Interactive example
Code example
<img src="..." decoding="async" width="..." height="..." alt="..." />Figure
Interactive example
Code example
<figure>
<img src="..." decoding="async" width="..." height="..." alt="..." />
<figcaption>...</figcaption>
</figure>Development and test
Notes for developers
Not all images require an alt attribute. Only include one if the image is conveying important information that is not included elsewhere in the copy on the page.
Lazy loading can be applied to images/figures. For how to do this see the lazy loading page for reference.
Notes for testers
- Ensure that images only have
alttext if the image is critical to the understanding of the document.
Component releases
- Added on: v3.0.0 (15/09/17)
- Updated on: v5.6.0 (20/04/21)
Latest update:
- updated: To improve page load and layout times the additional attributes decoding="async", width and height must be set on all inline images.