Il linguaggio HTML - benvenuto nel sito del laboratorio di informatica

annuncio pubblicitario
Il linguaggio HTML di Andrea Leotardi
Il linguaggio HTML
Quasi tutte le pagine Web sono disegnate utilizzando l’HTML (Hyper Text Markup Language), un
linguaggio che descrive l’aspetto della pagina attraverso codici e comandi (chiamati “TAG”).
La prima cosa da comprendere è che una pagina HTML altro non è che un normalissimo file di
testo, che fa riferimento ad altri elementi separati, come immagini, filmati, file multimediali.
Quello che si vedere visualizzato nel browser (navigatore, interprete del linguaggio HTML), non è
un singolo documento, ma l’insieme di svariati documenti disposti secondo le indicazioni inseriti
nella pagina HTML.
Tra i browser, ricordiamo Internet Explorer (in dotazione con il sistema operativo Windows),
Netscape Navigator/Communicator, Opera ecc.
Per il trasferimento delle pagine internet si ricorre al protocollo http::// (hyper text transfer protocol
– protocollo per il trasferimento di iper testi); questo non si occupa solo della trasmissione dei files,
ma anche dei servizi di autenticazione e cifratura dei dati.
Tornando all’HTML.
Il linguaggio HTML è molto semplice da imparare, visto che è basato principalmente su TAG
(etichette). L’HTML ha una sintassi ben precisa, infatti ogni “tag” è sempre racchiuso da i simboli
di maggiore e minore (< e >). Ad esempio il “tag” <I> fa sì che il testo venga scritto in “italico”
ossia in corsivo. Per terminare l’effetto di un “tag”, si utilizza un “tag” di chiusura, che è composto
dal “tag” di apertura, preceduto da una barra: </I>.
Al giorno d’oggi esistono molti programmi che ci aiutano nella creazione di pagine internet, i
cosiddetti “editor”. Questi programmi ci permettono di lavorare in modalità “grafica”, ossia come
se noi stessimo editando la pagina con un programma di video scrittura. Ed automaticamente
l’editor, crea il “codice html” opportuno.
Tra questi programmi ricordiamo: FrontPage di Microsoft, DreamWeaver di Macromedia, GoLive
di Adobe.
Il testo ed il codice HTML sono solo una delle componenti di una pagina Web. Gli altri elementi
importanti di una pagina internet sono: immagini, o comunque la grafica in generale, le animazioni,
i suoni ecc.
Raccolta di immagini gratuite le possiamo trovare al seguente indirizzo:
http://ausmall.com.au/freegraf
http://www.iconographics.com
http://www.erinet.com/jelane/families
Notizie ricavate da “manuale pratico & trucchi per
1 il PC”
Elaborazioni di Andrea Leotardi
Il linguaggio HTML di Andrea Leotardi
html
images
……..
…………..
…………..
…………..
Come si può notare nel grafico qui sopra, un sito internet mantiene una struttura gerarchica. Questo
perché dobbiamo cercare di mantenere raccolti i files che sono tra di loro omogenei, quindi tutti i
files html nella cartella “html”, tutte le immagini dentro alla cartella “images”. Per mettere, ad
esempio, a disposizione un font o un documento, possiamo creare una cartella dedicata,
chiamandola, per esempio, “download”
CONSIGLIO:
E’ preferibile utilizzare 8 caratteri per il nome del file 3 caratteri per l’estensione
xxxxxxxx.htm
NON utilizzare spazi nei nomi, perché questi vengono automaticamente sono sostituiti dal carattere
speciale %20
E’ sconsigliabile inserire “fonts” speciali (tipi di caratteri disponibili nel sistema operativo), visto
che non tutti i S.O. posseggono quel carattere. O comunque bisogna metterlo a disposizione di
“download”.
Notizie ricavate da “manuale pratico & trucchi per
2 il PC”
Elaborazioni di Andrea Leotardi
Il linguaggio HTML di Andrea Leotardi
Anatomia di una pagina
Tutte le pagine Web, devono iniziare con un “tag” che le identifica come documenti HTML.
Questo “tag”, che deve precedere tutti gli altri, è <HTML>. E visto che, come si è già detto, tutti i
“tag” hanno una chiusura, dovremo chiuderlo con </HTML>.
I documenti HTML sono poi divisi in due zone: la prima è la HEAD, contiene le informazioni che
si riferiscono al titolo (TITLE), la data di creazione, l’autore ecc.
La seconda parte è il BODY, contiene il vero e proprio corpo della pagina: testo, immagini ecc.
Un esempio:
<HTML>
<Head>
<TITLE>Titolo della pagina </TITLE>
</HEAD>
<BODY>
Contenuto della pagina
</BODY>
</HTML>
NON HA IMPORTANZA SE I TAG SONO SCRITTI IN MAIUSCOLO O IN MINUSCOLO
Un sito molto bello che può aiutarvi nella creazione delle pagine internet è il seguente:
http://www.w3schools.com
Altri “tag” importanti sono:
<BR> (l’unico che non ha la chiusura), permette l’interruzione di riga e di andare a capo
<P> … </P>, permette di creare un nuovo paragrafo.
Inserire un’immagine:
<img scr=”nomefile.gif” alt=”descrizione del logo” width=”100” height=”100”>
In questa maniera, avremo il nome del file, l’eventuale descrizione (facoltativa) e la dimensione in
“punti per pollice”.
Per creare un collegamento ipertestuale, ossia un collegamento ad una pagine, un’immagine ecc.,
usiamo il seguente tag di “anchor” = àncora
<A href=”http://www.unipr.it”>Il sito dell’università di Parma</A>
e comparirà: Il sito dell’università di Parma
Per inviare un’e-mail utilizziamo il seguente “tag”
mailto:[email protected]
e verrà richiamato il programma di posta elettronica e creata automaticamente una e-mail con
l’indirizzo citato.
[email protected]
Notizie ricavate da “manuale pratico & trucchi per
3 il PC”
Elaborazioni di Andrea Leotardi
Scarica