Che cos'è un'immagine incorporata?

Un'immagine incorporata è un'immagine grafica che viene inserita in una pagina Web per aggiungere richiamo visivo, fornire informazioni o rappresentare un collegamento ipertestuale. Le immagini incorporate sono in genere nei formati GIF, JPEG o PNG. Sono incorporati in una pagina Web utilizzando lo schema URI dei dati.

Gli URI dei dati consentono l'incorporamento di dati di piccole dimensioni che possono essere recuperati istantaneamente dal browser. Le immagini incorporate vengono recuperate dal browser insieme all'HTML e visualizzate come parte del documento Web. Affinché il browser sia in grado di recuperare e visualizzare le immagini senza troppo tempo e problemi, è consigliabile utilizzare immagini incorporate di piccole dimensioni.

Immagini più grandi rallenterebbero il tempo di caricamento e farebbero sì che il sito impiegasse molto tempo a comparire sullo schermo. La maggior parte dei visitatori del web non ha la pazienza di restare in giro per vederlo accadere. Ciò influirebbe negativamente sul traffico del sito.

Le immagini HTML inline provengono dal server del sito Web in cui devono essere visualizzate o incluse da altri server esterni. L'uso di immagini incorporate da fonti esterne è una questione controversa in quanto ciò può essere fatto senza autorizzazione. Il tag img viene utilizzato per inserire immagini incorporate in paragrafi e intestazioni nella pagina Web. Il tag img non può essere utilizzato in una forma mobile. Deve essere racchiuso in un altro elemento.

L'attributo richiesto del tag img è l'attributo src. L'attributo src specifica l'indirizzo Web o l'URL da cui il browser può recuperare il file di immagine. Oltre all'attributo src, le immagini HTML inline possono essere definite da tre attributi opzionali. Questi sono alt, align e ismap.

L'attributo alt fornisce un'alternativa al testo dell'immagine in linea. Quindi, nel caso in cui il browser dello spettatore non supporti la grafica, lo spettatore vedrà il testo al posto dell'immagine. L'uso dell'attributo alt è altamente raccomandato.

Il valore dell'attributo alt può essere una stringa vuota. Ad esempio, se esiste un'immagine decorativa, non è necessario fornire un testo alternativo. Pertanto, il valore dell'attributo alt può essere lasciato vuoto.

Lo stile di immagine incorporato può essere impostato con l'attributo align. L'attributo align indica al browser dove deve apparire l'immagine in linea in relazione al testo sulla pagina web. L'immagine in linea può essere allineata con la parte superiore, centrale o inferiore del testo adiacente sulla pagina Web.

Con l'attributo ismap, un'immagine incorporata può essere contrassegnata come una mappa immagine attiva. Ciò significa che è possibile creare diverse parti dell'immagine per produrre azioni diverse ogni volta che qualcuno fa clic sulle diverse parti. Ad esempio, se esiste un'immagine in linea che mostra la Terra e Saturno, fare clic sulla Terra può portare a informazioni sulla Terra e fare clic su Saturno può portare a informazioni su Saturno.

A differenza degli attributi alt e align, l'attributo ismap non funziona per semplice inclusione nel tag img. Richiede una configurazione eseguita sul server. Potrebbe anche essere richiesta una certa conoscenza della programmazione.