---
title: Contenu médias
shortTitle: Contenu médias
titleId: Content
description: Présentation du composant Contenu média permettant d’intégrer images, vidéos ou sons dans une page tout en respectant des règles éditoriales claires.
shortDescription: Structurer visuellement une page avec des contenus média.
keywords: contenu média, content, image, vidéo, audio, design system, accessibilité, UX, UI, droits d’auteur, visuel, éditorial
cover: ./_asset/cover/cover.png
excerpt: Ce document explique comment intégrer des contenus média dans une page de manière cohérente et responsable, tout en respectant les droits et les bonnes pratiques éditoriales.
summary: Ce guide présente le composant contenu média, destiné à l’intégration d’éléments visuels ou sonores comme des images, vidéos ou fichiers audio dans les pages d’un site. Il précise les conditions d’usage, notamment en matière de droits, et rappelle les règles éditoriales à suivre pour assurer la clarté du message, l’unité graphique et l’accessibilité. Il s’adresse aux équipes éditoriales et de conception souhaitant enrichir leurs pages sans compromettre la cohérence visuelle ni l’expérience utilisateur.
mesh:
  - component/transcription
---

## Contenu médias

Le composant **Contenu médias** permet d'intégrer des contenus multimédias tels que des vidéos, des images de manière accessible et responsive.

:::dsfr-doc-tab-navigation

- Présentation
- [Démo](./demo/index.md)
- [Design](./design/index.md)
- [Code](./code/index.md)
- [Accessibilité](./accessibility/index.md)

:::

::dsfr-doc-storybook{storyId=content--content}

### Quand utiliser ce composant ?

Utiliser le contenu média pour intégrer des images, vidéos ou fichiers audio aux pages de contenu d’un site.

### Comment utiliser ce composant ?

- **Utiliser exclusivement des contenus média libres de droit** ou veiller à vous acquitter des droits.

### Règles éditoriales

- **Utiliser des contenus média qui véhiculent un message clair**.
- **Homogénéiser le style graphique de vos contenus média** afin de créer une unité au sein du site.
- **Eviter d’intégrer du texte directement dans les contenus média** (hors sous-titrage), notamment sur des visuels statiques.