Manuale HTML in italiano


Sommario

    Generale
    Struttura di base di un documento HTML
    Formattazione
    Dal grassetto all'allineamento, dal colore all'impostazione della grandezza del testo
    Collegamenti (Link, Hyperlink, Ancore)
    Capire e strutturare i link interni ed esterni dei documenti ipertestuali
    Immagini
    Inserimento di immagini, loro dimensione e risoluzione video
    Mappe: definizione
    Creare immagini intelligenti!!! , tipi di mappature e programmi di utilità
    Segni di paragrafo e argomento
         Spaziature e formattazioni
    Liste
    Liste libere, elenchi puntati e numerati, liste composte
    Sfondi e colori
    Attributi colore del documento, programmi per gestire colori RGB
    Caratteri speciali
    Tabelle di conversione e di consultazione per caratteri latin e simboli di utilità generica
    Moduli , Schede o form
    Tutti i tag per la creazione di form complessi e di acquisizione dati utente
    Tabelle
    Uso delle tabelle per presentazione dati e per impaginazioni di alto livello grafico
    Frames
    Divisione e gestione della finestra del browser in porzioni
    Target (destinazione dei link)
    Gestione della destinazione dell' output proveniente da link o processi server come risposte di form
    Varie e curiosità
    Comandi non classificabili nelle sezioni precedenti


G E N E R A L E 
(impostazioni obbligatorie del documento ipertestuale)

Tipo di documento <HTML></HTML> (inizio e fine del file, tag obbligatorio)
Testata <HEAD></HEAD> (descrizioni varie; come il titolo e i Meta Name)
Titolo documento <TITLE></TITLE> (nome del documento; contenuto in Head)
Contenuto <BODY></BODY> (corpo del file)


F O R M A T T A Z I O N E  D E L  T E S T O
Aggiornata il 21-marzo-1997

Titoli di paragrafo e capitoli <H?></H?> (sono possibili 6 diversi livelli di grandezza ed importanza h1,h2, etc.)
Allineamento titolo <H? ALIGN=LEFT|CENTER|RIGHT></H?>
Divisione di un blocco <DIV></DIV> usato per porzioni di testo o paragrafi
Allineamento del blocco <DIV ALIGN=LEFT|RIGHT|JUSTIFY|CENTER></DIV>
Formattazioni particolari

Citazioni <BLOCKQUOTE></BLOCKQUOTE> rientrato
Evidenziato <EM></EM> corsivo
Molto marcato <STRONG></STRONG> neretto
Citazione <CITE></CITE> corsivo
Codice programm. <CODE></CODE> programmi
Esempio <SAMP></SAMP>
Immissione da tastiera <KBD></KBD> carattere a spaziatura fissa
Variabile <VAR></VAR>
Definizione <DFN></DFN>
Indirizzo dell'autore <ADDRESS></ADDRESS>

corsivo

