Nelle lezioni precedente abbiamo studiato alcuni dei tag più utilizzati del linguaggio HTML.
Accanto a questi, gli attributi dei tag sono altri componenti fondamentali del linguaggio HTML, e vengono utilizzati per diversi scopi:
(1) servono ad aggiungere delle informazioni ad un tag, affinché il browser lo formatti e lo visualizzi in modo più preciso e definito: gli attributi possono ad esempio specificare quanto deve essere largo un paragrafo o come deve essere allineato un testo;
(2) gli attributi dei tag inoltre possono contenere delle informazioni non immediatamente visibili sulla pagina internet, ma che sono importantissime per la sua corretta visualizzazione: possono infatti contenere dei riferimenti che permettono al linguaggio javascript di funzionare correttamente.

In alcuni casi, gli attributi dei tag sono facoltativi, e cioè possono essere inseriti oppure no: è il caso, ad esempio, di tutti i tag che abbiamo finora studiato.
In altri casi invece gli attributi dei tag sono obbligatori, e devono essere necessariamente aggiunti dal programmatore, come accade nel caso dei tag <a>, che serve ad inserire un link, o nel caso del tag <img>, che permette di inserire un’immagine nella pagina internet.

Prima di vedere alcuni esempi concreti, cerchiamo di capire qual è la sintassi corretta per aggiungere uno o più attributi ad un marcatore. Per svolgere questa operazione, bisogna seguire delle regole di scrittura molto precise: innanzitutto gli attributi devono essere aggiunti nel tag di apertura del contenitore che ci interessa specificare, seguendo queste indicazioni:

1. Scrivere il tag di apertura <div>
2. Inserire uno spazio dopo il nome del tag <div >
3. Inserire il nome dell’attributo da specificare <div attributo>
4. Inserire il segno dell’uguale <div attributo=>
5. Aprire le virgolette alte <div attributo=">
6. Scrivere il valore dell’attributo <div attributo="valore>
7. Chiudere il valore con le virgolette alte <div attributo="valore">

 

Ovviamente, per ogni tag, si possono specificare più attributi: tutti gli attributi devono essere scritti con la sintassi già indicata e divisi da uno spazio, secondo questa struttura:

<div attributo-1="valore-1" attributo-2="valore-2">
Questo è un div a cui sono associati tre attributi.
</div>

I valori degli attributi, inseriti tra virgolette, devono iniziare con una lettera (maiuscola o minuscola) e, a seconda dei casi, possono contenere dei trattini (normali o bassi), dei punti fermi oppure i due punti.
Nella prossima lezione vedremo come creare un tag con attributo obbligatorio, e e cioè il tag <a>, che ci permette di creare dei link.