ultima evoluzione Html

comandi implementati in modo differente dai diversi browser

alcuni comandi per il momento non supportati (prossime versioni)

Il bordo dei frame

Lo stile

Relazioni tra documenti

Programmi dentro l'html

Sono previsti tre nuovi attributi del comando FRAMESET

<FRAMESET FRAMEBORDER="yes|no">

mostra o nasconde il bordo del frame

Frame senza bordo

N.B. se il contenuto del frame ha dimensioni maggiori della cella viene visualizzata la barra di scorrimento: per impedirlo si utilizza scrolling=no

<FRAMESET BORDERCOLOR="#rrggbb">

modifica il colore del bordo del frame

Bordo rosso

<FRAMESET BORDER=?>

modifica la dimensione del bordo del frame

Bordo spesso (25)

<STYLE TYPE="text/css" MEDIA="strumento"> <!--linguaggio_di_stile--> </STYLE> dove

TYPE="text/css" individua il linguaggio di stile utilizzato

strumento: individua lo strumento per il quale si specifica lo stile in questione

screen: schermo, il default

tty : terminali o devices con capacità grafiche limitate

tv : devices tipo-televisione (bassa risoluzione, a colori, limitata scrollabilità).

projection : proiettori

handheld : schermi piccoli, monocromatici, con ampiezza di banda limitata

print : documenti visualizzati sullo schermo in print preview mode

braille : devices con feedback tattile per il braille

aural : sintetizzatori vocali

all : tutti

linguaggio_di_stile ha la seguente sintassi

• tag_da_modificare{Attributo:Valore;...}
  
• Ecco qualche semplice esempio
  
• L'elenco completo degli attributi e dei valori possibili

  	Attributo	Valore
  Generale	color	#rrggbb
  	background	#rrggbb
  Font	font-size	pt px cm
  	font-height	pt px cm
  	font-family	carattere
  	font-style	oblique, italics, normal
  	font-weight	bold, demi-bold, medium, light
  	font-variant	small-caps
  	line-height	pt px % (altezza linea rispetto al testo)
  	text-decoration	underline, overline, line-through, blink
  	text-indent	pt px cm (dimensione indentazione)
  	text-align	center, justify (allineamento testo)
  	text-color	#rrggbb
  Margini	margin-top	pt px cm (grandezza margine superiore)
  	margin-left	pt px cm (grandezza margine sinistro)
  	margin-right	pt px cm (grandezza margine destro)
  	border-width	pt px cm (dimensioni bordo)
  	border	solid
  Sfondo	background	colore/immagine, scroll/fixed, repeat-x/repeat-y, repeat/no-repeat, posizione

• Sintassi abbreviata

Le principali caratteristiche di questo comando sono

flessibilità: posizionandoli in file separati i comandi di stile possono essere riutilizzati facilmente

indipendenza: sono supportati diversi linguaggi di stile (il più comune è CSS = Cascading Style Sheets)

ereditarietà: le istruzioni possono provenire da fonti differenti e concorrere nel formare "a cascata" lo stile della pagina

focalizzazione sullo strumento: è possibile indicare formattazioni particolari della pagina, a seconda dello strumento utilizzato (schermo, stampante, browser testuale, proiettore, etc)

differenzazioni: indicando stili in alternativa si possono offrire diversi modi di visualizzare lo stesso documento

performance: i comandi di stile sono caricati solo in caso di effettivo utilizzo da parte del browser, aumentando pertanto la velocità di trasferimento e impaginazione

Sono stati introdotti due comandi da utilizzare con lo stile:

<SPAN></SPAN>: continua senza interruzioni

<DIV></DIV>: manda a capo (come <P>)

   raggruppano gli elementi all'interno di un documento Html e consentono di applicare a tutto il contenuto una classe di stile

Lo stile viene gestito da (in ordine crescente):

1. browser - formattazione di default delle pagine
2. utente - personalizzando le opzioni del browser
3. autore - attraverso il comando STYLE

