Come sapete tutti benissimo un sito web pianta le sue fondamenta nel linguaggio html. Tutte le pagine, infatti, sono realizzate in questo linguaggio a marcatori (hyper-text mark-up language), che ha una struttura ben precisa, andiamo a scoprirla assieme.
Innanzitutto voglio darvi alcune dritte sulle varie versioni di HTML: la versione attuale è la 5.0, ma ancora un uso ci sono le 3 versioni della 4.01 (strict, transitional e frameset, che presentano differenze nella gestione degli stili degli elementi). E’ in uso anche lo standard XHTML 1.0, che fonde HTML con XML (l’evoluzione di html, si possono ad esempio dichiarare tag propri).
Ho citato la parola tag. HTML infatti si basa sull’utilizzo di determinati tag che circondano tutti gli elementi, un esempio è <p>…</p> per delimitare un paragrafo. Ultima domanda prima di iniziare: come si decide la versione da usare in un progetto? Con il Doctype, specificato come primissimo elemento del documento html.
1: <!DOCTYPE html>
2: <html>
3: <head>
4: <meta hhtp-equiv="Content-Type" content="text/html charset=UTF-8">
5: <title>Pagina di Prova HTML</title>
6: </head>
7:
8: <body>
9: <h1>Titolone</h1>
10: <p>Bla Bla Bla</p>
11: </body>
12: </html>
Quella che vi ho presentato qui sopra è la struttura standard di un documento html, come potete vedere in alto c’è il doctype (nel nostro caso quello di html 5.0) poi un tag che raccoglie tutto l’html e i due contenitori principali, head e body. Head contiene tutte le meta-informazioni necessarie al nostro documento (autore, encoding, di cui parlerò approfonditamente in un articolo nei prossimi giorni, lingua,…), mentre body contiene l’html che verrà stampato a schermo. Provate a copiare nel blocco note del vostro sistema operativo il codice che vi ho fornito!
Un breve sunto dei comandi principali:
- <p> delimita un paragrafo
- <h1> indica un titolo di massima importanza (h1-h2-..-h6 in ordine di importanza)
- <table> renderizza una tabella
- <li> renderizza una lista
- <a> determina un link
- <img> stampa un’immagine
Nei prossimi giorni, come già anticipato, una breve “lezione” sull’encoding e una sul CSS, per aggiungere proprietà grafiche ai nostri lavori in html!
Continua la lettura con:
- Convertire PDF in HTML in maniera raida con 3DFlipPage PDF to HTML Il PDF è un formato di condivisione di documenti non modificabili praticamente universale, che tuttavia...
- CSS: le basi Eccoci come promesso nel secondo articolo dedicato alla programmazione di siti web, oggi tratteremo il...
- Strutturare una pagina web, Box model css Eccoci al penultimo articolo sul mondo html e css. Oggi parliamo di come strutturare una...
- Storia dell’encoding e utilizzo nella progettazione di applicazioni web Ultima lezione sul web programming, abbandoniamo per un momento la “pratica” per concentrarsi su un...
Loading ...
0 Responses to “La struttura portante di un documento HTML”