New E-learning
Images
An image is a visual element embedded in a slide to illustrate, explain, or simply decorate content. Depending on whether or not it carries information, it must receive a text alternative, a detailed description, or be hidden from assistive technologies.
Three categories of images must be distinguished :
- Decorative images : bring no informational value; removing them causes no loss of content. They serve purely an aesthetic or atmospheric purpose.
- Informative images : carry content essential to understanding; their absence causes a loss of information for the learner.
- Complex images : condense a large amount of information in graphical form (diagrams, infographics, data charts) and require an extended description to be fully accessible.
When to use an image
- Illustrer ou clarifier : quand un visuel aide réellement à comprendre une notion (schéma, photo de situation, capture d'écran d'un logiciel).
- Alléger le texte : pour remplacer un long paragraphe descriptif par un visuel doté d'une alternative textuelle.
- Ancrer la mémorisation : pour créer un repère visuel récurrent d'une section à l'autre du module.
When not to use an image
- Text in an image: never embed informative text or an instruction in an image file; use a Storyline text box.
- Superfluous decoration: avoid stacking visuals with no instructional value, which weigh down the slide and the reading order.
- Information conveyed by color or position alone within the image: favor a structured list or table.
On this page
Decorative images
These images must be hidden from assistive technologies so that they cause no interruption when content is read aloud. As they bring no instructional value, neutralizing them improves navigation fluidity for all users, regardless of their context or needs. To do this, uncheck the "the object is visible to accessibility tools" box in the modal containing the accessibility options.
Informative images
A short, equivalent text alternative is mandatory (recommendation: 150 characters maximum). It must faithfully convey the information carried by the image — not describe it literally — to guarantee an equivalent learning experience, whether the learner uses a screen reader, voice navigation, or accesses the content in a degraded environment. To do this, fill in the image's text alternative in the "Alt text" field present in the accessibility modal.
Complex images
Whenever a visual condenses a significant amount of information (chart, diagram, infographic), a structured and exhaustive description is required. It may take the form of adjacent text, a dedicated section in the module, or a link to a full text version. This level of description also benefits content indexing and its reuse in other formats.
On this page
Keyboard interaction
Images are not interactive elements: they do not receive focus and therefore cannot be reached with the TAB key
| Key | Function |
|---|---|
| Tab | Reach the link or button giving access to the detailed description of a complex image, or the image itself when it is clickable. |
| Space/Enter | Activate the link, button, or clickable image. |