Acronimo di HyperText Markup Language, nato per la formattazione e impaginazione di pagine web, oggi viene utilizzato con i CSS, dove l'HTML gestisce la struttura logica di una pagina, mentre i CSS si occupano della rappresentazione (stile della pagina). Questo linguaggio è assoggettato al Word Wide Web Consortium più conosciuto con la sigle W3C.

Guida ai Tag HTML

Ecco alcuni dei tag più comuni utilizzati per creare un blog:

Intestazioni

Le intestazioni sono utilizzate per definire i titoli delle sezioni del blog. Esistono sei livelli di intestazione, da <h1> a <h6>, in ordine decrescente di importanza.

<h1>Titolo principale del blog</h1>

Paragrafi

Il tag <p> viene utilizzato per definire un paragrafo di testo nel blog.

<p>Questo è un paragrafo di testo nel mio blog.</p>

Liste

Le liste possono essere ordinate (<ol>) o non ordinate (<ul>). Ogni elemento della lista viene definito dal tag <li>.

<ul>
    <li>Elemento 1</li>
    <li>Elemento 2</li>
    <li>Elemento 3</li>
    </ul>

Link

I link ipertestuali sono creati utilizzando il tag <a>. L'attributo href specifica l'URL di destinazione del link.

<a href="https://www.miosito.com">Visita il mio sito web</a>

Immagini

Le immagini vengono visualizzate utilizzando il tag <img>. L'attributo src specifica il percorso dell'immagine.

<img src="/it2/immagine.jpg" alt="Descrizione dell'immagine">

Titoli e sottotitoli

I tag <h2>, <h3>, <h4>, ecc., possono essere utilizzati per creare titoli e sottotitoli all'interno di un post del blog.

<h2>Sottotitolo del post</h2>

Quote

Le citazioni possono essere evidenziate utilizzando il tag <blockquote> per le citazioni lunghe o <q> per le citazioni brevi.

<blockquote>Questa è una citazione lunga nel mio blog.</blockquote>

Formattazione del testo

La formattazione del testo può essere modificata utilizzando tag come <strong> per il testo in grassetto, <em> per il testo in corsivo e <u> per il testo sottolineato.

<p>Questo è un testo <strong>in grassetto</strong> e questo è un testo <em>in corsivo</em>.</p>

Elenco dei tag HTML per un blog

Ecco un elenco completo dei tag HTML comunemente utilizzati per creare un blog:

  • <h1> - <h6>: Intestazioni
  • <p>: Paragrafi
  • <ol>: Lista ordinata
  • <ul>: Lista non ordinata
  • <li>: Elemento della lista
  • <a>: Link
  • <img>: Immagine
  • <blockquote>: Citazione lunga
  • <q>: Citazione breve
  • <strong>: Testo in grassetto
  • <em>: Testo in corsivo
  • <u>: Testo sottolineato

 

Lista TAG HTML

Lista dei TAG HTML

 

Elementi di BASE

Tipo Documento <HTML></HTML> Indica l'inizio e la fine della pagina HTML
Titolo <TITLE></TITLE> Titolo della pagina
Testata <HEAD></HEAD> Informazioni descrittive
Corpo <BODY></BODY> Contenuto della pagina

 

Proprietà della  pagina: Sfondi e colori

Immagine di sfondo <BODY BACKGROUND="URL">
Colore di sfondo <BODY BGCOLOR="#******">
Colore del testo <BODY TEXT="#******">
Colore dei collegamenti <BODY LINK="#******">
Colore dei collegamenti visitati <BODY VLINK="#******">
Colore del collegamento selezionato          <BODY ALINK="#******">

 

Formattazione del testo

Neretto <B></B>  
Corsivo <I></I>  
Sottolineato <U></U>  
Apice <SUP></SUB>  
Pedice <SUB></SUB>  
Lampeggiante <BLINK></BLINK>  Supportato solo da Netscape
Testo scorrevole <MARQUEE></MARQUEE>  Supportato solo da Internet Explorer
Macchina da Scrivere <TT></TT>  Visualizzato a spaziatura fissa
Preformattato <PRE></PRE>  Visualizzato tale e quale, compresi gli spazi
Centrato <CENTER></CENTER>  sia per testo che per immagini
Font: dimensioni <FONT SIZE=?></FONT>  valori da 1 a 7
Font: modifica misura <FONT SIZE="+|-?"></FONT>  valori da -3 a +3
Font: colore <FONT COLOR="#******"></FONT>  da 000000 a FFFFFF
Font: tipo <FONT FACE="Verdana"  

 

Collegamenti (link)

Link a un documento <A HREF="URL"></A>
Definizione di un'àncora <A NAME="nomeàncora"></A>
Link ad un'àncora nella stessa pagina <A HREF="#nomeàncora"></A>
Link ad un'àncora di un'altra pagina <A HREF="URL#nomeàncora""></A>
Link da visualizzare in un altro frame <A HREF="URL" TARGET="_nomedelframe"></A>
Link ad un indirizzo e-mail <A HREF="mailto:This email address is being protected from spambots. You need JavaScript enabled to view it."></A>

 

Immagini

Visualizzazione immagine <IMG SRC="URL">
Immagine: allineamento <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
Immagine: testo in alternativa <IMG SRC="URL" ALT="***"></td> </tr> <tr> <td>Immagine: dimensioni (in pixel)</td> <td><IMG SRC=<img src="/it2/images/apici.gif" border="0" alt="" />URL" WIDTH=? HEIGHT=?>
Immagine: dimensioni (in % d. largh. e alt. d. pagina) <IMG SRC="URL" WIDTH=?% HEIGHT=?%>
Immagine:bordo (in pixel) <IMG SRC="URL" BORDER=?>

 

Formato di struttura

Separazione <DIV></DIV>
Separazione Allineamento: <DIV ALIGN=LEFT | RIGHT | CENTER |JUSTIFY></DIV>
Citazione <BLOCKQUOTE></BLOCKQUOTE>
Font molto grande <BIG></BIG>
Font molto piccolo <SMALL></SMALL>

 

Vari

Commenti (non visualizzati dal browser) <!-- testo del commento -->
Dichiarazione tipo di file (primissima riga) <!doctype html public "-//w3c//dtd html 4.0 transitional//en">

 

Struttura pagina HTML

La struttura di un a pagina HTML è la seguente:

 

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

<html>

<head>
   <meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
   <title>La mia Pagina HTML</title>
   <link rel="icon" type="image/png" href="http://www.miosito.it/favicon.png"/>
</head>

<body>

</body>

</html>

Nel dettaglio:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

Indica che stiamo utilizzando per specifiche del W3C

 

<html>
...
</html>

Quello che scriveremo fra questi due TAG è in codice HTML

 

<head>
...

</head>

E' la testata della pagina HTML e qui possiamo scrivere i TAG come ad esempio <Title></Title>

 

<body>
...
</body>
Il corpo del messaggio, cioè il contenuto che verrà visualizzato nella pagina HTML all'utente