Lo stile può essere inserito:

1. singolo tag - vale per il singolo tag
2. HEAD - vale per tutto il documento html
3. file esterno - vale per vari documenti html

altri esempi:

1. un sorgente e il risultato
2. esempi Microsoft
3. altri esempi Microsoft: web embedding font - la possibilità di fornire automaticamente i font usati all'interno delle pagine

All'interno del comando HEAD è possibile indicare alcune relazioni tra documenti esterni e quello attuale.

< LINK HREF="indirizzo del documento" REL|REV="tipo di relazione"> dove

indirizzo del documento indica la posizione in cui si trova il documento cui fare riferimento

REL indica una relazione normale col documento specificato

REV indica una relazione inversa col documento specificato

         N.B. se A è in relazione REL con B, B è in relazione REV con A

tipo di relazione esplicita il legame che intercorre tra i due documenti

relazione	significato	note
stylesheet	stile del documento	per uniformare lo stile del sito e agevolarne le modifiche
home	pagina di partenza del sito	per ritrovare le pagine di partenza del documento
toc	pagina dei contenuti
index	indice	diverso dalla TOC (ad es. in ordine alfabetico)
glossary	glossario
copyright	pagina con le informazioni di copyright
up	documento "sopra" l'attuale	per muoversi agevolmente attraverso le pagine ipertestuali
next	documento successivo
previous	documento precedente
help	pagina di help	se il documento richiede spiegazioni (ad es. form da compilare)
made	informazioni sull'autore	attributo di REV - in generale è l'email dell'autore

A cosa serve:

1. semplificare la gestione di siti complessi ed articolati
2. agevolare la navigazione dell'utente tra le pagine ipertestuali
3. fornire informazioni aggiuntive sul documento Html
4. fornire ai motori di ricerca ulteriori parametri su cui effettuare le indagini

È possibile inserire all'interno del comando HEAD intere procedure scritte nel linguaggio appropriato, per superare definitivamente i limiti dell'html statico.

<SCRIPT TYPE="tipo di linguaggio" SRC="locazione di uno script esterno"><!--procedura--></SCRIPT> dove

tipo di linguaggio indica il linguaggio di programmazione adottato

locazione di uno script esterno indica l'URL del programma, nel caso in cui sia in un file esterno

procedura è l'insieme degli statement del programma

Note:

1. occorre inserire la procedura tra commenti
   inizio commento: <!--
   fine commento: Javascript   // -->     VBscript   ' -->     Tcl   # -->
2. <NOSCRIPT>...</NOSCRIPT> per i browser che non supportano lo script

Esempi:

1. TYPE="text/vbscript" procedura VBScript
2. TYPE="text/javascript" procedura JavaScript
3. TYPE="text/tcl" procedura TCL

Eventi intrinsechi: azioni che accadono in una pagina e che si possono associare a procedure dello script

1. onload - il browser carica la pagina o il frame
2. onunload - il browser rimuove la pagina o il frame
3. onclick - il bottone del mouse preme sull'oggetto in questione
4. ondblclick - il bottone del mouse preme due volte sull'oggetto in questione
5. onmousedown - il bottone del mouse trattiene l'oggetto in questione
6. onmouseup - il bottone del mouse rilascia l'oggetto in questione
7. onmouseover - il mouse passa sull'oggetto in questione
8. onmousemove - il mouse si muove sull'oggetto in questione
9. onmouseout - il mouse si sposta dall'oggetto in questione
10. onfocus - un elemento viene evidenziato, tramite mouse o tasto di tabulazione
11. onblur - un elemento evidenziato viene rilasciato
12. onkeypress - un tasto viene premuto e rilasciato su un elemento
13. onkeydown - un tasto viene premuto su un elemento
14. onkeyup - un tasto viene rilasciato su un elemento
15. onsubmit - un form viene inviato
16. onreset - un form viene cancellato
17. onselect - un testo viene evidenziato
18. onchange - un testo risulta modificato