HyperText Markup Language

HTML

L'HTML è un linguaggio di istruzioni che servono a definire le caratteristiche di una pagina Web. Tutti i comandi HTML sono facilmente riconoscibili, infatti sono racchiusi tra < >. Per definire le caratteristiche di una porzione di testo si devono indicare sia l'inizio sia la fine di questa porzione di testo, quindi è necessario un comando di inizio e un comando di chiusura. I comandi di chiusura sono sempre caratterizzati dalla presenza di / subito dopo il segno <.

Esempio:
<B> è il comando per ottenere il testo in grassetto
</B> indica il punto da cui il testo non deve essere più in grassetto (in pratica annulla il precedente <B>)
<I> è il comando per ottenere il testo in corsivo
</I> indica il punto da cui il testo non deve essere più in corsivo (in pratica annulla il precedente <I>)


Il linguaggio HTML non è case-sensitive, cioè non fa differenze tra lettere maiuscole e minuscole, quindi i comandi racchiusi tra < > possono essere scritti indifferentemente in maiuscolo o in minuscolo.

Tutti i documenti redatti in HTML si aprono con il comando e si chiudono con .
Un documento standard HTML è costituito da due parti distinte individuate da opportune istruzioni:
una è l'intestazione, l'altra è il corpo della pagina.
Il corpo della pagina è il documento vero e proprio, l'intestazione è il titolo che viene visualizzato in alto nella barra di stato (l'intestazione di questa pagina Web è Primi rudimenti di HTML).

La struttura elementare di una pagina HTML è dunque:

<HTML>
<HEAD>
<TITLE>
Intestazione del documento
</TITLE>
</HEAD>
<BODY>
Corpo della pagina
</BODY>
</HTML>

Come si è visto, il corpo della pagina è racchiuso tra <BODY> e </BODY>.

Si possono aggiungere diversi attributi a <BODY>.
Premesso che i colori sono definiti con opportune cifre numeriche e che per il momento indichiamo con RRGGBB il codice numerico che individua il colore desiderato, due degli attributi che si possono aggiungere a

sono:
BGCOLOR per stabilire il colore RRGGBB dello sfondo della pagina,
TEXT per stabilire il colore RR GGBB del testo della pagina.

Quindi si può scrivere un comando di questo tipo:
<BODY
BGCOLOR="#RRGGBB"
TEXT="#RRGGBB" >


ESEMPIO:
<BODY
BGCOLOR="#000000"
TEXT="#BC8F8F" >

Sapendo che #000000 è il nero e che #BC8F8F è il rosa antico, si capisce che la pagina descritta ha testo rosa antico su sfondo nero.


DIMENSIONE e STILE del TESTO

<B>testo</B> per visualizzare il testo in grassetto
<I>testo</I> per visualizzare il testo in corsivo
<U>testo</U> per visualizzare il testo sottolineato

<FONT SIZE=4>parole</FONT> impone che il testo parole sia di dimensione 4.
Il numero da associare a SIZE può variare da 1 a 7. A numero più basso corrisponde carattere più piccolo.

Se si vuole dimensionare una scritta in grassetto, si possono utilizzare i comandi <B> </B> (per il grassetto) e <FONT SIZE=...> </FONT> (per la dimensione), oppure si può utilizzare il comando <H...> </H>, dove al posto dei puntini deve essere inserito un numero intero da 1 a 6 ricordandosi che a numero più basso corrisponde carattere più grande.

Ad esempio si osservino le prime due scritte all'inizio di questa pagina Web.
1) HyperText Markup Language è in H2 (ed è anche in corsivo), il suo codice è:

<H2><I>HyperText Markup Language</I></H2>

2) HTML è in H1, il suo codice è: <H1>HTML</H1>.


Da notare che il comando <H...>...</H...> determina anche dei ritorni a capo.


RITORNO A CAPO

Il semplice comando <BR> impone un ritorno a capo del testo, mentre <P> determina un ritorno a capo e una riga vuota.

Si può inserire una linea di separazione, per evidenziare maggiormente il distacco, con il comando <HR>.
La riga di separazione creata con <HR> è visualizzata qui sotto:



LE LISTE

Una lista ordinata di questo tipo:

  1. primo elemento
  2. secondo elemento
  3. terzo elemento

si scrive con questo codice:

<OL>
<LI>primo elemento </LI>
<LI>secondo elemento </LI>
<LI>terzo elemento </LI>
</OL>

OL = Ordered List.

