03. Tag multimediali e di collegamento

Tag multimediali


Immagine

<img>

Questo tag consente di incorporare un'immagine in un documento HTML. E' possibile specificare un testo alternativo da mostrare se non è possibile caricare l'immagine  e definire la dimensione dell'immagine visualizzata.

La sintassi è la seguente:

<img src="URL_dell_immagine" alt="Testo alternativo" width="larghezza" height="altezza">

Esempio:

<img src="immagine.jpg" alt="Un bel paesaggio" width="300px" height="200px">


Audio

<audio> </audio>

Il tag HTML <audio> viene utilizzato per incorporare file audio in una pagina Web. E' utilizzato per riprodurre musica, effetti sonori o altri file audio.

L'elemento <audio> ha un attributo obbligatorio src che specifica l'URL del file audio da riprodurre. L'elemento <audio> può anche avere altri attributi che controllano il comportamento del lettore audio.

La sintassi è la seguente:

<audio controls>

    <source src="URL_del_file_audio" type="tipo_del_file_audio">

    Testo alternativo o fallback se il browser non supporta l'audio.

</audio>


Esempio:


<audio controls>

  <source src="musica.mp3" type="audio/mpeg">

  Il tuo browser non supporta l'elemento audio.

</audio>


Video

<video> </video>

     Il tag HTML <video> viene utilizzato per incorporare filmati in una pagina Web. 

L'elemento <video> ha un attributo obbligatorio src che specifica l'URL del file multimediale da riprodurre. L'elemento <video> può anche avere altri attributi che controllano il comportamento del lettore video.

<video width="larghezza" height="altezza" controls>

     <source src="URL_del_file_video" type="tipo_del_file_video">

     Testo alternativo o fallback se il browser non supporta il video.

</video>

      Esempio:

<video width="640" height="360" controls>

     <source src="miovideo.mp4" type="video/mp4">

     Il tuo browser non supporta l'elemento video.

</video>

Collegamento ipertestuale


Hyperlink

<a> </a>

Gli hyperlink (o collegamenti ipertestuali) in HTML sono utilizzati per creare collegamenti tra le pagine web o tra diverse risorse web, consentendo agli utenti di navigare tra di esse con facilità. Gli hyperlink sono comunemente noti come link e sono implementati utilizzando il tag <a> (abbreviazione di "anchor").

La sintassi è la seguente:

<a href="URL_del_destinazione">Testo o contenuto del link</a>

Esempio:

<a href="https://www.example.com">Visita il nostro sito web</a>

Il tag <a> può anche essere utilizzato per creare ancoraggi all'interno dello stesso documento HTML. Questo è utile quando si desidera consentire agli utenti di scorrere rapidamente a una sezione specifica della stessa pagina. L'ancoraggio viene creato utilizzando l'attributo href con un valore preceduto da un simbolo di cancelletto (#). 

Per creare l'ancoraggio, è necessario anche definire un punto di destinazione all'interno del documento utilizzando l'attributo id su un elemento.

Esempio:

<div id="sezione-1">

   <!-- Contenuto della Sezione 1 -->

</div>

...

<a href="#sezione-1">Vai a Sezione 1</a>