SEO

1176 visualizzazioni

TAG HTML | Principali tag di formattazione

Tempo di lettura: 3 min

Abbiamo detto nel precedente articolo che all’interno di ogni pagina è presente una serie di marcatori, i cosiddetti TAG, a cui viene affidata la visualizzazione e che hanno differenti nomi a seconda della loro funzione. I tag vanno inseriti tra parentesi uncinate (<TAG>) e la chiusura del tag viene indicata con una “/”, ossia lo “slash” (</TAG>).
Il contenuto va ovviamente inserito all’interno del tag medesimo.

<b attributi>contenuto</b>

Gli attributi dei TAG sono svariati. La loro struttura è attributo=”valore”. Quindi la struttura del tag diviene la seguente.

<b attributo_1="valore1" attributo_2="valore2" attributo_3="valore3">contenuto</b>

Volendo fare un esempio pratico, giustifichiamo un paragrafo al centro.

<P align="center">testo</p>

Alcuni tag, come quello per inserire un’immagine (img) non hanno contenuto, e di conseguenza non hanno neanche la chiusura.

Indice dei contenuti

Maiuscolo o minuscolo?

L’HTML è “case unsensitive“, cioè indipendente dal formato maiuscolo o minuscolo.
Tempo fa era buona norma scrivere il nome del tag in maiuscolo e gli attributi in minuscono, oggi invece è consigliabile scrivere tutto in minuscolo.

Principali tag di impostazione per un documento html

<html> <!-- racchiude tutti i tag in un documento HTML e lo definisce come un documento HTML -->
<head> <!-- racchiude i tag titolo e contiene titoli del documento ed informazioni di progettazione per il documento -->
<title> <!-- racchiude il titolo per il documento -->
</title> <!-- chiude il title -->
</head> <!-- chiude l'head -->
<body> <!-- racchiude tutti i tag che formano un documento -->
</body> <!-- chiude il body -->
</html> <!-- chiude l'html -->

Principali tag di formattazione del documento

<H1> </H1> è un tag di testata che crea il testo di dimensioni più grande. Il numero di tag di testata può variare da 1 a 6. Incrementando il numero rende più piccolo il testo

<P> </P> crea paragrafi
<BR> </BR> crea una interruzione di linea

<B> </B> rende il testo in grassetto

<STRONG> </STRONG> rende il testo in grassetto

<I> </I> rende il testo in corsivo

<U> </U> sottolinea il testo

<CENTER> </CENTER> centra il testo

<FONTCOLOR=”nome del colore”> </FONT> assegna al testo un colore

Collegamenti

<A HREF=”indirizzo da linkare”> </A> inserisce un collegamento

Tabelle

<TABLE> </TABLE> crea tabelle. Questo paio di tag racchiude tutti gli elenchi di tag per ognuno degli elementi nell’elenco

<TR> </TR> crea la riga di una tabella. Questo paio di tag racchiude tutti i tag di celle nella tabella

<TD> </TD> crea celle in una tabella

Elenchi ordinati

<OL> </OL> crea un elenco ordinato. Questo paio di tag racchiude tutti i tag di celle nell’elenco

<LI> </LI> racchiude l’elenco degli elementi

Elenchi

<UL> </UL> crea un elenco non ordinato. Questo paio di tag racchiude tutti i tag di celle nell’elenco

<LI> </LI> racchiude l’elenco degli elementi

Commenti

Una strategia importante, per rendere il nostro codice più leggibile è quella di inserire dei “commenti” nei punti più significativi: si tratta di indicazioni significative per i webmaster, ma invisibili al browser.
Inserire i commenti in punti specifici del documento ci permette di mantenere l’orientamento anche in file molto complessi e lunghi.
[HTML][/HTML]

Articolo a cura di: Del Re Valerio
Dott. in Comunicazione e Pubblicità per le Organizzazioni. Sono l'ideatore del blog Robadagrafici.com e mi occupo di comunicazione visiva, grafica e web, per le aziende.

Se questo articolo ti è piaciuto o ti è stato di aiuto, lascia un commento.