HTML significa letteralmente Hypertext Markup Language, ed è il linguaggio più comune utilizzato per la creazione di pagine Web.
Hypertext(Ipertesto) si riferisce al modo in cui le pagine Web (i documenti HTML) sono collegate tra loro. Così un link disponibile su una pagina Web viene chiamato Hypertext.
Come suggerisce il nome, HTML è un Markup Language, ossia il testo viene "marcato" tramite tags che indicano al browser come strutturare e visualizzare il documento.
In origine, l' HTML venne sviluppato con l'intenzione di definire la struttura dei documenti come le intestazioni, i paragrafi, le liste e così via in modo da facilitare lo scambio di informazioni scientifiche fra i ricercatori.
Ora, grazie alla molteplicità di tag disponibili, l' HTML viene ampiamente utilizzato per formattare le pagine Web.
A seguire un semplice esempio di documento HTML:
<!DOCTYPE html> <html> <head> <title>This is document title</title> </head> <body> <h1>This is a heading</h1> <p>Document content goes here.....</p> </body> </html>
E' possibile utilizzare l'opzione Try it disponibile nell'angolo superiore destro del box contenente il codice per verificare il risultato di questo codice HTML, in alternativa è possibile copiare il codice all'interno di un file di testo tramite un text editor e salvarlo come test.htm. Infine aprendo il file tramite un browser Web come Internet Explorer, Google Chrome, o Firefox, ecc Verrà mostrato il seguente risultato:
Come detto in precedenza, l'HTML è un linguaggio di markup e fa uso di vari tag per formattare il contenuto. Questi tags sono racchiusi fra parentesi angolate e chiamati <Tag Name>. Eccetto pochi tags, la maggiorparte di essi necessità del corrispettivo tag di chiusura. Ad esempio <html> termina con </html> e <body> termina con il tag </body>, ecc.
A seguire un esempio di utilizzo di alcuni principali tags:
Tag | Descrizione |
---|---|
<!DOCTYPE...> | Definisce il tipo di documento e la versione HTML. |
<html> | Questo tag racchiude l'intero documento HTML, e principalmente comprende il document header, rappresentato dai tags <head>...</head> ed il document body, rappresentato dai tags <body>...</body>. |
<head> | Indica il document header, può contenere all'interno altri tags HTML come <title>, <link> ecc. |
<title> | Il tag <title> è utilizzato all'interno del tag <head> per indicare il titolo della pagina. |
<body> | Rappresenta il corpo del documento HTML e contiene altri tags come <h1>, <div>, <p> ecc. |
<h1> | Rappresenta l'intestazione. |
<p> | Indica un paragrafo testuale. |
Per imparare l'HTML, sarà necessario studiare vari tag e capire come si comportano durante la formattazione di un documento testuale. Imparare l'HTML vuol dire semplicemente imparare l'uso di diversi tag, al fine di formattare il testo o le immagini per costruire accattivanti pagine Web.
Il World Wide Web Consortium (W3C) a partire da HTML 4 raccomanda di scrivere i tags in minuscolo.
Un tipico documento HTML segue la seguente struttura:
Document declaration tag
<html> <head> Document header related tags </head> <body> Document body related tags </body> </html>
Studieremo tutti i tag di intestazione (head) e del corpo (body) nei capitoli successivi, per ora vediamo che cosa è il tag di dichiarazione del documento.
Il tag di dichiarazione viene utilizzato dal browser Web per comprendere la versione del codice HTML utilizzato nel documento. La versione attuale di HTML è HTML 5 e utilizza la seguente dichiarazione:
<!DOCTYPE html>
Esistono molti altri tipi di dichiarazione che possono essere utilizzati nel documento HTML a seconda della versione di HTML utilizzata. Vedremo ulteriori dettagli al riguardo quando discuteremo del tag <!DOCTYPE...>.