# Aperçu en direct (/fr/editor/live-preview)

<!-- agent-signals: reading_time_min: 1 · est_tokens: 694 · updated: 2026-07-30 -->
Related: [Comment utiliser l'éditeur](/fr/editor/tutorial.md), [Notions essentielles de Git pour l'éditeur](/fr/editor/git-essentials.md), [Créer et modifier des pages](/fr/editor/pages.md), [Ajouter des médias](/fr/editor/media.md), [Organiser la navigation](/fr/editor/navigation.md), [Branches et publication](/fr/editor/branching-and-publishing.md)

Prévisualisez votre site pendant que vous le modifiez. Les aperçus en direct affichent les pages exactement telles qu'elles apparaissent une fois publiées, et se mettent à jour à mesure que vous modifiez le contenu, la navigation et la configuration.

<div id="open-live-preview">
  ## Ouvrir l'aperçu en direct [#ouvrir-laperçu-en-direct]
</div>

Cliquez sur le bouton d'aperçu en direct <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M18.8906 12.846C18.5371 14.189 16.8667 15.138 13.5257 17.0361C10.296 18.8709 8.6812 19.7884 7.37983 19.4196C6.8418 19.2671 6.35159 18.9776 5.95624 18.5787C5 17.6139 5 15.7426 5 12C5 8.2574 5 6.3861 5.95624 5.42132C6.35159 5.02245 6.8418 4.73288 7.37983 4.58042C8.6812 4.21165 10.296 5.12907 13.5257 6.96393C16.8667 8.86197 18.5371 9.811 18.8906 11.154C19.0365 11.7084 19.0365 12.2916 18.8906 12.846Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> dans la barre supérieure pour ouvrir un aperçu en direct dans un nouvel onglet.

<Frame>
  <img src="/_assets/ab993c3576575d078550e89981150c9a517a3df20ece1f4339f5761023d8eec9" alt="Le bouton d'aperçu en direct dans la barre d'outils." className="block dark:hidden" />

  <img src="/_assets/c5251d903dd024875520d18129cbd02d76ea54a00aa295ca857a095232352e40" alt="Le bouton d'aperçu en direct dans la barre d'outils." className="hidden dark:block" />
</Frame>

<Note>
  L'aperçu en direct est uniquement disponible pour les sites publics.
</Note>

<div id="live-preview-versus-preview-deployments">
  ## Aperçu en direct vs déploiements de prévisualisation [#aperçu-en-direct-vs-déploiements-de-prévisualisation]
</div>

|                      | Aperçu en direct                                | Déploiement de prévisualisation                |
| -------------------- | ----------------------------------------------- | ---------------------------------------------- |
| **Vitesse**          | Immédiat                                        | Nécessite un build                             |
| **Accès**            | URL locale                                      | URL partageable                                |
| **Quand l'utiliser** | Pour revoir les modifications pendant l'édition | Pour partager avec votre équipe pour relecture |
| **Disponibilité**    | Tant que l'éditeur reste ouvert                 | Tant que la branche existe                     |

Utilisez l'aperçu en direct pour obtenir un retour immédiat pendant l'édition. Lorsque vous devez partager des modifications avec votre équipe ou tester sur un autre appareil, utilisez un [déploiement de prévisualisation](/fr/editor/branching-and-publishing#preview-your-changes).
