Il linguaggio standard che il WWW usa per creare e riconoscere i documenti ipermediali e' l'HyperText Markup Language (HTML). Ad esso e' correlato pur non essendone un sottoinsieme, lo Standard Generalized Markup Language (SGML), un linguaggio di formattazione dei documenti utilizzato ampiamente su alcuni circuiti di utenti.
L'HTML e' molto apprezzato per la sua facilita' d'uso. I documenti WWW sono tipicamente scritti in HTML e hanno normalmente il suffisso ".html" nel nome. Tali documenti non sono altro che dei normali file ASCII a 7-bit con dei codici di formattazione che contengono informazioni sulla stesura (stili del testo, titolo dei documenti, paragrafi, liste) e sui link (chiamati ancore). Segnaliamo l'esistenza in Rete di programmi per la conversione da altri formati in HTML.
L'attuale standard HTML supporta le basi per la creazione e il layout dei documenti, ma per gli usi correnti e' ancora limitato. Esistono tre livelli di HTML: il primo da' le specifiche per il documento base (Header, Link, ecc.), il secondo consente di avere In-line image, mappe sensitive e campi di input nel doc. L'ultima versione dell'HTML, chiamata HTML+, supporta forme interattive, definisce "hotspot" nelle immagini, e consente un layout piu' versatile oltre a molti altri miglioramenti. Le specifiche per le tre versioni possono essere reperite qui.
L'HTML utilizza quelli che sono chiamati "Uniform Resource Locators" (URL) per rappresentare i link ipermediali e i link ai servizi di rete all'interno dei documenti. E' possibile rappresentare quasi ogni file o servizio in Internet con un URL.
Questo documento da' le specifiche della stesura di un documento HTML ad un livello che si colloca tra l'uno e il due. Per poter capire questo documento e' necessario avere alcune conoscenze di base sugli ipertesti.
Requisiti minimi di un documento HTML
La stesura di un documento HTML richiede la specifica di alcuni parametri per la formattazione del testo.
Il documento minimo in HTML e` composto da :
Per la stesura di un doc HTML viene suggerito:
Usare nel doc il Tag <HTML> all'inizio e </HTML> alla fine, separare la parte di Header del doc dalla parte del body. Si ottiene cosi un documento di piu' facile lettura.
Layout consigliato:
<HTML>
<HEAD>
parte del header (Tilte, ecc.)
</HEAD>
<BODY>
il testo del doc con i vari paragrafi, link ecc.
</BODY>
</HTML>
Ogni documento HTML dovrebbe avere un titolo che ne descriva il contenuto. Il titolo e' usato principalmente per identificare il documento (p.es. quando si cerca un documento nella Hotlist) ed e' in genere visualizzato separatamente dal resto del documento. Ovvia conseguenza del fatto che un titolo serve a identificare il documento, se il titolo esiste deve essere unico.
L'HTML ha 6 livelli di intestazione (header) da usare, ad esempio, per evidenziare il titolo di un paragrafo. Esso e' infatti visualizzato usando font piu' grandi ed in grassetto (fate delle prove per vedere i vari effetti).
Attenzione: la grandezza delle parole per effetto degli Header varia a seconda dei font. In particolare con alcuni font e' stato riscontrato che gli Header dal 4 al 6 vengono visualizzati piu' piccoli del testo normale.
A differenza di molti word-processor, in HTML il carriage-return non e' significativo; inoltre piu' spazi di seguito vengono raggruppati in un unico spazio (l'indentatura tramite spazi non funziona). Quindi attenzione a quando si edita un testo perche', se ad esempio finite una frase in mezzo ad una riga e mettete un punto ed andate a capo, quello che scriverete nella riga seguente apparira` subito dopo il punto. L'HTML inoltre adotta il word-wrapping, cioe` ridimensionando la finestra in cui il documento appare, il testo viene scalato di conseguenza per permetterne la visione integrale. Queste due operazioni automatiche sono evitabili solo usando il tag di testo preformattato (<PRE>).
<A HREF ="file_name"( in formato URL)> testo che fungera' da collegamento </A>
Esempio: <A href="../../prova.html">Prova </A>
Questo esempio crea un link con il file ipertestuale prova.html, trovato risalendo di due directory quella corrente. Nel documento il link appare come la parola Prova sottolineata o evidenziata (a seconda del Browser) cliccando sulla parola verra' caricato il nuovo documento prova.html. Si consiglia per i file locali di usare sempre path relativi (in caso di spostamenti danno meno problemi).
Per effettuare il richiamo di qualsiasi file in Rete e non, WWW usa il formato URL (Uniform Resource Locator). Il formato e' cosi' composto:
Risorsa usata://HOST.DOMAIN[:PORT]/Path/Filename.
Ancore e Links a parti specifiche di un documento
I link o le ancore possono essere anche utilizzate per spostarsi all'interno dello stesso documento facendo riferimenti a vari punti di questo. Supponiamo si voglia creare un link da un documento A ad una specifica sezione del documento B. Prima bisognera' marcare la sezione a cui poi si fara' riferimento nel modo seguente:
<A NAME="qui_Kirk">il testo che verra' visualizzato</A>
Quindi si creera' il link cosi':
<A HREF="..filename#qui_Kirk">..testo_visualizzato..</A>
Ove "..filename" e' l'URL che localizza il documento B e "..testo_visualizzato.." e' il testo (mostrato nel documento A) che fara' da link.
Ecco un esempio di cio' che si puo visualizzare (solo online):
Il programma MOSAIC (dell'NCSA) e' in grado di visualizzare immagini X Bitmap (XBM) e GIF all'interno di un documento HTML. Ogni immagine richiede un certo tempo di elaborazione causando un rallentamento della macchina nel mostrare il documento; quindi si consiglia di usare magari la stessa immagine piu' volte, il che riduce i tempi necessari. Per includere un'immagine nel documento usare il Tag:
<IMG SRC=image_URL>ove image_URL e' l'URL del file immagine (URL_info). Se il file immagine e' gif il suo nome deve terminare con .GIF, similmente se e' una X Bitmap deve terminare con .XBM.
Per default la fine dell'immagine e' allineata con il testo che segue. Usate l'opzione
IMG ALIGN=top/middle
<IMG SRC=image.gif ALT=Testo_alternativo>
Immagini, suono ed animazioni esterne
Volendo inserire un'immagine nel documento, ma non rallentare la visualizzazione del documento stesso, si puo' decidere di visualizzarla a richiesta dell'utente creando un link per l'immagine (che verra' visualizzata su di una finestra separata e non piu' all'interno del doc). Per includere un riferimento ad una immagine esterna usate il Tag:
<A HREF ="Image_URL"> link anchor </A>
La stessa sintassi va usata per specificare un link con animazioni e suono esterni.
Il riconoscimento del formato del file a cui il link si riferisce viene effettuato tramite le estensioni stesse del file.
Le piu' comuni estensioni sono:
Una lista numerata si crea usando i seguenti Tag:
Il Tag per aprire le liste non numerate e' : <UL>, per chiuderla </UL>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>
Il Tag per aprire le liste di menu e' : <MENU>, per chiuderla </MENU>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>
Questo tipo di lista dovrebbe essere fatta di piccoli paragrafi (solitamente 1 linea per elemento). Essa viene visualizzata con uno stile piu' compatto rispetto alle liste non ordinate.
Il Tag per aprire le liste di directory e' : <DIR>, per chiuderla </DIR>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>
Questo tipo di lista dovrebbe essere composta di piccoli elementi, tipicamente di 20 caratteri. Questi possono essere incolonnati lungo la pagina.
Una lista di descrizione e' solitamente un alternanza di titoli (DT e descrizioni (DD).
Attenzione: sono ammesse liste nidificate di qualsiasi livello; l'output risultante pero' varia a seconda del browser usato (alcuni non le supportano).
Formato dei caratteri
Singole parole o intere frasi possono essere messe in risalto tramite l'uso di speciali Stili. L'HTML supporta due tipi di Stili: quello logico e quello fisico. Il formato logico da uno stile al testo a cui si riferisce in accordo con il suo significato (quello del tag) e puo' variare da browser a browser. I due tipi di stile sortiscono lo stesso effetto, ma quello logico sarebbe da preferire in caso di future modifiche e nell'eventualita' che si possano introdurre nuovi tipi di stili.
Stile fisico. Lo stile fisico supporta:
Sequenze di Escape e altri Tag Qui di seguito vi sono alcune escape sequence per inserire caratteri particolari (quali >,&, ecc.) che altrimenti verrebbero considerati come facenti parte di Tag:
Altre sequenze di escape esistono per caratteri accentati e con l'umlaut tedesco (seguite questo link).
Il Tag Blockquote serve a avere un pezzo di testo (ad es. una citazione) in modo indentato e separato rispetto al resto del testo. Si usa cosi':
<BLOCKQUOTE> Testo_coinvolto </BLOCKQUOTE>
(all'interno sono ammessi i Tag per i paragrafi).
Il Tag Address serve generalmente per specificare l'autore del documento html ed eventualmente il suo recapito mail ecc. (solitamente si trova alla fine del documento). Si usa cosi':
<ADDRESS> Testo_coinvolto </ADDRESS>.