Cos'è il testo Alt e perché è importante in HTML?

Cos'è il testo Alt e perché è importante in HTML?
Le immagini svolgono un ruolo significativo in qualsiasi applicazione. Sono abituati per migliorare l'appello e l'attrattiva del sito Web. Cosa succede se la connessione Internet rallenta e l'immagine desiderata non riesce a caricare? Quindi, cosa dovrebbe essere visualizzato sullo schermo anziché sull'immagine? In tale scenario, HTML ci consente di utilizzare l'attributo "Al"Nell'elemento HTML.

Questo studio ti guiderà su cosa sia il testo alt e perché è importante in HTML.

Cos'è un testo ALT in HTML?

A volte quando scorriamo un sito Web, appare un piccolo testo quando l'immagine non riesce a scaricare. Questo componente HTML è noto come "Al"Testo, descrizione o testo alternativo. È un attributo associato al tag di HTML.

Sintassi

Per utilizzare il testo ALT in HTML, seguire la sintassi data:

La descrizione della sintassi sopra menzionata è elencata di seguito:

  • "src": Questo attributo viene utilizzato per specificare il percorso dell'immagine di origine.
  • "Al": È il testo alternativo.

Perché il testo ALT è importante in HTML?

Il testo Alt è importante per molte ragioni. Alcuni di essi sono elencati di seguito:

  • Per una migliore accessibilità della pagina Web, è meglio utilizzare il testo ALT in quanto aiuta gli utenti che sono ipovedenti per ascoltare la descrizione dell'immagine utilizzando applicazioni di terze parti.
  • Al posto dell'immagine, verrà visualizzato il valore dell'attributo di testo alt. Questo è vantaggioso quando gli utenti sperimentano connessioni a bassa larghezza di banda.
  • Il testo ALT contribuisce anche al rango della pagina Web agli occhi di Google. Non solo fornisce una descrizione, ma aggiunge anche significato ad essa, il che può essere utile per il traffico complessivo del sito Web.

Quali sono le migliori pratiche di alt text in html?

Alcune delle migliori pratiche per utilizzare il testo ALT per il tuo sito Web sono elencate di seguito:

  • Non iniziare il testo alt con "immagine di" O "immagine di" parole.
  • Limitare il testo Alt a 130 caratteri o meno.
  • Tieni presente il SEO.
  • Sii preciso.

Esempio 1: Testo ALT buono e cattivo in HTML

Facciamo un esempio e controlliamo quale tipo di testo alternativo dovrebbe essere visualizzato al posto dell'immagine:

Qui abbiamo dichiarato il testo alternativo cattivo e buono per HTML:

  • Cattivo testo alt: Montagne Fiori viola.
  • Buon testo alt: Gradini circondati da fiori viola verso la montagna coperta di neve.

Si può osservare che il cattivo testo alt non è una descrizione; Piuttosto, è solo un elenco di parole. In confronto, il buon testo Alt descrive le informazioni sull'immagine.

Esempio 2: come aggiungere il testo alt all'elemento HTML?

Dimostriamo il concetto di aggiungere alt testo con l'aiuto di un esempio.

Html

Nel file HTML, prima, aggiungi un contenitore che contiene l'elemento. Questo elemento è associato agli attributi SRC e ALT:



Salva il file HTML e la pagina Web mostrerà l'immagine come segue:

Diciamo che questa immagine non è riuscita a caricare, o abbiamo aggiunto erroneamente il percorso sbagliato dell'immagine nel nostro file HTML. Quindi, verrà visualizzato il testo ALT specificato al posto dell'immagine:

È così che puoi aggiungere alt testo alla nostra immagine usando "Al"Attributo nel tag.

Conclusione

HTML ci consente di utilizzare le immagini per la nostra applicazione web. Ma a volte, l'utente sperimenta una connessione a bassa larghezza di banda e l'immagine non può caricare sull'applicazione. In una situazione del genere, il "Al"L'attributo con tag mostra il testo alternativo quando l'immagine non è stata visualizzata. Questo articolo ha spiegato l'attributo Alt dell'elemento HTML.