Font grande <BIG></BIG>
Font piccolo <SMALL></SMALL>
Grassetto <B></B>
Corsivo <I></I>
Sottolineato <U></U> (non più supportato)
Depennato (Strikeout) <S></S>
Pedice <SUB></SUB>
Apice <SUP></SUP>
Font non scalabile <TT></TT> (spaziatura fissa)
Preformattato <PRE></PRE> (mantiene gli allineamenti originali)
Larghezza <PRE WIDTH=?></PRE> (in caratteri)
Centrato <CENTER></CENTER> (sia per testo che immagini)
Intermittente <BLINK></BLINK> (il comando più ridicolo)
Specifica il tipo di Font <FONT FACE="Verdana,Arial,Helvetica,Geneva"> HTML3
Grandezza del Font <FONT SIZE=?></FONT> (valori da 1 a 7)
Cambia la grandezza del font <FONT SIZE=+|-?></FONT>
Grandezza font di base <BASEFONT SIZE=?> (da 1 a 7; il valore di default e' 3)
Colore del Font <FONT Color="#$$$$$$"></FONT>


C O L L E G A M E N T I
N E L  T E S T O  E  A D  A L T R I  F I L E

Collegamento di base <A HREF="URL"></A>
link ad un' ancora nel file <A HREF="URL#$$$$"></A> (in altro file)

<A HREF="#$$$$"></A> (nello stesso file)
ad un file indicando la destinazione <A HREF="URL" TARGET="$$$$"></A> (nello stesso file)
Definizione di ancora nel file <A NAME="$$$$"></A>


I M M A G I N I
Inserimento di una immagine <IMG SRC="URL">
Allineamento <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE>
Allineamento <IMG SRC="URL" ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE>
testo alternativo <IMG SRC="URL" ALT="$$$$"> (quando non viene visualizzata l'immagine si vedra' il testo carattere)
Mappa navigabile <IMG SRC="URL" ISMAP> (richiede un script)
Mappa navigabile client-side o locale <IMG SRC="URL" USEMAP="URL#$$$$">
Dimensioni <IMG SRC="URL" WIDTH="?" HEIGHT="?"> (in pixel)
Bordi <IMG SRC="URL" BORDER=?> (in pixel)
Bassa risoluzione <IMG SRC="URL" LOWSRC="URL">
Spaziatura <IMG SRC="URL" HSPACE=? VSPACE=?>


M A P P E
Old: occorre conoscere in molti casi la directory sul server per posizionare il file .map di definizione
Aggiornamento: Usando un tipo di dichiarazione Client-Side il file .map non è più necessario. La definizione di mappa può essere dichiarata all'interno del file documento HTML. Per la dichiarazione si usa il codice <MAP NAME="nome della mappa">  </MAP> come indicato sotto.

Specifica della mappa <MAP NAME="$$$$";></MAP> (descrive la mappa)
Sezione mappa <AREA SHAPE="RECT|CIRCLE|POLYGON" COORDS=",,," HREF="URL"|NOHREF>

Consigliamo un programma tipo MapThis per la creazione del file .map e per la specifica delle coordinate dei segmenti


S E G N I  D I  P A R A G R A F O  E D  A R G O M E N T O

Paragrafo <P></P> (lascia due righe bianche)
Allineamento <P ALIGN=LEFT|CENTER|RIGHT></P>
Interruzione riga <BR> (ritorno a capo)
Riga orizzontale <HR>
Parametri:

Allineamento <HR ALIGN=LEFT|CENTER|RIGHT>
Spessore <HR SIZE=?> (in pixel)
Larghezza <HR WIDTH=?> (in pixel)
in % <HR WIDTH=%> (come percentuale della larghezza della pagina)
No effetto 3D <HR NOSHADE>


L I S T E 
Elenchi semplici, composti, numerati o puntati
Liste libere <UL><LI></UL> (<LI> prima di ogni elemento)
Punto <UL TYPE=DISC|CIRCLE|SQUARE> ( valido per tutta la lista)

<LI TYPE=DISC|CIRCLE|SQUARE> (valido per questo e i successivi)
Liste numerate <OL><LI></OL> (<LI> prima di ogni elemento)
Tipo di numero <OL TYPE=A|a|I|i|1> (valido per per tutta la lista)

<LI TYPE=A|a|I|i|1> (valido per questo e i successivi)
Numero di partenza <OL VALUE=?> (per tutta la lista)
<LI VALUE=?> (questo e successivi)
Lista di definizioni <DL><DT><DD></DL> Molto usata nella definizione dei menu
Se date un'occhiata al sorgente di questa guida avrete un valido esempio della Lista di Definizione :-)


S F O N D I E D E F I N I Z I O N E D I C O L O R E

Colore di sfondo <BODY BGCOLOR="#$$$$$$"> (in ordine di RGB)
colore dei collegamenti <BODY LINK="#$$$$$$">
colore dei collegamenti visitati <BODY VLINK="#$$$$$$">
colore del testo <BODY TEXT="#$$$$$$">
colore del collegamento in corso <BODY ALINK="#$$$$$$">
immagine di sfondo <BODY BACKGROUND="URL">


E L E N C O D E I C O L O R I

TABELLA DI CONVERSIONE COLORI IN ESADECIMALE
 FFFFFF  FFFFCC  FFFF99  FFFF66  FFFF33  FFFF00  FFCCFF  FFCCCC
 FF9933  FF9900  FF66FF  FF66CC  FF6699  FF6666  FF6633  FF6600
 FF0099  FF0066  FF0033  FF0000  CCFFFF  CCFFCC  CCFF99  CCFF66
 CC99FF  CC99CC  CC9999  CC9966  CC9933  CC9900  CC66FF  CC66CC
 CC3333  CC3300  CC00FF  CC00CC  CC0099  CC0066  CC0033  CC0000
 99CC99  99CC66  99CC33  99CC00  9999FF  9999CC  999999  999966
 9933FF  9933CC  993399  993366  993333  993300  9900FF  9900CC
 66FF33  66FF00  66CCFF  66CCCC  66CC99  66CC66  66CC33  66CC00
 666699  666666  666633  666600  6633FF  6633CC  663399  663366
 33FFFF  33FFCC  33FF99  33FF66  33FF33  33FF00  33CCFF  33CCCC
 339933  339900  3366FF  3366CC  336699  336666  336633  336600
 330099  330066  330033  330000  00FFFF  00FFCC  00FF99  00ff66
 0099FF  0099CC  009999  009966  009933  009900  0066FF  0066CC
 003333  003300  0000FF  0000CC  000099  000066  000033  EE0000
 110000  00EE00  00DD00  00BB00  00AA00  008800  007700  005500
 000077  000055  000044  000022  000011  EEEEEE  DDDDDD  BBBBBB
 FFCC99  FFCC66  FFCC33  FFCC00  FF99FF  FF99CC  FF9999  FF9966
 FF33FF  FF33CC  FF3399  FF3366  FF3333  FF3300  FF00FF  FF00CC
 CCFF33  CCFF00  CCCCFF  CCCCCC  CCCC99  CCCC66  CCCC33  CCCC00
 CC6699  CC6666  CC6633  CC6600  CC33FF  CC33CC  CC3399  CC3366
 99FFFF  99FFCC  99FF99  99FF66  99FF33  99FF00  99CCFF  99CCCC
 999933  999900  9966FF  9966CC  996699  996666  996633  996600
 990099  990066  990033  990000  66FFFF  66FFCC  66FF99  66FF66
 6699FF  6699CC  669999  669966  669933  669900  6666FF  6666CC
 663333  663300  6600FF  6600CC  660099  660066  660033  660000
 33CC99  33CC66  33CC33  33CC00  3399FF  3399CC  339999  339966
 3333FF  3333CC  333399  333399  333333  333300  3300FF  3300CC
 00FF33  00FF00  00CCFF  00CCFF  00CC99  00CC66  00CC33  00CC00
 006699  006666  006633  006633  0033FF  0033CC  003399  003366
 DD0000  BB0000  AA0000  AA0000  770000  550000  440000  220000
 004400  002200  001100  001100  0000DD  0000BB  0000AA  000088
 AAAAAA  888888  555555  444444  444444  222222  111111  000000
Si ringrazia Steve Jacobson per la tabella

Un ringraziamento particolare a Doug Jacobson per la realizzazione della mappa!


C A R A T T E R I  S P E C I A L I
Il seguente elenco non è completo ma comprende i caratteri maggiormente usati nei documenti HTML per usi particolari. Per maggiori informazioni consiglio di consultare le pagine del CERN.

carattere speciale &#?; (? indica il codice ISO) carattere speciale &#?; (? indica il codice ISO)
< &lt; Ograve Ò &Ograve
> &gt; Ocirc Ô &Ocirc
& &amp; Otilde Õ &Otilde
" &quot; Ouml Ö &Ouml
Aacute Á &Aacute; Oslash Ø &Oslash
Agrave À &Agrave
Acirc  &Acirc Uacute Ú &Uacute
Atilde à &Atilde Ugrave ٠&Ugrave
Aring Å &Aring Ucirc Û &Ucirc
Auml Ä &Auml Uuml Ü &Uuml
AElig Æ &AElig Yacute Ý &Yacute
Ccedil Ç &Ccedil THORN Þ &THORN
Eacute É &Eacute aelig æ &aelig
Egrave È &Egrave eacute é &eacute
Ecirc Ê &Ecirc egrave è &egrave
Euml Ë &Euml ecirc ê &ecirc
Iacute Í &Iacute euml ë &euml
Igrave Ì &Igrave reg ® &reg; Registered TradeMark
Icirc Î &Icirc copy © &copy; Copyright
Iuml Ï &Iuml trade &trade; &trade; TradeMark
ETH Ð &ETH nbsp   &nbsp; Non breaking space
Ntilde Ñ &Ntilde
Oacute Ó &Oacute


M O D U L I
Per ottenere risposte ottimali occorre uno script di tipo cgi sul server oppure si puo' usare il mailto: abbinato al POST
Script di tipo mail si possono trovare facilmente e gratuitamente in vari server Internet, con allegata documentazione per l'uso.
Definizione <FORM ACTION="URL" METHOD=GET|POST></FORM>
Upload di file <FORM ENCTYPE="multipart/form-data"></FORM>
Campo di immissione <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET">
Nome campo <INPUT NAME="$$$$">
Valore del campo <INPUT VALUE="$$$$">
Lunghezza massima <INPUT MAXLENGTH=?> (in caratteri)
Selezionato di default <INPUT CHECKED> (checkbox e radio)
Grandezza <INPUT SIZE=?>
Selezione elenco delle opzioni <SELECT></SELECT>
Nome campo <SELECT NAME="$$$$"></SELECT>
Numero opzioni <SELECT SIZE=?></SELECT>
Selezione multipla <SELECT MULTIPLE> (per selezionare più di 1 elemento)
Opzioni <OPTION> (elementi che possono essere selezionati)
Opzione di default <OPTION SELECTED>
Finestra di immissione <TEXTAREA ROWS=? COLS=?></TEXTAREA>
Nome del campo <TEXTAREA NAME="$$$$"></TEXTAREA>
A capo automatico in diversi modi <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>


T A B E L L E

Definizione tabella <TABLE></TABLE>
Bordo <TABLE BORDER></TABLE> (per visualizzare il bordo)
Si puo' impostare lo spessore del bordo <TABLE BORDER=?></TABLE> (per indicare lo spessore)
Spazio tra le celle <TABLE CELLSPACING=?>
Spazio tra testo e bordo <TABLE CELLPADDING=?>
Larghezza tabella <TABLE WIDTH=?> (in pixel)
Larghezza tabella in % <TABLE WIDTH=%> (percentuale della pagina)
Riga <TR></TR>
Allineamento <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
Campo dati <TD></TD> (definita dentro una definizone di riga)
Allineamento <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
No interruzione <TD NOWRAP>
Colonne da occupare <TD COLSPAN=?>
Righe da occupare <TD ROWSPAN=?>
Larghezza desiderata <TD WIDTH=?> (in pixel)
Larghezza desiderata in % <TD WIDTH=%> (percentuale della tabella)
Titolo della colonna <TH></TH> (come <TD>, ma in neretto e centrata)
Legenda della tabella <CAPTION></CAPTION>
Allineamento <CAPTION ALIGN=TOP|BOTTOM> (sopra o sotto la tabella)


F R A M E
Divisione e gestione di parti della finestra del browser
ATTENZIONE: la compatibilità dei Frame è limitata al Netscape 2.0 e succ. e all'explorer Microsoft ultima ver.
Questa sezione viene aggiornata con le nuove specifiche HTML3 in data 21-marzo-1997

Documento FRAME <FRAMESET></FRAMESET> (al posto di <BODY>)
altezza in righe <FRAMESET ROWS=,,,></FRAMESET> (pixel o %)
altezza in righe <FRAMESET ROWS=*></FRAMESET> (* = misura relativa)
larghezza in colonne <FRAMESET COLS=,,,></FRAMESET> (pixel o %)
larghezza in colonne <FRAMESET COLS=*></FRAMESET> (* = misura relativa)
Definizione <FRAME> (contenuto di ogni singolo quadro)
Gestione dei bordi <FRAME BORDER=Yes | No Bordercolor="RGB"> Presente sia in FRAMES che in FRAMESET
Bordo in Frameset <FRAMESET Bordercolor="canale RGB">
Gestione dei Margini <FRAME MARGIN="xx,yy">
Visualizza documento <FRAME SRC="URL">
Nome del frame <FRAME NAME="$$$$"|_blank|_self|_parent|_top>
Larghezza margine <FRAME MARGINWIDTH=?> (margine destro e sinistro)
Altezza margine <FRAME MARGINHEIGHT=?> (margine alto e basso)
Barra di scorrimento? <FRAME SCROLLING="YES|NO|AUTO>
Misure non modificabili <FRAME NORESIZE>
Contenuto in assenza di frame <NOFRAMES></NOFRAMES> (per i browser che non supportano FRAME)


T A R G E T  (DESTINAZIONE DEI LINK)

target in una definiz. di ancora < A HREF="url" TARGET="nome_finestra">Ancora di destinazione </A> Visualizza il link nella finestra indicata nel target
target di base < BASE TARGET="nome_finestra"> Imposta di default la finestra indicata nel target
target in una mappa < AREA SHAPE="shape" COORDS="x,y,..."> TARGET="finestra_destinazione"> Visualizza il link risulatto dalla mappa nella finestra indicata dal target
target in un form < FORM ACTION="url" TARGET="nome_finestra"> Visualizza il risultato del form nella finestra indicata nel target
Target Speciali TARGET="_blank" Visualizza il link in nuova finestra vuota
Target Speciali TARGET="_self" link nella stessa finestra
Target Speciali TARGET="_parent" link nella finestra parente. Se non esiste diventa come _self
Target Speciali TARGET="_top" link nella stessa finestra ma a tutto schermo


V A R I E
Aggiornata il 20-marzo-1997

Mulicolonne <MULTICOL COLS="$$" GUTTER="$$" WIDTH="$$"> Imposta più colonne definendo il numero di colonne, la spaziatura e la larghetta fissa o in percentuale
Relazioni <LINK REV="$$$$" REL="$$$$" HREF="URL"> (nella testata)
Meta Informazioni <META> (deve essere nella testata)
Commenti <!-- $$$$ --> (non visualizzati dal browser)
Prologo <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
Prologo <!DOCTYPE HTML PUBLIC "-//W3O//DTD W3 HTML 3.0//EN">
Prologo <!DOCTYPE HTML PUBLIC "-//microsoft corp.//DTD HTML //EN">
Ricerca <ISINDEX> (indica che è un documento collegato ad un database indicizzato in cui è possibile fare ricerche)
Domanda <ISINDEX PROMPT="$$$$"> (testo da anteporre alla casella di inserimento)
Invio ricerca <A HREF="URL?$$$$"></a> (usare il punto di domanda)
URL base di questo file <BASE HREF="URL"> (deve essere nella testata)



Tutti i diritti riservati ai legittimi proprietari



Torna Indietro



Ricerca <ISINDEX> (indica che è un documento collegato ad un database indicizzato in cui è possibile fare ricerche) Domanda <ISINDEX PROMPT="$$$$"> (testo da anteporre alla casella di inserimento) Invio ricerca <A HREF="URL?$$$$"></a> (usare il punto di domanda) URL base di questo file <BASE HREF="URL"> (deve essere nella testata)

Tutti i diritti riservati ai legittimi proprietari



Universo Pc / Mr.Tax's Home page - Mirror site
mrtax@geocities.com Ultimo aggiornamento
web design Mr.Tax - 1999
(usare il punto di domanda) URL base di questo file <BASE HREF="URL"> (deve essere nella testata)

Tutti i diritti riservati ai legittimi proprietari



Universo Pc / Mr.Tax's Home page - Mirror site
mrtax@geocities.com Ultimo aggiornamento
web design Mr.Tax - 1999