Dopo il primo articolo introduttivo andiamo ad analizzare la struttura di un semplice codice HTML. La prima nozione che devi comprendere riguarda i tag utilizzati per scrivere il codice. Partiamo dal tag visto nel primo articolo, “<HTML>”: puoi vedere che il formato di un tag inizia con il simbolo “<” seguito dal nome del tag, in questo caso “HTML” e termina con il simbolo “>”; in questo caso il tag si dice essere di apertura. Ad ogni tag di apertura deve corrispondere un tag di chiusura: </HTML>. Nota che rispetto al tag di apertura c’è il simbolo “/” che indica la chiusura del tag.
Un documento HTML inizia e termina con i tag <HTML> e </HTML>. Ricorda che per documento HTML al momento intendiamo un file con estensione “.html” che è possibile leggere attraverso un qualsiasi browser (es. Chrome o Internet Explorer).
All’interno dei due tag HTML andremo a scrivere ciò che ci interessa per comporre la pagina web. Hai visto che scrivendo il testo “Hello World!” all’interno dei due tag HTML e aprendo il file salvato in una cartella Windows attraverso un browser sarà visualizzato il solo testo “Hello World!”; questo perché lo stesso browser “capisce” che i tag fanno parte del codice HTML e non devono essere visualizzati.
Iniziamo a prendere quindi familiarità con le pagine web e con il relativo codice HTML che serve per comporle.
Ma a cosa servono i tag?
I due tag HTML analizzati servono per indicare al browser che sta leggendo del codice html; non fanno altro (sono formalmente obbligatori). Altri due tag necessari sono <body> </body>.
Questi tag rappresentano il corpo della pagina web scritta in HTML e devono essere inseriti all’interno dei tag HTML come di seguito riportato:
<HTML><body> Hello World! <body> <HTML>
Questo è il codice per visualizzare il testo “Hello Word!”
Ok, sappiamo come creare una pagina web che visualizzi del testo non formattato, ma se volessimo visualizzarlo in grassetto?
La parola magica è tag! e nel caso del grassetto il tag è “<b>”, con ovviamente la successiva chiusura. “</b>”.
Riprendiamo il nostro esempio “Hello World!” e poniamo il caso che volessimo scrivere la parola “Hello” in grassetto; il codice per indicare al browser che deve visualizzare la parola in grassetto è il seguente:
<b>Hello</b>
Il codice completo della nostra pagina web quindi è:
<HTML> <body> <b> Hello </b> World! </body> </HTML>
Che una volta salvato sul nostro file .html e aperto con un browser web come Chrome visualizzerà il testo di seguito:
Hello World!
E se volessimo sottolineare il testo?
Facile, basta aggiungere il tag <u>.
<HTML> <body> <u> <b> Hello </b> World! </u> </body> </HTML>
E il risultato sarà:
Hello World!Nota bene, è vietato incrociare aperture e chiusure di tag differenti.
Esempio:
<u> <b> </u></b> non è corretto!
<u> <b> </b></u> è corretto!
Benissimo, a questo punto sai a grandi linee cosa significa scrivere del codice HTML per creare pagine web.
Passa alla lezione successiva per conoscere meglio l’HTML!
Non esitare a lasciare un commento o chiedere informazioni per chiarire i tuoi dubbi!