Sintassi degli elementi HTML

Gli elementi HTML

Un elemento HTML è tipicamente composto da un tag di apertura, un contenuto ed un tag di chiusura. Nel seguente esempio:

<h1>Sintassi degli elementi HTML</h1>
  • <h1>costituisce  il tag di apertura
  • Sintassi degli elementi HTML è il contenuto dell’elemento
  • </h1> costituisce il tag di chiusura ed è formato dal carattere  di barra “/” ([inglese]”slash”) seguito dal nome del tag di apertura.

Obbligatorietà del tag di chiusura

Per alcuni elementi  HTML il tag di chiusura è facoltativo, ad esempio quando si codifica una tabella HTML , è possibile omettere il tag di chiusura </td>.

Ci sono alcuni elementi HTML che non prevedono un contenuto e sono perciò definiti “vuoti” ([inglese]”void”); per questi elementi non è previsto neppure il tag di chiusura. Nella versione 5.2 di HTML gli elementi void  sono i seguenti: <area>, <base>, <br>, <col>, <embed>, <hr>, <img>, <input>, <link>, <meta>, <param>, <source>, <track> e <wbr>.

Gli attributi

Il tag di apertura può contenere uno o più attributi nella forma:
nome-attributo=”valore”.
Ad esempio:

<h1 id="maintitle">Sintassi HTML e CSS</h1>
  • id è il nome dell’attributo
  • il carattere “=” mette in relazione l’attributo con il suo valore
  • “maintitle” è il valore dell’attributo. Dev’essere racchiuso da doppi apici (“).

Attributi globali e specifici

Alcuni attributi, definiti “globali”, possono essere applicati a (quasi) tutti gli elementi HTML, come ad esempio l’attributo title, che permette di mostrare un testo di aiuto (“tooltip”) quando si posiziona il mouse al di sopra di un elemento. Gli attributi globali sono suddivisi in tre categorie:

  • principali (“core”) come id, class, title
  • di evento (“event handler”)
  • XML

L’elenco degli attributi globali  è fornito da W3C.

Alcuni elementi HTML prevedono, oltre agli attributi globali, anche degli attributi specifici; ad esempio, l’elemento <td> che identifica la cella di una tabella HTML, prevede gli attributi colspan e rowspan, che permettono di specificare per quante colonne o per quante righe si deve espandere la cella.

Validazione di un documento HTML

Sono disponibili in internet degli strumenti on-line che permettono di verificare se il codice HTML che si è scritto è formalmente corretto o meno.
Il più noto è il W3c Markup Validation Service . Questo servizio può verificare:

  • una pagina HTML già pubblicata i internet, specificandone l’indirizzo
  • una pagina non ancora pubblicata, facendo l’upload della pagina stessa
  • un frammento di codice HTML, copiandolo direttamente in un’apposita area di testo.

Sintassi delle entità HTML

Un’ entità HTML è identificata da:

  • il carattere “&” (e-commerciale o ampersand)
  • un codice
  • il carattere “;” (punto-e-virgola o  semicolon)

Il codice può essere di tre tipi:

tipo di codice Esempio per entità à Descrizione
codice nominale &agrave; (&) lettera latina a minuscola con accento grave (;)
codice numerico decimale &#224; (&) carattere “#” (cancelletto o hash o pound) seguito da 3 digit decimali corrispondenti al codice ascii esteso dell’entità (;)
codice numerico esadecimale &#x00E0; (&) carattere # seguito da carattere “x” (lettera latina x minuscola) seguito da 4 digit corrispondenti alla conversione in esadecimale del codice numerico decimale (;)

Regole di formattazione del testo

Un documento HTML  ben scritto è più facilmente modificabile nel futuro. Per questo motivo si sono diffuse nel tempo delle prassi di scrittura, definite “regole di formattazione”:

  • Nel tag di apertura tra il nome del tag e l’eventuale primo attributo dev’essere inserito un carattere di spazio.
  • Gli attributi devono essere tra loro separati da uno spazio.
  • I tag e gli attributi possono essere scritti sia in maiuscolo che in minuscolo, ma è consuetudine usare sempre il minuscolo, eccezion fatta per la dichiarazione iniziale <!DOCTYPE>.
  • Andare a capo riga ogni volta che si usa un nuovo tag di apertura. Da questa regola sono esenti i tag “In linea” come <a> o <span>.
  • Per i tag contenuti in altri tag, si devono seguire le regole di indentazione  del testo  (ovvero quando si va a capo riga si deve  rientrare il testo di 2 spazi rispetto al tag di livello superiore.
    Nell’esempio che esegue, i tre elementi <li> sono contenuti nell’elemento <ol> e gli elementi <h1>, <p> e <ol> sono contenuti in <article>:

    See the Pen HTML – semplice esempio di codice HTML by Alberto De Franceschi (@albertodf) on CodePen.

Articoli correlati

Sintassi delle regole CSS

Una risposta a “Sintassi degli elementi HTML”

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *