Home

IL LINGUAGGIO HTML

Home

Il concetto di ipertesto è alla base del linguaggio HTML; tale linguaggio è derivato dal protocollo internazionale SGML (Standard Generalized Markup Language) usato per la definizione di documenti distribuiti.
Infatti, l'HTML (HyperText Markup Language) è il linguaggio nel quale si scrivono gli ipertesti del World Wide Web.

L'HTML consente:

·  l'inserimento di specificazioni relative alla struttura del testo, come titoli, limiti dei paragrafi, elenco di elementi.

·  l'utilizzo di vari stili di scrittura: testo in grassetto o corsivo, citazioni, etc.

·  Connessioni ipertestuali con altri oggetti della rete: parti sensibili del documento da cui potremmo raggiungere altri documenti nel Web. Questi sono detti "links" o collegamenti

Tutto questo "valore aggiunto" al testo viene inserito in maniera codificata mediante etichette o ("tags") che vengono aggiunte al testo. Le etichette di HTML si delimitano per mezzo dei segni "<" e ">": per esempio l'etichetta <P> segna l'inizio di ogni paragrafo. La maggior parte delle etichette HTML richiede un secondo tag di chiusura caratterizzato dai segni "</" e ">": per esempio, <TITLE> e </TITLE> aprono e chiudono il titolo del documento, mentre i segni <A> e </A> delimitano i link.

La sintassi dei vari tag HTML sara' argomento dei successivi paragrafi. La cosa importante da ricordare adesso e' che i documenti HTML sono scritti in caratteri ASCII, cioe' in testo normale (plain text).
Per realizzare dei propri documenti HTML non e' necessario utilizzare un editor di tipo particolare, ma e' sufficiente un qualsiasi programma di scrittura com Winword o Write. Una volta creato il testo esso va salvato come Solo Testo o File di Testo.

 

L'ORGANIZZAZIONE DEI DOCUMENTI HTML

Prima di passare all'analisi dei primi tags HTML è necessaria una precisazione

È buona norma far precedere la creazione dei documenti dalla definizione di uno schema chiaro che stabilisca le regole che si intende seguire durante il processo di creazione e inserimento delle informazioni.

Per chairire meglio questo concetto, prendiamo come riferimento il Server dell'Università di Siena.
Le informazioni che l'ateneo ha deciso di rendere disponbili alla consultazione sono di vario genere: ci sono informazioni relative alla struttura dell'ateneo, ai servizi che l'ateneo mette a disposizione, alle varie strutture didattiche o di ricerca che ne fanno parte con annessa descrizione delle attività svolte.

Alcune notizie sono rivolte agli studenti (presenti e futuri), altre al personale docente, altre al personale amministrativo, altre a chiunque sia interessato a sapere qualcosa su Siena sia come sede universitarie che come città di turismo e di cultura.
Come si vede, la quantità di informazioni disponibili è notevole, per cui conviene già in fase di avvio pianificare l'organizzazione del server.

Nel caso del server dell'università è stato deciso di suddividere i documenti in varie sezioni scelte in base all'argomento trattato. Le informazioni relative alla didattica, per esempio, sono state accorpate in una sezione apposita.
Al suo interno sono state successivamente sviluppate alcune sottosezioni relative alle varie facoltà dell'ateneo, così come all'interno della singola facoltà sono state ripartite le informazioni relative ai vari Corsi di Laurea. Questa struttura di tipo logico è stata riprodotta anche nella organizzazione fisica dei file che rappresentano i singoli documenti; i file relativi alla facoltà di Economia, sono stati raggruppati in una singola directory che è stata posta all'interno di una altra directory chiamata, facoltà.
Questa, a sua volta, fa parte di un'altra directory (definita Root) che contiene tutti i documenti HTML del server dell'ateneo.

Questo tipo di organizzazione facilita anche la manutenzione dei documenti HTML; nel caso si debba aggiornare il programma di un insegnamento di economia sarà sufficiente posizionarsi nella apposita directory e cercare il file che contiene i programmi dei corsi. La cosa sarebbe stata molto più complessa se tutti i documenti relativi a tutti i corsi di tutte le facoltà fossero stati ammucchiati all'interno di una singola directory.

La posizione del singolo documento relativamente alla directory root è importante, come vedremo, per la realizzazione dei link.

 

 

STRUTTURA DI UN DOCUMENTO HTML

Un documento HTML é costituito essenzialmente da due parti:

  1. la testata
  2. il corpo

Ogni documento HTML inizia con il tag

<HTML>

Di seguito troviamo la testata che é identificata dai tag

<HEAD> ......................... </HEAD>

Nella testata si trova il titolo contraddistinto dai tag

<TITLE> ............................ </TITLE>

Ció che é contenuto fra i tag <TITLE> e </TITLE> é il titolo del documento che é visualizzato nella barra del titolo della finestra del browser WWW.
Il titolo é importante poiché viene registrato come richiamo nel bookmark quindi deve essere significativo rispetto al contenuto del documento che lo contiene.

Fa seguito alla testata il corpo del documento, identificato dai tag

<BODY>...........................</BODY>

Un documento HTML si conclude con il tag

</HTML>

Quindi la struttura di una pagina HTML si puó riassumere con questo diagramma:

<HTML>

<HEAD>

<TITLE>

Titolo del documento

</TITLE>

</HEAD>

<BODY>

Corpo del documento

</BODY>

</HTML>

 

Il contenuto del tag HEAD è una collezione non ordinata dei seguenti elementi:

    TITLE – definisce il titolo del documento ed è sempre necessario;
    ISINDEX – fornisce una semplice chiave di ricerca;
    BASE – definisce l’URL di riferimento per completare gli indirizzi HTTP relativi presenti nel documento;
    META – fornisce informazioni aggiuntive con coppie nome/valore;
    LINK – definisce collegamenti con altri documenti;
    STYLE – per definire lo stile della pagina (non disponibile);
    SCRIPT - permette l’uso di linguaggi per script (non disponibile).

TITLE
Il titolo, obbligatorio in ogni documento, deve essere relativamente corto, ma nello stesso tempo significativo in quanto appare nelle liste contenenti i siti risultato di una particolare ricerca. Le specifiche dell’HTML 2.0 indicavano che un titolo può essere troncato e che comunque può essere lungo al massimo 63 caratteri.

Un esempio può essere il seguente:

   <TITLE>Il linguaggio HTML</TITLE>

ISINDEX
Fornisce una semplice chiave di ricerca. Tale elemento indica che l’utente ha a disposizione un’area in cui poter inserire una stringa di ricerca; non ci sono restrizioni sul numero di caratteri che possono essere immessi. L’attributo PROMPT può essere usato per specificare un prompt per l’area, ad esempio:

   <ISINDEX PROMPT= "Search Phrase">

Quando l’utente preme il tasto d’invio, la stringa di ricerca viene inviata al server identificato dal codice URL per quel documento.

BASE
Definisce l’URL di riferimento per il documento in esame per gli URL relativi presenti nel documento (ad esempio nell’attributo HREF dell’elemento A). Questo è tipicamente usato quando un documento viene duplicato su un altro server. Per esempio, dato

   <BASE HREF="http://foo.com/index.html">

l’elemento IMG

   <IMG SRC= "images/bar.gif">

si riferisce all’immagine

   http://foo.com/ images/bar.gif

In assenza dell’elemento BASE, viene preso come riferimento l’indirizzo http del server su cui è presente il documento in questione.

META
Tale elemento può essere introdotto per fornire particolari proprietà del documento, come l’autore, la data di validità, una lista di parole chiave, etc.. L’attributo NAME specifica il nome della proprietà, mentre l’attributo CONTENT specifica il valore della proprietà:

   <META NAME="Author" CONTENT="Dave Raggett">

Un altro esempio dell'attributo NAME è il seguente:

   <META NAME="Refresh" CONTENT="20">

In questo caso viene effettuato un refresh della pagina dopo un intervallo di tempo della durata indicata in CONTENT (nell'esempio 20 secondi). Un uso del tag META di questo tipo può essere utile per creare l'effetto di animazione, caricando una sequenza di immagini.

L’attributo HTTP-EQUIV può essere usato al posto di NAME ed ha uno speciale significato quando il file viene inviato con il protocollo HTTP. Un esempio può essere il seguente:

   <META HTTP-EQUIV="Expires" CONTENT="Tue, 20 Aug 1996 14:25:27 GMT">

che crea un header del documento del tipo:

   Expires: Tue, 20 Aug 1996 14:25:27 GMT

LINK
Tale elemento fornisce un metodo per definire collegamenti con altri documenti e risorse; gli attributi di tale elemento sono:

    HREF: specifica l’URL della risorsa collegata;
    REL: fornisce il tipo di collegamento tra il documento e la risorsa collegata (non necessario);
    REV: stabilisce la relazione inversa (non necessario);
    TITLE: fornisce un titolo indicativo per la risorsa collegata (non necessario).

I tipi di collegamenti che possono essere indicati sono:

Top – si indica il documento al top della gerarchia;
Contents – si indica il documento che serve come Table of Contents;
Index – si indica il documento che serve come indice per il documento corrente;
Glossary - si indica il documento che fornisce il glossario dei termini presenti nel documento corrente;
Copyright – fornisce l’indicazione del copyright per il documento corrente;
Next - si indica il documento successivo al corrente;
Previous - si indica il documento precedente al corrente;
Help - si indica il documento che fornisce l’help;
Search - si indica il documento contenente materiale di ricerca collegato al documento corrente.

Alcuni esempi possono essere:

    <LINK REL=Contents HREF=toc.html>
    <LINK REL=Previous HREF=toc.html>
    <LINK REL=Next HREF=toc.html>
    <LINK REL=Chapter REV=Contents HREF=toc.html>

 

 

 

 

 

 

 

L'elemento BODY

Questa parte della struttura di un documento HTML contiene il testo del documento. I possibili attributi dell’elemento BODY sono:

Attributi

Possibili valori

Significato

BGCOLOR

Specifiche del colore

Colore del background del documento

TEXT

Specifiche del colore

Colore del testo del documento

LINK

Specifiche del colore

Colori per link ipertestuali non visitati

VLINK

Specifiche del colore

Colori per link ipertestuali visitati

ALINK

Specifiche del colore

Colori per link ipertestuali attivi

BACKGROUND

URL

URL per l’immagine usata per sfondo

L’utente può definire questi attributi all’interno del suo documento; nel caso in cui non vengano specificati, i colori per lo sfondo e per i collegamenti ipertestuali vengono definiti di default dal browser.

L’elemento BODY può contenere una vasta gamma di elementi:

  • Headings (H1 – H6)
  • L'elemento ADDRESS
  • Formattazione paragrafi
  • Elementi di testo

I LINK

Uno degli aspetti più importanti nello sviluppo di una pagina HTML è la realizzazione dei "Link", cioè l'individuazione di parole chiave attraverso le quali è possibile aprire direttamente un nuovo documento collegato in qualche modo al documento di partenza.
Facciamo un esempio: supponiamo di leggere un documento HTML che descrive le attrattive turistiche della città di Firenze nel seguente modo:

Su Piazza della Signoria si affaccia la Galleria degli Uffizi , considerata una delle più belle d'Europa insiema al Louvre di Parigi e al Museo Hermitage di Leningrado.

Leggere questa frase potrebbe invogliare il lettore a visitare la Galleria degli Uffizi e le opere in essa contenute, per cui potrebbe essere utile usare la parole "Galleria degli Uffizi" come termine chiave per richiamare un altro documento contenente una riproduzione digitale di alcuni dipinti.
Un altro link potrebbe essere messo in corrispondenza di "Louvre" in modo da rimandare ad un altro documento che contiene informazioni più approfondite sulla galleria parigina.

Il collegamento è realizzabile tramite il comando:

<A HREF="URL">.....</A>

Al posto di URL bisogna inserire il nome del file che si intende richiamare tramite questo link, mentre il termine successivo che precede </A> serve per poter attivare tale collegamento.

Per esempio, la seguente frase:

·  "Su Piazza della Signoria si affaccia la Galleria degli Uffizi"

consente, clikkando su "Galleria degli Uffizi" di attivare il collegamento suddetto ed è realizzato tramite queste istruzioni:

Su Piazza della Signoria si affaccia la <A HREF="http://www.uffizi.firenze.it//main.html">Galleria degli Uffizi </A>

In questo caso al posto di URL viene inserito non solo il nome del file a cui si fa riferimento, ma anche il termine http:// seguito dal nome della macchina su cui tale documento è presente (www.uffizi.firenze.it), nonchè dal percorso necessario per arrivare dalla root del server alla directory contenente il documento in questione.

Il nome della macchina può essere omesso solo se il documento a cui si fa riferimento è presente sulla stessa macchina dove risiede il documento da cui parte il collegamento.

Esiste anche un altro tipo di collegamento definito interno, dove il link è utilizzato non per passare da un documanto all'altro, ma semplicemente per andare in un altro punto dello stesso documento di partenza.

Si pensi, ad esempio, ad un indice che contenga tutti gli argomenti presenti nel documento. Una volta individuato l'argomento di interesse, non sarà necessario scorrere tutto il documento per trovarlo ma sarà sufficiente selezionare la voce nell'indice per essere trasportati direttamente al paragrafo relativo.

In questo caso sarà necessario mettere prima del capoverso in questione un secondo tag del tipo:

<A NAME="argomento">......</A>

dove al posto di argomento inserirò un termine di identificazione del paragrafo.

Il termine dell'indice che sarà collegato al paragrafo sarà preceduto da <A HREF="#argomento"> e seguito da </A>.

Come vediamo il tag è sempre lo stesso solo che è omesso sia il nome della macchina che il nome del file, dato che il link rimanda allo stesso documento di partenza.
Il termine argomento è preceduto da un cancelletto (#) per distinguere il collegamento di tipo interno da un eventuale collegamento verso un altro file di nome "argomento".

Combinando opportunamente la sintassi del link interno e di quello esterno sarà possibile effettuare un collegamento ad un capoverso di un documento diverso da quello di partenza, sempre che questo sia fornito degli opportuni tag <A NAME="** ">.

Inseriamo in una tabella i possibili attributi dell'elemento A:

Attributo

Possibili valori

Significato

Note

NAME

Stringa

Nome per un link

Unico all'interno del documento

HREF

URL

Indirizzo di rete per la risorsa collegata

Può essere un altro documento HTMl, un'immagine, etc.

REL

Stringa

Relazione tra le due risorse

-

REV

Stringa

Relazione inversa

-

TITLE

Stringa

Titolo per la risorsa collegata

Avvertenza

È possibile usare l'URL mailto: nell'attributo HREF. Esempio:

<A HREF="mailto:webmaster@info@marinsalta.net">webmaster@marinsalta.net</A>

In questo caso, selezionando tale collegamento, il browser fa partire un compositore di e-mail in cui è già indicato il nome del ricevente.

FORMATTAZIONE DEI PARAGRAFI

Quando scriviamo un documento HTML il fatto che una parte di testo inizi a nuova riga é ininfluente per il browser WWW. Per inserire un nuovo paragrafo il tag è:

<P>

Inserendo questo tag il testo che lo seguirà sarà posizionato a riga nuova lasciando una riga vuota rispetto al testo precedente.
Per andare a capo di una riga soltanto si usa il tag:

<BR>

Per allineare il testo a destra, sinistra o centrato si usano i seguenti tag:

<P ALIGN=RIGHT>Testo allineato a destra</P>
<P ALIGN=CENTER>Testo centrato</P>
<P ALIGN=LEFT>Testo allineato a sinistra</P>

cioè si utilizza l'opzione ALIGN per il tag <P>. Ovviamente in questo caso il tag <P> va chiuso con il rispettivo </P>.

Solo per centrare un testo si può anche utilizzare il tag:

<CENTER>Testo centrato</CENTER>

Per dividere un documento in più parti si utilizza il tag:

<HR>

con le opzioni SIZE e WIDTH definite in pixel per determinare lo spessore e la larghezza:

<HR SIZE=50 WIDTH=100>

Per inserire uno spazio vuoto (il browser non è sensibile a più di uno spazio bianco inserito con la barra spaziatrice) è possibile usare l'elemento:

&nbsp;

FORMATTAZIONE DEI CARATTERI

La formattazione dei caratteri in HTML viene eseguita tramite l'inserimento di tag opportuni.

LIVELLI DI INTESTAZIONE

HTML permette di definire sei livelli di intestazione.
Nella seguente tabella si puó vedere il comando HTML ed il risultato generato:

Comando HTML

 

Pagina WWW

 

 

 

<H1>Titolo 1</H1>

 

Titolo 1

<H2>Titolo 2</H2>

 

Titolo 2

<H3>Titolo 3</H3>

 

Titolo 3

<H4>Titolo 4</H4>

 

Titolo 4

<H5>Titolo 5</H5>

 
Titolo 5

<H6>Titolo 6</H6>

 
Titolo 6

Ciascuno dei sei livelli di intestazione, oltre alla resa grafica mostrata, inserisce una riga vuota sopra e sotto il titolo.

Comando HTML

 

Pagina WWW

 

 

 

<B>Parole in grassetto</B>

 

Parole in grassetto

<I>Parole in corsivo</I>

 

Parole in corsivo

<PRE>Testo preformattato</PRE>

 

 
Testo preformattato

<CENTER>Testo centrato</CENTER>

 

Testo centrato

<FONT SIZE="3">Grandezza Font 3</FONT>

 

Grandezza Font 3

CARATTERI SPECIALI

In HTML l'inserimento di caratteri speciali quali lettere accentate, carattere maggiore e minore ecc... si esegue tramite una serie di codificazioni. Qui si riportano alcune delle principali.

&lt;

 

 

< 

 

minore

 

&gt;

 

> 

 

maggiore

&amp;

 

&

 

e commerciale

&quot;

 

"

 

doppio apice

&agrave;

 

à

 

a con accento grave

&aacute;

 

á

 

a con accento acuto

&egrave;

 

è

 

e con accento grave

&eacute;

 

é

 

e con accento acuto

&igrave;

 

ì

 

i con accento grave

&iacute;

 

í

 

i con accento acuto

&ograve;

 

ò

 

o con accento grave

&oacute;

 

ó

 

o con accento acuto

&ugrave;

 

ù

 

u con accento grave

&uacute;

 

ú

 

u con accento acuto

&Agrave;

 

À

 

A con accento grave

&Egrave;

 

È

 

E con accento grave

&Igrave;

 

Ì

 

I con accento grave

&Ograve;

 

Ò

 

O con accento grave

&Ugrave;

 

Ù

 

U con accento grave

 

COLORI E SFONDO

Il browser Netscape consente l'utilizzo di alcune opzioni che consentono di cambiare il "look" della pagina HTML.
Cio' e' ottenibile attraverso l'utilizzo di alcuni attributi attributi che devono essere associati al tag <BODY>. Essi sono:

·  BACKGROUND="nomefile": con questo attributo si impone che lo sfondo sia realizzato utilizzando l'immagine nomefile; Il browser, indipendentemente dalla dimensione della finestra, provvederà a riempire tutto lo sfondo, eventualmente affiancando piu' ripetizioni dell'immagine indicata.

·  BGCOLOR="#rrggbb": questo attributo specifica il colore dello sfondo (in caso di assenza del BACKGROUND di cui sopra) espresso attraverso il valore attribuito alle componenti rossa, verde, blu (RGB). Tali componenti vanno inseriteutilizzando il formato esadecimale e con valore compreso tra 00 e ff (che corrisponde all'intervallo 0-255 in notazione decimale).

·  TEXT="#rrggbb": indica il colore del testo; le regole di inserimento delle componenti RGB sono analoghe al caso precedente.

·  LINK="#rrggbb": indica il colore dei termini usati come link, quando essi non sono stati ancora selezionati.

·  ALINK="#rrggbb": indica il colore dei link attualmente selezionati.

·  VLINK="#rrggbb": indica il colore dei link relativi a siti già visitati.


  Quella che segue è una tabella di corrispondenza tra i valori numerici esadecimali ed i principali colori:

Nel caso in cui non tutte queste opzioni siano state specificate dal programmatore HTML, il browser provvedera' ad associare ad alcuna di esse (BGCOLOR, TEXT, LINK, ALINK ,VLINK) dei valori predefiniti.

 

LISTE

In HTML é possibile inserire liste ordinate e non ordinate:

LISTE NON ORDINATE

Comando HTML

 

Pagina WWW

 

 

 

 
<UL>
    <LI>Testo 1
    <LI>Testo 2
</UL>

 
  • Testo 1
  • Testo 2

LISTE ORDINATE

Comando HTML

 

Pagina WWW

 

 

 

 
<OL>
    <LI>Testo 1
    <LI>Testo 2
</OL>

 
  1. Testo 1
  2. Testo 2

In entrambe i casi il testo che segue i tag <UL> o <OL> é indentato rispetto al testo che lo precede.

É possibile anche inserire delle liste all'interno di altre liste come nell'esempio che segue:

Comando HTML

 

Pagina WWW

 

 

 

 
Orario del corso
<UL>
    <LI>Martedi
        <UL>
            <LI>16.00-18.00
        </UL>
    <LI>Mercoledi
        <UL>
            <LI>16.00-18.00
        </UL>
    <LI>Giovedi
        <UL>
            <LI>16.00-18.00
        </UL>
    <LI>Venerdi
        <UL>
            <LI>16.00-18.00
        </UL>
</UL>

 

Orario del corso

  • Martedi
    • 16.00-18.00
  • Mercoledi
    • 16.00-18.00
  • Giovedi
    • 16.00-18.00
  • Venerdi
    • 16.00-18.00

Come si può notare, il linguaggio HTML ha una sua gerarchia per la simbologia con cui indica le liste annidate. È comunque possibile variare tale simbologia nel seguente modo:

  • <LI type=disc>
  • <LI type=square>
  • <LI type=circle>

Un altro modo per realizzare una lista senza alcun elenco, nè puntato nè numerato è il seguente:

Comando HTML

 

Pagina WWW

 

 

 

 
<DL>
    <DT>Nome del primo termine
    <DD>Definizione del primo termine
    <DT>Nome del secondo termine
    <DD>Definizione del secondo termine
</DL>

 

Nome del primo termine

Definizione del primo termine

Nome del secondo termine

Definizione del secondo termine

 

LE IMMAGINI

Uno dei punti di forza delle pagine accessibili tramite World Wide Web è la possibilità di inserire delle immagini all'interno di documenti HTML. Tale opzione rende l'informazione più accattivante agli occhi dell'utente, ma oltre a questo fornisce un altro importantissimo mezzo di comunicazione al programmatore HTML. In molti casi, infatti, una semplice immagine è in grado di dare un contributo informativo molto superiore ad una intera pagina scritta.
Bisogna però ricordare che una immagine, per quanto piccola possa essere, porta ad un incremento delle dimensioni del documento, per cui l'utente che vuole consultare un testo arricchito con immagini dovrà attendere un lasso maggiore di tempo per ricevere il documento completo: è buona norma quindi inserire con oculatezza le immagini all'interno dei documenti HTML per non obbligare l'utente ad inutili attese.

  L'HTML prevede un comando apposito per inserire un'immagine: IMG. Questo è un comando aperto, quindi non necessita di alcun tag di chiusura.
  IMG prevede l'inserimento di alcuni parametri:

  • SRC per indicare l'immagine da inserire. È chiaramente di fondamentale importanza e deve essere seguito dal nome del file contenente l'immagine. Il nome deve contenere anche il path assoluto o relativo in grado di identificare in modo univoco il file.
  • BORDER per indicare la dimensione dell'eventuale bordo che si vuole visualizzare intorno all'immagine. Viene visualizzato solo nel caso in cui l'immagine serva come collegamento ipertestuale.
  • ALIGN per indicare l'allineamento dell'immagine rispetto al testo: si potrebbe volere un allineamento a sinistra (LEFT) oppure a destra (RIGHT); oppure desiderare il testo centrato verticalmente rispetto all'immagine (CENTER).Esistono anche le opzioni (TOP) e (BOTTOM) che consentono di porre il testo alllineato con il lato superiore o inferiore dell'immagine.
  • WIDTH permette di specificare una larghezza predefinita per l'immagine, con un valore dato in pixel.
  • HEIGHT permette di specificare una altezza predefinita (vedi sopra).
  • HSPACE permette di inserire dello spazio tra l'immagine ed il testo lateralmente.
  • VSPACE permette di inserire dello spazio tra l'immagine ed il testo sopra e sotto l'immagine.
  • ALT permette di visualizzare un testo al posto dell'immagine se questa per varie ragioni risulta non visualizzabile, ad esempio se viene usato un browser di tipo testuale.
  • ISMAP indica che l'immagine visualizzata è una mappa di coordinate: clickandoci sopra il computer rileva le coordinate del mouse ed è in grado di inviarle al server che può elaborarle per individuare, ad esempio, una nuova pagina da inviare.
  • USEMAP indica ancora una mappa di coordinate, realizzata però usando esclusivamente le proprietà del linguaggio HTML.


Qui c'è un'immagine di prova  Vediamo dunque un esempio di questo comando:
<IMG SRC="images/wav.gif" ALIGN="LEFT">
inserisce un'immagine allineata a sinistra come in questo caso.
  Come potete notare sono stati usati i due parametri SRC=... per specificare l'immagine sorgente e ALIGN=... per indicare l'allineamento desiderato. Il comando inoltre non ha richiesto chiusura.
  Un'importante considerazione riguarda il formato in cui deve essere salvata l'immagine: anche se molti altri formati vengono supportati con le nuove versioni dei browser, quelli universalmente riconosciuti sono il GIF ed il JPEG. Entrambi garantiscono un'alta fedeltà nella riproduzione insieme ad un buon fattore di compressione. Vi consigliamo di utilizzare immagini in uno di questi due formati.

  Come secondo esempio si può visualizzare nuovamente la stessa immagine con gli attributi:
<IMG SRC="images/wav.gif" WIDTH=100 HEIGHT=100>

Qui c'è un'immagine di prova


che portano l'immagine ad assumere dimensioni prefissate (100x100 pixel). L'utilizzo dei parametri WIDTH ed HEIGHT comporta naturalmente una riscalatura dell'immagine originaria, indipendentemente dalla sua effettiva risoluzione.
  Se non volete nessun bordo potete inserire BORDER=0.

  Se non viene specificato altrimenti tramite il desiderato allineamento, l'immagine viene inserita nel testo esattamente nel punto in cui appare il comando IMG, disponendo il testo ai suoi lati.
  Nel caso in cui il file dell'immagine non sia disponibile o ci sia un errore nel listato HTML, il browser può cercare di avvertire che c'è un'immagine non riconosciuta visualizzando il seguente simbolo:


  Naturalmente per visualizzare le immagini è necessario usare un browser grafico. Se questo non è il caso ed il vostro browser è di tipo testuale, allora conviene inserire il parametro ALT: quando il browser testuale incontra l'istruzione per l'immagine la salta cercando direttamente l'ALT e visualizzando il testo ivi contenuto.
  Nel nostro caso, ad esempio, potremmo inserire:
<IMG SRC="images/wav.gif" ALT="File audio">
per permettere, anche a chi non dispone di un editor grafico, di avere informazioni su tutti gli elementi della pagina.

  Le immagini possono naturalmente essere inserite all'interno di comandi <A HREF="..."> per utilizzarle come pulsanti di collegamento od icone. Il browser, se non altrimenti specificato, mette automaticamente un bordo intorno all'immagine per indicare che è un link. Se non lo volete usate il parametro BORDER=0 dentro IMG come:

<A HREF="link.htm">
<IMG SRC="images/wav.gif" BORDER=0>
</A>

LE TABELLE

All'interno di un documento HTML e' possibile inserire dei dati di qualunque tipo (numeri, nomi, percentuali) all'interno di tabelle. Il tag che identifica l'inizio di una tabella e' <table>, accompagnato sempre al tag </table> che indica invece la fine della suddetta tabella.
Il tag table prevede una opsione BORDER che ci consente di definire la grandezza del bordo che deve essere associato alla tabella. Tale grandezza va rappresentata con un numero postivo intero: ponendo <table border =0> si intende una tabella priva di bordo

All'interno della tabella stessa saranno presenti altri tag che mi permetteranno di inserire i dati nei vari campi della tabella stessa.

Questi sono:

·  <TR></TR> che identificano inizio e fine di ogni riga della tabella

·  <TH></TH> che identificano l'intestazione della tabella. Viene associato questo tag ad ogni termine utilizzato per identificare un insieme di dati (riga o colonna) inseriti nella tabella

·  <TD></TD> che identificano ogni dato singolo che e' stato inserito della tabella.

Applicando le semplici regole ora introdotte e' possibile realizzare una tabella come quella sottostante

Studenti

maschi

femmine

Italiani

120

65

Stranieri

17

13

Totale

137

78

Essa è stata realizzata utilizzando le seguenti istruzioni:

<table border=2>
<tr>
<th>Studenti</th><th>maschi</th><th>femmine</th>
<tr>
<th>Italiani<th><td>120</td><td>65</td>
<tr>
<th>Stranieri<th><td>17</td><td>13</td>
<tr>
<th>Totale<th><td>137</td><td>78</td>
</table>

Vediamo quali sono gli attributi dell'elemento TABLE:

ALIGN

Specifica la posizione della tabella relativamente ai margini della finestra; i possibili valori sono LEFT (default), RIGHT e CENTER.

WIDTH

Specifica la grandezza della tabella in pixel o in percentuale (rispetto alla grandezza della finestra).

BORDER

Indica lo spessore del bordo della tabella; per non avere bordo si scriverà BORDER=0.

CELLSPACING

Specifica, in pixel, lo spazio tra le celle.

CELLPADDING

Specifica, in pixel, lo spazio tra il contenuto di una cella ed il suo bordo.

Analizziamo adesso quali sono gli attributi dell'elemento TR:

ALIGN

Posiziona, orizzontalmente, il contenuto all'interno di una cella; i possibili valori sono LEFT, CENTER e RIGHT.

VALIGN

Posiziona, verticalmente, il contenuto all'interno di una cella; i possibili valori sono TOP, MIDDLE e BOTTOM.

Questi due attributi definiscono il modo di visualizzazione del contenuto di ciascuna cella della riga.
Infine, esaminiamo gli attributi degli elementi TH e TD:

NOWRAP

La presenza di quest'attributo impedisce al testo di suddividersi su due righe.

ROWSPAN

Dispone la cella su più righe.

COLSPAN

Dispone la cella su più colonne.

ALIGN

Posiziona, orizzontalmente, il contenuto all'interno di una cella; i possibili valori sono LEFT, CENTER e RIGHT.

VALIGN

Posiziona, verticalmente, il contenuto all'interno di una cella; i possibili valori sono TOP, MIDDLE e BOTTOM.

WIDTH

Specifica, in pixel, le dimensioni della cella in larghezza.

HEIGHT

Specifica, in pixel, le dimensioni della cella in altezza.

Per mostrare l'uso dei principali attributi descritti, possiamo creare le seguenti tabelle:

Nome

Paolino Paperino

Indirizzo

Via del Sicomoro, 254 Paperopoli

utilizzando questa sequenza di comandi <TABLE BORDER =2 WIDTH=70%>
<TR>
<TH width=30%> Nome </TH>
<TD width=70%> Paolino Paperino</TD>
<TR>
<TH WIDTH=30%> Indirizzo </TH>
<TD WIDTH=70%> Via del Sicomoro, 254 Paperopoli</TD>
</TABLE>

oppure la seguente tabella:

Questa è una tabella di prova per il corso di Poggibonsi

1

1

1

1

1

utilizzando questa sequenza di comandi:
<TABLE BORDER=2 CELLSPACING=10 CELLPADDING=10>
<TR ALIGN=LEFT VALIGN=MIDDLE>
<TD COLSPAN=5 NOWRAP>Questa è una tabella di prova per il corso di Poggibonsi
<TR ALIGN=LEFT VALIGN=MIDDLE>
<TD>1
<TD>1
<TD>1
<TD ALIGN=RIGHT>1
<TD>1
</TABLE>

 

FORM in HTML

Ogni documento HTML può contenere una o più form. La form inizia con il comando <FORM> e termina con il comando corrispondente </FORM>. Tutto ciò che è compreso fra queste due istruzioni delimita l'area destinata a raccogliere i dati inviati dall'utente, i quali sono gestiti da una serie di appositi comandi. Essi sono riportati qui di seguito.

·         ACTION Indica la URL (Uniform Resource Locator) del programma CGI al quale il server passerà i dati di ingresso provenienti dalla form compilata dal client. Per esempio,l'assegnazione seguente:

ACTION="http://lisa.dfc.unifi.it/cgi-bin/post-query"

fa in modo che venga eseguito il programma post-query sul server lisa.

  • METHODIndica il metodo con il quale i dati vengono inviati al programma CGI. I metodi possibili sono i seguenti:
    • GET (default)
    • POST
    • HEAD
    • PUT
    • DELETE
    • LINK
    • UNLINK

I più usati comunque sono GET e POST. In particolare il POST è il metodo più adatto ad inviare dati di una certa lunghezza, poiché con il GET, per ragioni pratiche, non si possono inviare al server più di 256 byte di informazione. È importante notare che i metodi usati dalle form impostano la struttura dei dati inviati nell'ambito del medesimo protocollo di comunicazione tra client e server (HTTP) e della medesima interfaccia (CGI) usata per lo scambio di informazioni tra server e applicazione richiesta dal client.

  • INPUT Specifica un campo nel quale l'utente inserisce i propri dati da inviare al server. Gli altri comandi che creano campi di immisssione dati sono SELECT (menu di opzioni) e TEXTAREA (aree estese di testo). Gli attributi di INPUT sono i seguenti:
    • TYPE Specifica il tipo di campo. Si possono avere i seguenti tipi di campo:

* text - crea un'area ipertestuale in cui l'utente può inserire una singola linea di testo. I dati immessi vengono associati ad una variabile specificata con NAME (vedi dopo). text è il tipo di INPUT di default: esso viene automaticamente selezionato quando viene omesso TYPE.

* checkbox - crea una casella ipertestuale, la cui selezione da parte dell'utente dà origine, nei dati trasmessi, ad una assegnazione NAME = VALUE. Sono ammessi più checkbox identici in una stessa form, anche se ciò comporta doppioni di dati trasmessi. checkbox può servire, ad esempio, per creare un documento ipertestuale che domanda all'utente quali linguaggi di programmazione egli conosce:

Linguaggi di programmazione conosciuti:

C

C++

Pascal

Basic

Fortran

L'utente in questo caso può selezionare anche più di una casella.

* radio - crea una serie di caselle ipertestuali con selezionamento esclusivo. Ognuna di queste caselle ha lo stesso NAME delle altre e un VALUE particolare. L'utente può selezionare una sola di queste caselle e quindi inviare una unica assegnazione NAME = VALUE. Ad esempio, con il tipo radio si possono creare documenti ipertestuali dove viene domandato quale mezzo di pagamento l'utente ha intenzione di usare:

Pagamento in:

contanti

assegno

carta di credito

bancomat

* hidden - crea un campo nascosto per l'utente. Il valore imposto ad un campo hidden può costituire l'informazione di "stato" per il server, cioè quella informazione che non deve essere modificata dal client.

* password - crea un campo di testo ove i caratteri immessi vengono visualizzati con asterischi(*). Ciò dà la possibilità di generare documenti ipertestuali interattivi in cui l'utente può digitare una password con la dovuta riservatezza. È utile, per esempio, quando si richiede che solo alcuni utenti abbiano l'accesso a dati riservati.

* reset - cancella tutti i dati impostati nei campi dall'utente e li riporta ai loro valori iniziali o di default. reset crea un pulsante ipertestuale.

* submit - dà l'istruzione di invio dati. submit crea un pulsante ipertestuale, che può anche essere etichettato assegnando una stringa all'attributo VALUE. Se viene dato un NAME, si provvede pure ad inviare una assegnazione NAME = VALUE. Premendo tale pulsante, l'utente invia al server tutti i dati che egli ha impostato nei campi. Volendo, è possibile creare una form costituita dal solo pulsante di invio.

    • VALUE Per un campo di testo, è il valore iniziale o di default che viene mostrato. Se invece il campo è una casella (CHECKBOX, RADIO), VALUE è il valore inviato al server se le casella viene selezionata dall'utente.
    • CHECKED Imposta la selezione iniziale o di default per caselle CHECKBOX o RADIO.
    • NAME Nome simbolico dei dati inviati al server. È previsto per la maggior parte dei tipi di input, per far sì che i dati di ogni campo siano contraddistinti ognuno da un unico identificatore.
    • SIZE Stabilisce in caratteri la lunghezza da visualizzare di un campo. Questo comando, a differenza di MAXLENGTH (vedi sotto), non impone una limitazione superiore al numero di caratteri che l'utente introduce; semplicemente specifica la dimensione della finestra in cui inserire il testo. Tale finestra è scorribile in senso orizzontale, per cui l'utente può immettere quanti caratteri desidera.
    • MAXLENGTH Stabilisce in caratteri la massima lunghezza di un campo.
  • SELECT Crea un menu di opzioni selezionabili dall'utente. Le opzioni sono specificate dal comando OPTION (vedi sotto). Gli attributi di SELECT sono:

o        MULTIPLE Serve per dare all'utente la possibilità di selezionare più alternative insieme.

o        NAME Ha la stessa funzione che nel comando INPUT, descritto sopra.

o        SIZE Specifica il numero di scelte visibili insieme. Se SIZE è maggiore di uno, allora viene creato un menu con barre di scorrimento.

  • OPTION Può essere usato solo in coppia con il comando SELECT (vedi sopra). Esso può asssumere i seguenti valori:

o        SELECTED Imposta la selezione iniziale o di default.

o        VALUE Fornisce il valore da inviare se l'opzione è selezionata (dall'utente oppure di default)

  • TEXTAREA Apre nel documento HTML una finestra dove l'utente può inserire più linee di testo da inviare alserver. Il testo compreso fra i comandi <TEXTAREA> e </TEXTAREA> è il testo inizialmentepresente nella finestra. La finestra generata è scorribile, e l'utente può inserire perciò anche lunghidocumenti, con la facoltà di riguardarli e correggerli prima di inviarli. TEXTAREA ha i seguentiattributi:

o        NAME Ha la stessa funzione che nei comandi di INPUT e SELECT (vedi sopra).

o        ROWS Indica in righe la dimensione verticale della finestra che deve apparire sullo schermo.

o        COLS Indica in colonne la dimensione orizzontale della finestra che deve apparire sullo schermo.

TEXTAREA può essere usato per creare un sistema ipertestuale di posta elettronica.

Una form (cioè lo spazio compreso tra l'istruzione <FORM> e </FORM>) può contenere, oltre aicomandi specifici appena visti per la gestione dei dati, tutti gli altri comandi HTML, eccetto lo stesso comando FORM. In altre parole, ciò significa che non si può annidare una form dentro un'altra form.
 

FRAME

Quest’elemento del linguaggio HTML la divisione e la gestione di parti della finestra del browser. La sintassi necessaria è la seguente:

<FRAMESET>

<FRAME>

<FRAME>

</FRAMESET>

Tal elemento è inserito in un ipertesto al posto del tag BODY; se il browser usato dall’utente non supporta questo tag (la compatibilità dei frame è limitata al Netscape 2.0 e successivi), è inserito nel documento il tag:

<NOFRAMES>……</NOFRAMES>

al cui interno è posto il testo che deve essere visualizzato.
Vediamo adesso quali sono gli attributi dell’elemento FRAMESET:

ROWS

Definisce la suddivisione in righe della finestra in pixel o in percentuale

COLS

Definisce la suddivisione in colonne della finestra in pixel o in percentuale

BORDERCOLOR

Definisce il colore in RGB del bordo delle finestre

Ora analizziamo gli attributi dell’elemento FRAME:

BORDERCOLOR

Definisce il colore in RGB del bordo delle finestre

BORDER

Indica la presenza o meno del bordo delle finestre (default YES)

MARGIN

Permette la gestione dei margini

MARGINWIDTH

Indica il valore dei margini destro e sinistro

MARGINHEIGHT

Indica il valore dei margini alto e basso

SRC

Indica l’indirizzo HTTP del documento che deve essere visualizzato in quel frame

NAME

Indica il nome della finestra

SCROLLING

Indica la possibilità di far scorrere il testo (i valori sono YES, NO, AUTO)

NORESIZE

Non dà all’utente la possibilità di modificare le misure delle finestre

La presenza dell’attributo NAME è di fondamentale importanza: infatti, è così possibile specificare in quale finestra del browser vogliamo che il file in questione appaia. Ad esempio:

<A HREF="topolinia.html" TARGET="finestra1">Pippo</A>

cliccando sul nome di Pippo il file topolinia.html viene visualizzato nella finestra di nome finestra1. Vi sono poi alcuni valori speciali dell’attributo TARGET:

  • _blank: visualizza il link in una nuova finestra vuota;
  • _self: visualizza il link nella stessa finestra;
  • _parent: visualizza il link nella finestra parente;
  • _top: visualizza il link nella stessa finestra ma a tutto schermo.

Esempio di frame.

 

JAVA

L’introduzione sul mercato di Java rappresenta la più grande novità nel mondo di Internet dall’avvento di Mosaic. Java è un linguaggio di programmazione per applicazioni distribuite: per la prima volta, esso permette agli utenti, oltre alla possibilità di includere in una pagina web animazione e suono, di interagire con la pagina stessa. Invece di limitarsi a leggere il contenuto di un documento o tutt’al più di riempire un modulo, i navigatori Internet possono adesso giocare, calcolare espressioni, parlare in tempo reale con altri utenti, aggiornare continuamente i dati della propria pagina, e così via.

La principale innovazione portata da Java consiste nel fatto che è un linguaggio dal duplice aspetto, compilato ed interpretato. Infatti, un programma Java viene compilato nel formato bytecode, formato binario indipendente dalla piattaforma, e successivamente interpretato tramite un ambiente Java specifico per la piattaforma sulla quale viene eseguito il programma. Lo stesso codice sorgente può consentire, quindi, di far operare il bytecode compilato in vari ambienti Java specifici per diverse piattaforme. Questa caratteristica di Java determina la sua neutralità rispetto all’architettura della piattaforma sulla quale si vuole far girare il programma. Questo modus operandi, inoltre, permette di ridurre notevolmente i tempi di trasmissione di qualsiasi applicazione realizzata con questo linguaggio; contemporaneamente all’applicazione viene, infatti, trasmesso il programma interprete sempre attraverso un programma Java e non con la trasmissione del codice binario, che quindi gira localmente sulla macchina client.

Alcuni esempi delle novità che un programmatore web può realizzare con il linguaggio Java sono:

    

  1. introdurre una colonna sonora per il suo documento, che parte nel momento in cui questo viene richiesto da un utente;


    

  1. realizzare delle animazioni tipo cartoni animati;
        
  2. inserire un video;
        
  3. realizzare giochi interattivi per più giocatori.

Un’ulteriore caratteristica innovativa è la possibilità data agli utenti di introdurre in una pagina web elementi non ancora supportati dal browser usato. Fino ad ora si doveva aspettare che i programmatori dei browser aggiornassero il loro prodotto ed inoltre che tutti gli utenti aggiornassero la versione del loro browser prima di poter utilizzare un nuovo elemento. Con questo nuovo ambiente di programmazione l’utente spedisce al browser, allo stesso tempo, sia l’elemento innovativo sia il programma che permette di visualizzarlo.

L’ambiente di programmazione Java è nato come parte di un progetto di ricerca per lo sviluppo di un software avanzato per una larga varietà di dispositivi di rete. L’obiettivo era sviluppare un ambiente portabile, distribuito ed operante in tempo reale. Quando partì il progetto, il linguaggio scelto fu il C++; ma con il passare del tempo le difficoltà incontrate con questo linguaggio, portarono alla decisione di sviluppare un ambiente di programmazione completamente nuovo. Anche se il linguaggio C++ venne accantonato, si è cercato di mantenere Java il più possibile simile a questo linguaggio in modo da dargli la caratteristica di familiarità, rimuovendo le complessità non necessarie del C++. In questo modo un programmatore di C++ può passare facilmente al nuovo linguaggio.

La caratteristica primaria di Java è la semplicità: divenire un programmatore Java non richiede un lungo periodo di apprendistato. Java è disegnato per essere un linguaggio orientato agli oggetti. Il bisogno di sistemi distribuiti, basati sull’architettura client-server coincide con la nascita di software orientati agli oggetti; i programmatori che usano Java possono accedere a librerie esistenti di oggetti che forniscono strumenti funzionali per le interfacce di rete, per le interfacce grafiche per l’utente, e così via. Tali librerie possono essere incrementate dal programmatore stesso.

L’applicazione più importante scritta, fino ad ora, usando il linguaggio di programmazione Java è il nuovo World Wide Web browser HotJava; il client HotJava può ricevere segmenti di codice Java da qualunque parte del mondo, che vengono poi direttamente eseguiti sulla macchina locale. Comunque anche altri browser, come Microsoft’s Internet Explorer 2.0 e Netscape Navigator 2.0 permettono di utilizzare le caratteristiche di Java, seppure in maniera differente.

HotJava differisce dagli altri browser per il fatto che solitamente le nozioni dei diversi tipi di dati , protocolli e comportamenti necessari per navigare il Web, sono inseriti nel browser, pezzo monolitico con tutte le applicazioni strettamente collegate.

HotJava, invece, non è legato strettamente ai protocolli, quindi è un sistema espandibile all’infinito al quale si possono aggiungere facilmente nuove potenzialità.

Si considerino i formati di descrizione delle immagini, ad esempio: la maggior parte dei browser disponibili è in grado di visualizzare un piccolo set di immagini (GIF, JPEG, X11 bitmap). HotJava, invece, può dinamicamente prelevare dal computer remoto il codice Java che implementa l’algoritmo d’interpretazione dell’immagine permettendo così la visualizzazione del nuovo formato.

Un discorso simile si applica anche ai protocolli di comunicazione utilizzati da HotJava: il browser monolitico ha insita la cognizione dell’HTTP; HotJava usa invece il nome del protocollo per agganciarsi al gestore appropriato, in modo da poter incorporare nuovi protocolli futuri. HotJava ed il rapido incremento nella popolazione Web dei programmi Java, chiamati applet (mini applicazioni), sono la dimostrazione più efficace delle potenzialità di Java.

 

VRML

Il mondo della "realtà virtuale" si sta aprendo per gli utenti Internet, anche se, per ora, non è lecito aspettarsi scene da "Jurassic Park", che richiederebbero risorse hardware disponibili per il momento solo su workstation di fascia alta. Per realtà virtuale si deve intendere una tecnica espositiva creata allo scopo di mettere a disposizione dell’utente tutti i dati e le informazioni immagazzinate in un computer e realizzata attraverso la totale immersione dell’utente stesso in un ambiente sintetico. Attualmente i dispositivi usati per realizzare questa immersione sono un display montato su di una specie di elmetto da indossare, più uno o due guanti; l’intero equipaggiamento è collegato ad un elaboratore fornito di schede speciali per la grafica ed il suono ed utilizzato per produrre l’ambiente tridimensionale con annesso segnale audio.

Con le attuali velocità di trasferimento dati consentite da Internet, la realtà virtuale o, come si potrebbe dire più correttamente, la raffigurazione di mondi tridimensionali all’interno dei quali ci si può spostare liberamente attraverso l’uso del mouse, è possibile solo se viene trasferita sulla rete la descrizione del mondo a tre dimensioni. Tutte le operazioni di "rendering", cioè di traduzione dal linguaggio alla rappresentazione sul video, sono demandate al processore della macchina locale.

VRML (Virtual Reality Modeling Language) è un linguaggio per la descrizione di simulazioni interattive; viene creato un mondo virtuale messo a disposizione di milioni di utenti attraverso Internet. I collegamenti sono realizzati tramite World Wide Web.

Le intenzioni degli autori di VRML è far diventare questo linguaggio lo standard per le simulazioni interattive all’interno di WWW.

VRML è stato concepito nella primavera del 1994 alla prima Conferenza di World Wide Web a Ginevra; in quell’occasione si è cercato di specificare un linguaggio comune per la descrizione di scene tridimensionali e dei collegamenti con WWW, ovvero l’analogo dell’HTML per la realtà virtuale.

Poco dopo la sessione di Ginevra, venne formata una www-vrml mailing list per discutere con la comunità elettronica lo sviluppo del linguaggio VRML: tale versione non doveva essere troppo ambiziosa, ma doveva essenzialmente fornire una base di partenza per gli sviluppi successivi.

I progettisti di VRML decisero che questo linguaggio sarebbe risultato indipendente dall’HTML: l’HTML era concepito per testi e non per grafici, così VRML richiedeva una migliore ottimizzazione nei confronti del comportamento della rete rispetto ad HTML.

VRML permette la creazione di un mondo virtuale con un comportamento interattivo solo parziale: tale spazio può contenere oggetti che hanno collegamenti con altri oggetti, come altri mondi virtuali oppure altri documenti HTML.

Le caratteristiche fondamentali di VRML 1.0 sono:

    1. Indipendenza dalla piattaforma.
    2. Estensibilità.
    3. Capacità di lavorare con connessioni a larghezza di banda ridotta.

Come per l’HTML, queste sono specifiche assolute per un linguaggio standard di rete.

Per le operazioni di rendering, un browser in grado di leggere i documenti VRML è WebSpace. Tale browser, fornito dalla Silicon Graphics, permette di passare da un ambiente all’altro, ricevendo file di istruzioni e ricostruendo la scena in locale per visualizzare ambienti sia immaginari che realistici.

Il visualizzatore WebSpace lavora con i più popolari browser Web (Mosaic, Netscape). Attraverso questo software è possibile passare attraverso mondi a tre dimensioni, esplorare città, biblioteche, musei, luoghi turistici e mondi immaginari. Webspace può avere anche un uso commerciale in quanto permette di visualizzare tridimensionalmente prodotti commerciali contenuti nei cataloghi di rete e di generare informazioni 3D dei dati dei mercati azionari.

Un altro browser disponibile in forma gratuita per usi non commerciali è VRWeb, che è basato sul visore di ambienti 3D Harmony per Hyper-G ed è concepito per essere compatibile con browser come Mosaic e Netscape.

VRWeb permette di esplorare interattivamente modelli 3D di oggetti, mondi virtuali e seguire collegamenti incorporati negli oggetti.

Attraverso il VRML il browser deve ricostruire l’immagine visualizzando ogni singola parte dell’immagine che gli è stata descritta nel documento. In questo documento vengono introdotte delle istruzioni con le quali si indicano le immagini, ma anche i punti di prospettiva e addirittura le angolazioni che deve avere la luce nel colpire gli oggetti e creare un’ombra. Pertanto, questo linguaggio approntato per la visualizzazione di immagini in tre dimensioni è un linguaggio complesso che richiede specificazioni minuziose. Inoltre il lavoro è anche molto consistente dato che l’ampiezza dei documenti prodotti è sempre di diversi Mbyte in formato testo.

 

REGOLE BASE PER LA CREAZIONE DI UN DOCUMENTO HTML

Dopo aver visto la sintassi dei principali tag, riportiamo qui alcune regole fondamentali che ognuno dovrebbe seguire nello sviluppo di pagine HTML

·  Un documento HTML non deve essere eccessivamente lungo: è preferibile suddividere documenti eccessivamente pesante in documenti più piccoli, che sono traferibili in tempi più brevi e sono consultabili più facilmente;

·  È bene non includere troppe immagini all'interno di un singolo documento: il trasferimento di immagini comporta un'attesa spesso lunga che può esser fastidiosa, specialmente se l'immagione non è particolarmente significativa;

·  È sempre buona norma firmare un documento: ogni documento HTML dovrebbe includere come riferimento un e-mail o un generico recapito nel caso l'utente necessiti ulteriori chiarimenti;

·  Tenere sempre aggiornati i dati: spesso è meglio non fornire alcuna informazione che lasciare dati obsoleti a disposizione degli utenti;

·  Controllare le pagine prima di metterle a disposizione degli utenti: è sempre opportuno verificare la veridicità delle informazioni e la correttezza dei link inclusi nel testo;

·  Inserire sempre un titolo significativo: spesso il titolo è usato come indice del contenuto della pagina. È opportuno quindi che il titolo rispecchi quanto più fedelmente è possibile l'argomento trattato.

Queste soso solo alcune delle regole che è opportuno seguire.