Si può aggiugere ad <OL> l'attributo TYPE per specificare il formato del numero:
a per le lettere minuscole,
A per le maiuscole,
i per i numeri romani minuscoli,
I per quelli maiuscoli.

Ad esempio una lista di questo tipo:

  1. primo elemento
  2. secondo elemento
  3. terzo elemento
  4. quarto elemento

si scrive con questo codice:

<OL TYPE=a>
<LI>primo elemento </LI>
<LI>secondo elemento </LI>
<LI>terzo elemento </LI>
<LI>quarto elemento </LI>
</OL>

Mentre una lista di questo tipo:

  1. primo elemento
  2. secondo elemento
  3. terzo elemento
  4. quarto elemento

si scrive con questo codice:

<OL TYPE=I>
<LI>primo elemento </LI>
<LI>secondo elemento </LI>
<LI>terzo elemento </LI>
<LI>quarto elemento </LI>
</OL>

Una lista non ordinata di questo tipo:

si scrive con questo codice:

<UL>
<LI>primo elemento </LI>
<LI>secondo elemento </LI>
<LI>terzo elemento </LI>

UL = Unordered List.

Si può aggiugere ad <UL> l'attributo TYPE per specificare il tipo di pallino prescelto:
disc è lo standard
circle è un quadratino vuoto
square è un quadratino pieno

Ad esempio una lista di questo tipo:

si scrive con questo codice:

<UL TYPE=square>
<LI>primo elemento </LI>
<LI>secondo elemento </LI>
<LI>terzo elemento </LI>


IMPORTANTE: non tutti i browser supportano tutti gli attributi citati, in questi casi tali attributi vengono ignorati.



IMMAGINI

I più comuni formati delle immagini nel Web sono:
GIF (Graphic Image Format)
JPEG (Joint Photographic Eperts)
I file in formato GIF hanno estensione gif. I file in formato JPEG hanno estensione jpg.

Il comando necessario per inserire un file che rappresenta un'immagine digitale è:

<IMG SRC=" ... ">

Dove fra le virgolette "" c'e' il nome del file. IMG sta per Image, SRC sta per Source.

Attributi di IMG sono:
ALT fornisce, in alternativa all'immagine, una stringa di testo leggibile nel caso in cui il browser operi in modalità non grafica
ALIGN per indicare al browser dove si vuole disporre l'immagine

Esempio:

<IMG ALIGN="top" SRC="foto.jpg">
L'immagine foto.jpg è allineata lungo il lato superiore rispetto alla linea di testo in cui essa è inserita.
Alcuni valori dell'attributo ALIGN sono: top, bottom, middle.

<IMG SRC="foto.jpg" ALT="Mia Nonna"> In caso di browser funzionante in modalità non grafica, invece della visualizzazione dell'immagine apparirà la scritta Mia Nonna.

Tornando al comando

, l'attributo per imporre come sfondo un'immagine nome.est è:
<BODY BACKGROUND="nome.est">



COLLEGAMENTI ESTERNI e POSTA ELETTRONICA

Se si vuole fare un collegamento ad una pagina il cui indirizzo Internet è www.nome.est, il comando è:

<A HREF="http://www.nome.est"> ... </A>

In questo modo, cliccando sul testo qui raffigurato con ..., ci si collega alla pagina che sta all'indirizzo http://www.nome.est.

Se si vuole fare un collegamento ad un indirizzo di posta elettronica nome@provider, il comando è:

<A HREF="mailto:nome@provider"> ... </A>

In questo modo, cliccando sul testo qui raffigurato con ..., verrà visualizzata l'apposita finestra destinata a compilare il messaggio da spedire a quell'indirizzo.



CHE COS'E'

WWW (World Wide Web) è il progetto ideato nel 1989 basato sulla possibilità di collegare una grande quantità di ipertesti situati su macchine, anche molto distanti fra loro, attraverso l'utilizzo di delle reti telefoniche.

Server = macchina che serve i documenti ai browser che ne fanno richiesta. Il Web è una rete di server collegati o collegabili tra loro, i quali operano attraverso un portocollo di comunicazione detto TCP/IP (Transfer Control Protocol / Internet Protocol).

Browser = software utilizzato per visualizzare una pagina Web e interagire con essa.

HTTP (HyperText Transfer Protocol) è un protocollo di comunicazione che consente la comunicazione tra il browser e il server Web.

Una guida davvero interessante
La più completa e visitata guida dell'utente a Internet prodotta in Italia e reperibile sulla rete:
Internet & Computing Italian FAQ




Ritorno alla Pagina Principale...