Primi passi
Premessa
HTML non e' un linguaggio di programmazione, ma un linguaggio di marcatura (HyperText Markup Language), ossia la sua funzione e' quella di marcare gli elementi che verranno visualizzati dal browser. Questo rende la sua struttura, e di conseguenza l'apprendimento, estremamente semplice. Nonostante cio' non verranno rappresentate in questa sede tutte le implicazioni che una guida veramente completa su HTML richiederebbe in quanto esula dallo scopo di queste pagine, che hanno la sola pretesa di illustrare al principiante i fondamenti del linguaggio. Per le specifiche complete di HTML 4.0 si veda la sezione Utilita'.
Un altro punto riguarda il software necessario. Tutto cio' di cui si ha bisogno per la scrittura del codice e' un semplice editor di testo tipo Blocco Note. Per qualcosa di piu' completo sotto il punto di vista funzionale e per la realizzazione di una eventuale parte grafica si veda sempre la sezione Utilita'.
| Creare un file HTML |
La creazione di un file HTML è estremamente semplice: apriamo il nostro editor di testo (in questo caso Blocco Note) e digitiamo quanto segue:
<HTML> <HEAD> <TITLE> Prima pagina </TITLE> </HEAD> <BODY BGCOLOR=yellow> La mia prima pagina web </BODY> </HTML>
fatto questo dobbiamo salvare il nostro lavoro.
- Clicchiamo sul menu' File > Salva con nome
- alla casella Salva in selezioniamo Desktop
- piu' in basso alla casella Nome file digitiamo il nome che preferiamo, per esempio prima_pagina.html, l'estensione .html (o .htm) e' indispensabile in quanto se non la specificassimo salveremmo il file in formato testo
- clicchiamo ora su salva ed il gioco e' fatto.
Noteremo la presenza di una nuova icona, quella tipica di un file html ed un doppio click su di essa avviera' il nostro browser. Se tutto e' andato per il verso giusto il risultato sara' questo.
Per visualizzare il codice di una pagina web si proceda in questo modo: in Internet Explorer fare click su visualizza e poi su HTML, in Netscape su visualizza e sorgente pagina. Suddetta operazione si rendera' indispensabile al momento di modificare o correggere il codice sorgente.
Una piccola precisazione: la visualizzazione e l'eventuale modifica del sorgente e' un'operazione molto piu' semplice e immediata se si utilizza il browser Internet Explorer o Opera piuttosto che Netscape.
| Uno sguardo ai TAG |
Il tag <HTML> indica al browser l'inizio del documento e, come quasi tutti i tag, necessita di chiusura. In questo caso con </HTML> che ovviamente troveremo alla fine della pagina.
<HEAD> indica l'inizio della testa che conterra', oltre ad altri tipi di informazioni, i metatag necessari ai motori di ricerca per indicizzare la pagina. Tra i tag <HEAD> ed </HEAD> vi troveremo anche il tag
<TITLE> che ha lo scopo di visualizzare nella barra superiore del browser il testo che eventualmente vi inseriremo. Da chiudersi con </TITLE>.
<BODY> indica il corpo del documento che contiene praticamente tutto quello che viene visualizzato dal nostro browser. Naturalmente anche questo tag necessita di chiusura con il rispettivo tag </BODY>.
Come si puo' notare dal codice esposto in precedenza, viene assegnato un colore al corpo del documento (BGCOLOR=yellow). In alternativa possiamo impostare un file grafico mediante questo attributo: BACKGROUND=sfondo.jpg esempio.
Alcuni utili suggerimenti
Di grande utilita' sono i commenti e gli appunti durante la scrittura del codice. Ne potremo inserire quanti vogliamo utilizzando questo semplice accorgimento: <!-- appunti vari -->. Tutto ciò che si trova all'interno delle parentesi angolari verrà semplicemente ignorato dal browser e non interferira' in alcun modo con il nostro lavoro.
Prestiamo la massima attenzione alle virgolette " badando a chiuderle quando definiamo un valore: ad esempio FONT FACE="verdana avrebbe un effetto impredicibile sulle nostre pagine. Va comunque puntualizzato che il loro uso non e' obbligatorio tranne che in rari casi.
In realta' un file HTML puo' essere salvato indifferentemente sia con estensione .html che .htm. I problemi sorgono quando si cerca di richiamare, mediante un link, una pagina salvata con suffisso .htm specificandone invece il suffisso .html (e viceversa). Per questo motivo e' preferibile scegliere fin dall'inizio il metodo che si preferisce adottare.
Un altro problema che puo' sorgere con il nome dei file riguarda l'uso delle maiuscole. Per i sistemi Windows non fa alcuna differenza tra Mia_Pagina.html, mia_pagina.html e MIA_PAGINA.HTML, mentre un sistema basato su Unix accetta solo nomi e suffissi in minuscolo. Per questo motivo e' caldamente consigliato l'uso dei caratteri minuscoli per i nomi dei file.
Un'ultima precisazione prima di passare al prossimo capitolo: HTML e' case insensitive, ossia non fa alcuna differenza se il codice e' digitato in maiuscolo o in minuscolo. La scelta e' discrezionale anche se indubbiamente l'utilizzo del carattere maiuscolo per i tag contribuisce ad una maggiore leggibilità del codice stesso.
© 2002 Poletti Stefano