In una pagina HTML5 possono essere inseriti diversi tipi di elementi multimediali come immagini, suoni o filmati. Per inserire immagini si utilizza il tag <img>:
<img src="worldwideweb.png" alt="World Wide Web" width="768" height="512" loading="lazy" />
Il parametro alt è obbligatorio e dovrebbe contenere una descrizione che viene mostrata se per una qualunque ragione l'immagine non può essere visualizzata. I parametri width e height sono raccomandati e determinano lo spazio che occuperà un'immagine ancor prima di caricarla. Il parametro loading è opzionale e serve a determinare quando vengono caricate le immagini:
- Con lazy le immagini vengono caricate solo quando necessario. Questo è il metodo migliore soprattutto se nella pagina sono presenti molte immagini e la pagina è molto lunga e non completamente visibile.
- Con eager le immagini vengono caricate sempre immediatamente. Se sono presenti molte immagini di grandi dimensioni, questa modalità può rendere lento il caricamento della pagina.
- Con auto sarà il browser a decidere quando effettuare il caricamento delle immagini. Questo è il valore di default che viene assunto se il parametro loading non viene dichiarato.
I browser sono in grado di mostrare immagini raster statiche JPEG, GIF o PNG, icone ICO, animazioni GIF o PNG e immagini vettoriali SVG:
