Introduzione all'HTML | Aggiungere un tocco di stile

  Caratteristiche più avanzate

Dave Raggett, 29 Agosto 2000.

Ora che vi siete impadroniti dei fondamenti, è tempo di proseguire con l'apprendimento di caratteristiche più avanzate. Ciò che segue vi insegnerà come:

• forzare interruzioni di linea
• introdurre spazi all'interno di una riga
• usare entità in luogo di caratteri speciali
• fare un collegamento alla metà di una pagina
• usare testo preformattato
• far scorrere testo intorno alle immagini
• definire regioni cliccabili all'interno di immagini
• creare tabelle
• usare scambi di immagine [roll-overs] ed altri trucchi

p.s. Vi raccomando di utilizzare HTML Tidy per tenere il vostro codice di marcatura pulito e libero da errori.

Come forzare interruzioni di linea

Occasionalmente vi capiterà di voler forzare un'interruzione di linea. Potete farlo utilizzando l'elemento br, per esempio quando volete inserire un indirizzo postale:

<p>Famiglia Rossi<br>
Piazza della Republica 27<br>
Desenzano del Garda<br>
25015 - BS</p>

L'elemento br non ha mai bisogno del marcatore di chiusura. In generale, gli elementi che non vogliono il marcatore di chiusura sono detti elementi vuoti.

Come introdurre spazi all'interno di una riga

I browser spezzano automaticamente le righe in modo da adattare il testo alla larghezza dei margini. Le interruzioni di riga possono essere inserite dovunque appaiano nel codice degli spazi. In certi casi vorrete evitare che i browser inseriscano un'interruzione di riga tra due particolari parole. Per esempio tra due parole che costituiscono il nome di un marchio commerciale come "Coca Cola". Il trucco sta nell'usare   al posto del carattere spazio, ad esempio:

Le bevande gassate dolci come la Coca Cola
hanno raggiunto una popolarità universale.

E' una cattiva abitudine quella di utilizzare spazi di congiunzione ripetuti per ottenere un rientro del testo. Al contrario, vi raccomando di impostare l'indentazione per mezzo dei comandi di stile.

Come utilizzare entità in luogo di caratteri speciali

Per dare notizia del copyright o dei marchi di fabbrica è consuetudine inserire gli appropriati simboli:

Notate che l'HTML 4.0 definisce ™ come simbolo per il marchio di fabbrica, ma questa entità non è ancora così largamente supportata come ™.

Vi sono molte altre entità che potete trovare utili:

E poi vi sono entità per le lettere accentate e per simboli di varia natura all'interno dell'insieme di caratteri Latin-1:

Potete utilizzare anche entità carattere numeriche per le lettere greche ed i simboli matematici definiti nell'Unicode. Per maggiori dettagli, date un'occhiata alla lista inserita nelle specifiche dell'HTML 4. Notate che i nomi di entità per questi caratteri non sono riconosciuti da Navigator 4, per cui vi conviene utilizzare al loro posto le entità numeriche.

Creare collegamenti che puntano all'interno di pagine Web

Immaginate di aver scritto una lunga pagina Web dotata di un sommario all'inizio. In che modo potete rendere le voci nel sommario dei collegamenti ipertestuali che rimandano alle corrispondenti sezioni?

Poniamo che ciascuna sezione cominci con un'intestazione, ad esempio:

<h2>Le notizie del mattino</h2>

Potete trasformare l'intestazione in un potenziale bersaglio per un collegamento ipertestuale racchiudendo il suo contenuto tra <a name=identificatore> .... </a>

<h2><a name="notizie-mattino">Le notizie del mattino</a></h2>

L'attributo name specifica il nome che userete per identificare la destinazione del collegamento, in questo caso "notizie-mattino". Il sommario potrà ora includere un collegamento ipertestuale che usa questo nome, per esempio:

<ul>
  ...
  <li><a href="#notizie-mattino">Le notizie del mattino</a></li>
  ...
</ul>

Il carattere # va inserito prima del nome della destinazione [target]. Se questa si trova in un differente documento, allora è necessario specificare l'indirizzo Internet di quel documento prima del carattere #. Ad esempio se il documento è in "http://www.notiziari.it/", allora il collegamento assume la forma:

<a href="http://www.notiziari.it/#notizie-mattino">Le notizie del mattino</a>

In futuro potrete probabilmente definire la destinazione del collegamento senza la necessità di ricorrere all'elemento <a>. Il nuovo metodo è molto più semplice, dal momento che tutto ciò che occorre fare è aggiungere un attributo id all'intestazione, per esempio:

<h2 id="notizie-mattino">Le notizie del mattino</h2>

Questo metodo non funziona con i browser di quarta generazione o precedenti, sicché dovrebbe essere utilizzato con cautela, almeno finché questi browser sono ancora in uso!

Testo preformattato

Uno dei vantaggi del Web è che il testo slitta automaticamente su più righe per adattare i margini alla grandezza della finestra corrente. A volte però potreste voler disabilitare questo comportamento. Per esempio quando state inserendo esempi di codice di programmazione. Potete fare ciò utilizzando l'elemento pre. Ad esempio:

<pre>
    void Node::Remove()
    {
        if (prev)
            prev->next = next;
        else if (parent)
            parent->SetContent(null);

        if (next)
            next->prev = prev;

        parent = null;
    }
</pre>

Il che viene visualizzato così:

    void Node::Remove()
    {
        if (prev)
            prev->next = next;
        else if (parent)
            parent->SetContent(null);

        if (next)
            next->prev = prev;

        parent = null;
    }

I colori del testo e dello sfondo sono impostati per mezzo dei fogli di stile. Notate che tutte le interruzioni di linea e gli spazi sono visualizzati esattamente come appaiono nell'HTML. L'eccezione è un a-capo immediatamente dopo il marcatore iniziale <pre> e immediatamente prima del marcatore finale </pre>. Questo a-capo non viene considerato. Questo significa che i seguenti due esempi sono visualizzati in modo assolutamente identico:

<pre>testo preformattato</pre>

<pre>
testo preformattato
</pre>

Il testo preformattato è generalmente reso per mezzo di un insieme di caratteri a spaziatura fissa, dove ogni carattere ha la stessa larghezza. Se definite dei comandi di stile per l'elemento pre, alcuni browser trascurano di usare caratteri a spaziatura fissa, rendendo necessario l'uso della proprietà font-family. Se ad esempio volete che tutti gli elementi pre siano visualizzati in verde, dovete definire il comando di stile:

<style type="text/css">
  pre { color: green; background: white; font-family: monospace; }
</style>

Quando impostate il colore di primo piano del testo, è consigliabile impostare anche il colore di sfondo. Ciò eviterà di incorrere in incidenti in cui il colore di sfondo si distingue difficilmente dal primo piano. Piuttosto che impostare il colore di sfondo per l'elemento pre, potreste trovare più conveniente impostarlo nell'elemento body. Ad esempio:

<style type="text/css">
  body { color: black; background: white; }
  pre { color: green; font-family: monospace; }
</style>

Far scorrere il testo intorno alle immagini

L'HTML vi consente di scegliere se una data immagine deve essere trattata come parte della corrente riga di testo o lasciata fluttuare lungo i margini sinistro o destro. Potete controllare ciò per mezzo dell'attributo align. Se il valore dell'attributo align è left, l'immagine fluttua lungo il margine sinistro. Se il valore è right, l'immagine fluttua lungo il margine destro. Ecco un esempio:

<p><img src="immagini/sole.jpg" alt="immagine di un sole radiante"
width="32" height="21" align="left"> Questo testo scorrerà intorno al lato
destro dell'immagine.</p>

che viene reso come:

Questo testo scorrerà intorno al lato destro dell'immagine.

L'esempio seguente usa align="right"

<p><img src="immagini/sole.jpg" alt="immagine di un sole radiante"
width="32" height="21" align="right"> Questo testo scorrerà intorno al lato
sinistro dell'immagine.</p>

che viene reso come:

Questo testo scorrerà intorno al lato sinistro dell'immagine.

Per forzare la resa della pagina a continuare sotto l'immagine fluttuante potete usare l'elemento <br clear=all>. Per esempio:

<p><img src="immagini/sole.jpg" alt="immagine di un sole radiante"
width="32" height="21" align="left"> Questo testo scorrerà intorno
al margine destro dell'immagine.<br clear="all">
Questo testo comincia una riga sotto l'immagine fluttuante.</p>

che viene reso come:

Questo testo scorrerà intorno al margine destro dell'immagine.
Questo testo comincia una riga sotto l'immagine fluttuante.

Regioni cliccabili all'interno di immagini

L'immagine seguente funge da mappa per un gruppo di pagine Web. Potete cliccare sui cerchi per andare alla pagina corrispondente.

Il codice di marcatura per questa mappa è il seguente:

<p align="center">
   <img src="pages.gif" width="384" height="245"
      alt="Mappa del sito" usemap="#sitemap" border="0">
   <map name="sitemap">
      <area shape="circle" coords="186,44,45" 
         href="Overview.html" alt="Getting Started">
      <area shape="circle" coords="42,171,45" 
         href="Style.html" alt="A Touch of Style">
      <area shape="circle" coords="186,171,45"
         alt="Web Page Design">
      <area shape="circle" coords="318,173,45"
         href="Advanced.html" alt="Advanced HTML">
   </map>
</p>

L'attributo src dell'elemento img richiama il file immagine "pages.gif". L'attributo usemap referenzia un elemento mappa. Esso usa per fare ciò un indirizzo Internet, perciò il carattere #. L'attributo border è impostato a "0" per sopprimere il bordo blu intorno all'immagine.

L'elemento map specifica quali regioni nell'immagine agiscono come collegamenti ipertestuali. L'attributo name corrisponde all'attributo usemap nell'elemento img e agisce all'incirca come l'attributo name dell'elemento <a>. In pratica, l'elemento mappa occorre che sia nello stesso file dell'elemento img.

L'elemento area ha la funzione di definire una regione dell'immagine e di collegarla a un indirizzo Internet. L'attributo shape può assumere i valori "rect", "circle" o "poly". L'attributo "coords" specifica le coordinate per una regione a seconda della forma.

• rect: sinistra-x, alto-y, destra-x, basso-y
• circle: centro-x, centro-y, raggio
• poly: x₁,y₁, x₂,y₂, ... x_n,y_n

Il pixel superiore sinistro è considerato come l'origine dell'immagine con x e y entrambi uguali a zero, x che aumenta percorrendo l'immagine verso destra e y che aumenta verso il basso. La maggior parte degli strumenti di manipolazione grafica vi consentono di trovare le coordinate dei pixel di ciascun dato punto dell'immagine.

Se due o più regioni definite si sovrappongono, gli elementi di definizione della regione che appaiono prima nel documento acquistano la precedenza (vale a dire, rispondono all'input dell'utente). Nel caso di una forma complessa come una struttura ad anello, potete rendere parte di una regione inattiva sovrapponendole un'altra regione che usi l'attributo nohref, ad esempio:

      <area shape="circle" coords="186,44,50" nohref>
      <area shape="circle" coords="186,44,100" 
         href="Overview.html" alt="Getting Started">

In questo caso il primo cerchio crea una regione inattiva all'interno del cerchio più grande creato dal secondo elemento area. Per avere effetto, la forma inattiva deve essere definita per prima, altrimenti risulterà nascosta dalla forma attiva.

Perché è necessario specificare l'attributo alt

L'attributo alt dell'elemento area è usato per fornire una descrizione testuale del collegamento. Senza di ciò, la mappa immagine risulta inaccessibile per coloro che non possono vedere l'immagine.

Le tabelle

Le tabelle sono utilizzate sia per fornire informazioni sia a fini di presentazione. Potete allargare le tabelle fino a farle coincidere con i margini della pagina, specificare una larghezza fissa o lasciare che sia il browser a dimensionare automaticamente la tabella per adattarla ai contenuti.

Le tabelle consistono di una o più righe di celle di tabella. Ecco qui un semplice esempio:

Il codice di marcatura di ciò è il seguente:

<table border="1">
<tr><th>Anno</th><th>Vendite</th></tr>
<tr><td>2000</td><td>$18M</td></tr>
<tr><td>2001</td><td>$25M</td></tr>
<tr><td>2002</td><td>$36M</td></tr>
</table>

L'elemento table funge da contenitore della tabella. L'attributo border specifica la larghezza in pixel del bordo. L'elemento tr funge da contenitore per ciascuna riga della tabella. Gli elementi th e td fungono da contenitori rispettivamente per le intestazioni e i dati presenti nelle celle.

Spaziatura interna delle celle

Potete incrementare per tutte le celle della tabella la spaziatura interna [distanza tra il margine esterno della cella e l'inizio del contenuto] usando l'attributo cellpadding dell'elemento table. Per esempio, per impostare la spaziatura interna a 10 pixel:

<table border="1" cellpadding="10">

ed eccone l'effetto:

Spaziatura tra le celle

Per contro, l'attributo cellspacing determina lo spazio tra le celle. Ecco come impostare la spaziatura tra le celle a 10:

<table border="1" cellpadding="10" cellspacing="10">

ed ecco l'effetto:

Larghezza della tabella

Potete impostare la larghezza della tabella usando l'attributo width. Il valore è o la larghezza in pixel o un valore percentuale che esprime lo spazio disponibile per la tabella tra i margini sinistro e destro. Per esempio, per impostare la larghezza all'80% dello spazio tra i margini:

<table border="1" cellpadding="10" width="80%">

che ha come effetto:

Allineamento del testo all'interno delle celle

Per impostazione predefinita i browser centrano le intestazioni delle celle (th) ed allineano a sinistra i dati (td). Potete modificare l'allineamento usando l'attributo align, che può essere aggiunto ad ogni cella o alla riga (elemento tr). E' usato con i valori "left", "center" o "right":

<table border="1" cellpadding="10" width="80%">
<tr align="center"><th>Anno</th><th>Vendite</th></tr>
<tr align="center"><td>2000</td><td>$18M</td></tr>
<tr align="center"><td>2001</td><td>$25M</td></tr>
<tr align="center"><td>2002</td><td>$36M</td></tr>
</table>

con il seguente risultato:

L'attributo valign gioca un ruolo simile per quanto riguarda l'allineamento verticale del contenuto delle celle. E' usato con i valori "top", "middle" o "bottom" e può essere aggiunto a ciascuna cella o riga. Per impostazione predefinita le intestazioni vengono posizionate nel mezzo delle celle che le contengono (th), mentre i dati vengono allineati al margine superiore delle celle.

Celle vuote

Un'eccentricità è il modo in cui i browser trattano le celle vuote. Paragonate:

con

Il primo esempio mostra cosa accade quando una cella è vuota:

<td></td>

Per evitare ciò, includete uno spazio di congiunzione:

<td>&nbsp;</td>

Celle che si estendono su più di una riga o di una colonna

Estendiamo l'esempio precedente, separando le vendite delle regioni del nord da quelle delle regioni del sud:

L'intestazione "Anno" si estende ora su due righe, mentre l'intestazione "Vendite" si estende su tre colonne. Ciò è ottenuto impostando rispettivamente gli attributi rowspan e colspan. La marcatura adoperata è:

<table border="1" cellpadding="10" width="80%">
<tr align="center"><th rowspan="2">Anno</th><th colspan="3">Vendite</th></tr>
<tr align="center"><th>Nord</th><th>Sud</th><th>Totale</th></tr>
<tr align="center"><td>2000</td><td>$10M</td><td>$8M</td><td>$18M</td></tr>
<tr align="center"><td>2001</td><td>$14M</td><td>$11M</td><td>$25M</td></tr>
</table>

Potete semplificare il codice avvantaggiandovi del fatto che i browser non hanno bisogno dei marcatori finali per le celle e le righe di tabella:

<table border="1" cellpadding="10" width="80%">
<tr align="center"><th rowspan="2">Anno<th colspan="3">Vendite
<tr align="center"><th>Nord<th>Sud<th>Totale
<tr align="center"><td>2000<td>$10M<td>$8M<td>$18M
<tr align="center"><td>2001<td>$14M<td>$11M<td>$25M
</table>

Notate che a causa del fatto che l'intestazione "Anno" si estende su due righe, il primo elemento th della seconda riga appare nella seconda colonna piuttosto che nella prima.

Tabelle prive di bordo

Queste sono utilizzate di solito per la visualizzazione di pagine con un aspetto "a griglia". Tutto ciò che occorre fare è aggiungere border="0" e cellspacing="0" all'elemento table:

Ciò viene generato per mezzo del seguente codice di marcatura:

<table border="0" cellspacing="0" cellpadding="10">
<tr><th>Anno</th><th>Vendite</th></tr>
<tr><td>2000</td><td>$18M</td></tr>
<tr><td>2001</td><td>$25M</td></tr>
<tr><td>2002</td><td>$36M</td></tr>
</table>

Se omettete l'attributo cellspacing, otterrete un leggero vuoto tra le celle, come mostrato sotto:

Colorare le vostre tabelle

Questa pagina adopera un foglio di stile per impostare i colori di sfondo delle tabelle, con un colore differente per le celle d'intestazione e di dati. I comandi di stile che ho usato sono i seguenti:

table {
  margin-left: -4%
  font-family: sans-serif;
  background: white;
  border-width: 2;
  border-color: white;
}
th { font-family: sans-serif; background: rgb(204, 204, 153) }
td { font-family: sans-serif; background: rgb(255, 255, 153) }

Le ultime due righe qui sopra impostano i colori di sfondo per le celle th e td a determinati valori di rosso/verde/blu. Il campo di variazione dei numeri è da 0 a 255 (massima saturazione).

Un altro modo di impostare il colore di sfondo è usare l'attributo bgcolor. Questo funziona praticamente con tutti i browser e non richiede il supporto per i fogli di stile. Il primo passo è determinare le componenti di rosso, verde e blu del colore che desiderate usare. Nella pagina sugli stili è incluso un convertitore.

<table border="0" cellspacing="0" cellpadding="10">
  <tr>
    <th bgcolor="#CCCC99">Anno</th>
    <th bgcolor="#CCCC99">Vendite</th>
  </tr>
  <tr>
    <td bgcolor="#FFFF66">2000</td>
    <td bgcolor="#FFFF66">$18M</td>
  </tr>
  <tr>
    <td bgcolor="#FFFF66">2001</td>
    <td bgcolor="#FFFF66">$25M</td>
  </tr>
  <tr>
    <td bgcolor="#FFFF66">2002</td>
    <td bgcolor="#FFFF66">$36M</td>
  </tr>
</table>

Rendere le vostre tabelle accessibili

Se non siete in grado di vedere la tabella, può essere davvero difficile comprenderne il significato. Il primo passo consiste nell'aggiungere informazioni che descrivono lo scopo e la struttura della tabella. L'elemento caption vi consente di fornire una didascalia, e di posizionarla sopra o sotto la tabella. L'elemento caption dovrebbe apparire prima dell'elemento tr della prima riga.

che è stata prodotta dal seguente codice di marcatura:

<table border="1" cellpadding="10" width="80%">
<caption>Ricavi attesi da vendite per anno</caption>
<tr align="center">
  <th>Anno</th><th>Vendite</th>
</tr>
<tr align="center"><td>2000</td><td>$18M</td></tr>
<tr align="center"><td>2001</td><td>$25M</td></tr>
</table>

Ecco la medesima tabella con align="bottom" aggiunto all'elemento caption:

L'attributo summary dell'elemento table dovrebbe essere utilizzato per descrivere la struttura della tabella a persone che non sono in grado di vederla. Ad esempio: "la prima colonna fornisce l'anno e la seconda i ricavi per quell'anno".

<table summary="la prima colonna fornisce
  l'anno e la seconda i ricavi per quell'anno">

Specificare la relazione tra celle d'intestazione e di dati

Quando una tabella è resa in audio o in Braille, è utile poter identificare quali intestazioni descrivono quali celle. Ad esempio, un browser acustico potrebbe consentirvi di scorrere le celle dall'alto in basso e da sinistra a destra, con le appropriate intestazioni pronunciate prima di ogni cella.

Per supportare tale caratteristica occorre annotare le celle d'intestazione e/o di dati. L'approccio più semplice è aggiungere l'attributo scope alle celle d'intestazione. Può essere utilizzato con i seguenti valori:

• row: la cella corrente fornisce informazioni d'intestazione per il resto della riga che la contiene.
• col: la cella corrente fornisce informazioni d'intestazione per il resto della colonna che la contiene.

Applicando quanto detto alla tabella d'esempio si ottiene:

<table border="1" cellpadding="10" width="80%">
<caption>Ricavi attesi da vendite per anno</caption>
<tr align="center">
  <th scope="col">Anno</th>
  <th scope="col">Vendite</th>
</tr>
<tr align="center"><td>2000</td><td>$18M</td></tr>
<tr align="center"><td>2001</td><td>$25M</td></tr>
</table>

In caso di tabelle più complesse, potete utilizzare l'attributo headers in singole celle di tabella per fornire un elenco separato da spazi di identificatori per celle d'intestazione. Ognuna di tali celle d'intestazione deve avere un attributo id con un identificatore corrispondente.

Un punto finale che dovreste considerare è usare l'attributo abbr per specificare un'abbreviazione per intestazioni lunghe. Ciò rende tollerabile ascoltare elenchi di intestazioni per ciascuna cella, ad esempio:

<th abbr="W3C">World Wide Web Consortium</th>

Scambi-immagine ed altri trucchi

Un piccolo JavaScript può fare molto per ravvivare le vostre pagine. Vi sarà mostrato più sotto come creare "rollover" in cui la visualizzazione di un collegamento cambia se vi si passa sopra con il mouse. Imparerete anche come creare banner pubblicitari rotanti che aiutino a indirizzare i visitatori verso i siti dei vostri sponsor.

Scambi-immagine

Nella sua forma più comune, uno scambio-immagine consiste di un'immagine che funge da collegamento ipertestuale. Mentre il puntatore del mouse è sopra l'immagine, questa cambia aspetto per attrarre l'attenzione sul collegamento. Per esempio potente aggiungere un effetto bagliore, un effetto ombra o semplicemente cambiare il colore di sfondo. Ecco un esempio:

<script type="text/javascript">
if (document.images)
{
    image1 = new Image;
    image2 = new Image;
    image1.src = "enter1.gif";
    image2.src = "enter2.gif";
}

function chgImg(name, image)
{
    if (document.images)
    {
        document[name].src = eval(image+".src");
    }
}
</script>

...

<a href="/" onMouseOver='chgImg("enter", "image2")'
onMouseOut='chgImg("enter", "image1")'><img name="enter"
src="immagini/enter1.gif" border="0" alt="Enter if you dare!"></a>

ed ecco qui come esso appare ...

Ho creato queste immagini usando un programma di grafica pittorica gratuitamente distribuito, aggiungendo un effetto cera calda ed un effetto ombra al testo. E' possibile trovare attraverso la maggior parte dei motori di ricerca una quantità di clipart liberamente utilizzabili.

Banner pubblicitari

Se il vostro sito si giova di una serie di sponsor, potete usare un collegamento immagine che mostri in successione ognuno degli sponsor. Il primo passo è creare un'immagine per ciascuno sponsor. Tutte le immagini dovrebbero avere le stesse dimensioni. Le URL corrispondenti alle immagini e agli indirizzi Internet dei relativi siti sono piazzate nelle matrici chiamate adImages e adURLs, definite all'inizio dello script. L'elemento img per il collegamento dovrebbe essere inizializzato con la prima immagine della matrice. Il ciclo viene fatto partire usando l'evento onload nell'elemento body.

<html>
<head>
<title>Banner pubblicitari ciclici</title>
<script type="text/javascript">
if (document.images)
{
    adImages = new Array("immagini/mit.gif",
                "immagini/inria.gif", "immagini/keio.gif");
    adURLs = new Array("www.lcs.mit.edu",
                "www.inria.fr", "www.keio.ac.jp");
    thisAd = 0;
}

function cycleAds()
{
    if (document.images)
    {
        if (document.adBanner.complete)
        {
            if (++thisAd == adImages.length)
                thisAd = 0;

            document.adBanner.src = adImages[thisAd];
        }
    }

    // cambia allo sponsor successivo ogni 3 secondi
    setTimeout("cycleAds()", 3000);
}

function gotoAd()
{
    document.location.href = "http://" + adURLs[thisAd];
}
</script>
</head>
<body onload="cycleAds()">
...

<a href="javascript:gotoAd()"><img name="adBanner"
src="immagini/mit.gif" border="0" alt="I nostri sponsor"></a>

I nostri sponsor:

Nota: vi raccomando di accertarvi che tutte le immagini abbiano le stesse larghezza e altezza. Un'alternativa è costituita dall'aggiungere gli attributi width e height all'elemento img, in modo da garantire che tutte le immagini siano visualizzate con le stesse dimensioni.

Che cosa fare con i browser che non supportano i linguaggi di scripting?

Il contenuto di un elemento noscript viene visualizzato solo se il browser non supporta i linguaggi di scripting. Dovrebbe essere utilizzato quando si vuole dare accesso ad informazioni che altrimenti rimarrebbero inaccessibili a tutti coloro che usano browser privi di supporto per i linguaggi di scripting.

<noscript>
I nostri sponsor: <a href="http://www.lcs.mit.edu/">MIT<,
<a href="http://www.inria.fr/">INRIA</a>, e
<a href="http://www.keio.ac.jp/">Keio University</a>.
</noscript>

Esistono molte fonti d'informazione gratuite circa i linguaggi di scripting, che possono essere facilmente reperite per mezzo dei più comuni motori di ricerca.

Ottenere ulteriori informazioni

La Raccomandazione del W3C per l'HTML 4.0 è la fonte più autorevole sulle specifiche del linguaggio HTML. Si tratta tuttavia di un documento tecnico. Per avere una fonte di informazioni meno tecnica potete acquistare uno dei molti libri sull'HTML in commercio, per esempio "Raggett on HTML 4", pubblicato nel 1998 da Addison Wesley. Vedete anche "Beginning XHTML", pubblicato nel 2000 da Wrox Press, che introduce la riformulazione ad opera del W3C dell'HTML come un'applicazione di XML. XHTML 1.0 è ora una raccomandazione del W3C.

Buona fortuna e cominciate a scrivere!

Dave Raggett <dsr@w3.org>

Copyright  ©  2000 W3C ^® (MIT, INRIA, Keio ), All Rights Reserved. W3C liability, trademark, document use and software licensing rules apply. Your interactions with this site are in accordance with our public and Member privacy statements.

Leggi Aggiungere un tocco di stile
Vai alla prima pagina
Scrivi a info@diodati.org
Aggiornato Sunday, 08-Sep-2002 17:59:34 CEST
6385 visite dal 01/04/2001