---
title: Video
description: >-
  Scopri come incorporare video MP4 e WebM in Jamdesk usando Markdown o il componente Video, con proprietà per autoplay, loop e controlli.
---

> **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version.

Archivia i file `.mp4` o `.webm` in una directory `/videos` all'interno del progetto e fai riferimento direttamente a questi file. Jamdesk visualizza un lettore HTML5 con controlli, angoli arrotondati e spaziatura uniforme.

Gli screenshot mostrano l'interfaccia in inglese.

## Sintassi Markdown

Lo stesso schema `![alt](path)` che usi per le immagini funziona anche per i file video. Jamdesk controlla l'estensione del file e visualizza un lettore video invece di un tag `<img>`:

```markdown
![Never Gonna Give You Up](/videos/never-gonna-give-you-up.mp4)
```

![Never Gonna Give You Up](/videos/never-gonna-give-you-up.mp4)

Questo è il modo più rapido per inserire un video in una pagina. Ottieni un lettore standard con riproduzione/pausa, volume, barra di avanzamento e modalità a schermo intero. Non servono proprietà aggiuntive. Se vuoi controllare il comportamento della riproduzione, ad esempio l'avvio automatico, la ripetizione o il silenziamento, usa invece il componente `<Video>`.

## Componente Video

Il componente `<Video>` espone gli attributi video HTML5 come proprietà, permettendoti di controllare il comportamento del lettore:

```mdx
<Video src="/videos/never-gonna-give-you-up.mp4" title="Rick Astley" />
```

<Video src="/videos/never-gonna-give-you-up.mp4" title="Rick Astley" />

La proprietà `title` imposta l'`aria-label` sull'elemento video, che gli screen reader annunciano quando l'utente vi accede. Includila sempre per garantire l'accessibilità.

## Proprietà

| Proprietà | Tipo | Predefinito | Descrizione |
|------|------|---------|-------------|
| `src` | `string` | none | **Obbligatoria.** Percorso del file video. |
| `title` | `string` | none | Etichetta di accessibilità per gli screen reader. |
| `controls` | `boolean` | `true` | Mostra i controlli integrati del lettore del browser. |
| `autoPlay` | `boolean` | `false` | Avvia la riproduzione non appena il video è visibile. |
| `muted` | `boolean` | `false` | Avvia il video con l'audio disattivato. |
| `loop` | `boolean` | `false` | Riavvia dall'inizio quando il video termina. |
| `width` | `string` | none | Valore CSS della larghezza, ad esempio `"400px"` o `"100%"`. |
| `height` | `string` | none | Valore CSS dell'altezza. |

## Sostituire le GIF

Le GIF animate aumentano rapidamente le dimensioni dei file: una registrazione dell'interfaccia di 5 secondi può facilmente raggiungere 10 MB come GIF, ma rimanere sotto i 500 KB come MP4. Sostituisci le GIF con un video senza audio in riproduzione continua e nascondi i controlli del lettore:

```mdx
<Video src="/videos/ui-demo.mp4" autoPlay muted loop controls={false} />
```

Il risultato ha l'aspetto e il comportamento di una GIF (viene riprodotto in linea, si ripete all'infinito e non presenta controlli), ma si carica molto più rapidamente e rimane nitido a qualsiasi risoluzione.

<Note>
I browser bloccano la riproduzione automatica con audio. Se imposti `autoPlay` senza `muted`, il video non verrà riprodotto: resterà sul primo fotogramma senza mostrare errori. Associa sempre entrambe le proprietà.
</Note>

## Formati supportati

| Formato | Estensione | Supporto dei browser |
|--------|-----------|-----------------|
| MP4 (H.264) | `.mp4` | Tutti i browser, inclusi Safari e iOS |
| WebM (VP9) | `.webm` | Chrome, Firefox, Edge. File più piccoli a parità di qualità |

MP4 è l'impostazione predefinita più sicura. È gestito da ogni browser e dispositivo. WebM produce file più piccoli, ma Safari e iOS non lo supportano: gli utenti da dispositivi Apple non vedranno nulla.

I file video possono avere dimensioni fino a **100 MB**. Per qualsiasi video più lungo di alcuni minuti, ospitalo su YouTube e usa invece il [componente `<YouTube>`](/it/content/youtube), poiché lo streaming da una CDN progettata per i video sarà sempre più efficiente della distribuzione di file di grandi dimensioni dalla documentazione.

<Tip>
Comprimi i video prima di eseguire il commit. Strumenti come [FFmpeg](https://ffmpeg.org/) e [Handbrake](https://handbrake.fr/) possono ridurre drasticamente le dimensioni dei file senza una perdita visibile di qualità: `ffmpeg -i input.mp4 -crf 28 -preset slow output.mp4`
</Tip>

## E dopo?

<Columns cols={3}>
  <Card title="Immagini" icon="image" href="/it/content/images">
    Immagini Markdown, dimensioni e didascalie
  </Card>
  <Card title="Incorporamenti YouTube" icon="youtube" href="/it/content/youtube">
    Video e Shorts di YouTube
  </Card>
  <Card title="iFrame" icon="code" href="/it/content/iframes">
    Vimeo, CodePen, Figma e altro
  </Card>
</Columns>