Comprendere e rispettare gli standard w3c by Corso Grafica e Web Design

Il linguaggio HTML: comprendere e rispettare gli standard W3C

Introduzione In questa unità analizzeremo brevemente la storia e l’evoluzione del linguaggio HTML e le differenze di questo rispetto all’XHTML. In questo modo sarà possibile fare più chiarezza sulle caratteristiche stesse dei diversi linguaggi di markup, sui requisiti e sugli standard di riferimento che la marcatura (X)HTML deve rispettare nella realizzazione di ogni documento per la rete pubblica.

Introduzione del linguaggio HTML Dal primo utilizzo di questo linguaggio di markup, da parte di Tim Berners-Lee nel 1991, sono state sviluppate diverse versioni dell’HTML. Il prototipo di questo linguaggio venne prodotto nei laboratori di fisica del CERN, allo scopo di condividere facilmente i numerosi documenti di ricerca, attraverso un sistema di ipertesti. Per questo motivo venne sviluppato un primo “linguaggio di marcatura” chiamato SGML (Standard Generalized Markup Language): la base dei futuri HTML e HTML 2.0.

In questo prototipo di linguaggio di markup vennero inizialmente introdotti alcuni elementi e marcature di base come ad esempio p, h1h6 e l’ancora (a), necessaria per aggiungere i collegamenti ipertestuali. Nel 1994, la Mosaic Communication introdusse il browser conosciuto come Netscape. Il maggior contributo di questa compagnia, allo sviluppo del web, fu quello di introdurre nuove estensioni del linguaggio HTML di base, atti proprio a migliorare la “presentazione” e il “design” dei documenti presenti in rete, compatibili ovviamente solo per il browser Netscape.

Successivamente, nel 1996 la Microsoft lanciò il suo browser: Internet Explorer 3.0, sviluppando una propria versione aggiornata del linguaggio HTML, adatta proprio a IE 3.0. In seguito alla formazione del World-Wide-Web Consortium (W3C), nel 1996, venne infine discusso uno standard HTML di riferimento, comune per un migliore sviluppo web: l’HTML 3.2. Questa prima versione HTML certificata globalmente, rappresenta ancora oggi lo status del linguaggio HTML, dal momento che include la maggior parte degli elementi e attributi di presentazione conosciuti e già visti nell’introduzione del primo Modulo, supportati da browser diversi e utilizzati nello sviluppo delle pagine web dai web-designer.

Le versioni HTML 4.0 and 4.01, elaborate nel 1999, sono state sviluppate per stabilire un nuovo standard di accessibilità e, soprattutto, per specificare la separazione della “presentazione” finale delle pagine web dal loro contenuto specifico: una divisione volta proprio a migliorare la fruizione generale dei siti presenti in rete. Secondo questo nuovo standard di riferimento, dettato attraverso l’introduzione delle versioni HTML 4.0 e 4-01, la maggior parte della visualizzazione grafica finale dovrebbe essere affidata ai Fogli di Stile a Cascata (CSS). In seguito all’elaborazione dei nuovi standard di riferimento per la rete, le recenti versioni 4.0 e 4.01 dell’HTML costituiscono proprio quelle versioni del linguaggio di markup attualmente di maggior

utilizzo, facilmente accessibili a tutte le persone che navigano nella rete. Inoltre è importante ricordare che esistono tre versioni specifiche dell’HTML 4.01: 1) Transitional, 2) Strict e 3) Frameset. L’HTML 4.01 in tre aspetti Nonostante l’elaborazione dei nuovi standard di riferimento relativi all’HTML e ai Fogli di Stile a Cascata (CSS), già nel 1999 esistevano in rete milioni di pagine web realizzate con delle codifiche HTML precedenti e, secondo i nuovi standard, ormai obsolete.

Data l’impossibilità di modificare tutti i materiali già presenti in rete, adeguandoli ai nuovi standard, sono state elaborate diverse versioni HTML, per ovviare ad eventuali problemi di incompatibilità e accessibilità dei “vecchi” contenuti del web, non conformi ai nuovi parametri W3C. 1) HTML Transitional La versione HTML Transitional include la maggior parte degli elementi di presentazione dell’HTML, attualmente conosciuti e utilizzati. Questa opzione di linguaggio “di passaggio” è stata resa disponibile per avvicinare gradualmente i web-designer ai nuovi

standard e velocizzare l’introduzione di nuovi browser e strumenti di sviluppo adeguati. Gli elementi di presentazione (come ad es. center) e alcuni attributi HTML (come ad es. bgcolor e align) vengono segnalati in questa versione come già obsoleti o “deprecati”, destinati quindi ad essere completamente rimossi nelle nuove versioni HTML. 2) HTML 4.01 Strict Tale versione, al contrario della precedente, non permette l’utilizzo degli elementi e degli attributi, ormai “deprecati”, secondo gli standard di riferimento dell’HTML 4.01

3) HTML Frameset Questa terza versione HTML Ă¨ stata elaborata per descrivere il contenuto dei documenti per il web strutturati in frame. I frame permettono una suddivisione della finestra del browser in ulteriori finestre, dove ciascuna visualizza differenti documenti HTML. Le strutture definite come frame sono costruite attraverso un documento HTML specifico, di tipo frameset, che serve a definire proprio la struttura e il contenuto di ogni singolo frame. Documenti di tipo frameset sono differenti dai normali documenti in linguaggio HTML dal momento che utilizzano un elemento frameset al posto del normale elemento body.

Attualmente, per motivi di usabilitĂ e accessibilitĂ , i frameset vengono utilizzati raramente e proprio per questo motivo non verranno presi direttamente in considerazione durante questo corso, dedicato principalmente alle attuali tendenze nel campo del webdesign. Conoscere il DTD Secondo gli standard di riferimento attuali, durante la creazione di una struttura (X)HTML Ă¨ sempre buona norma definire la sua

“definizione” specifica o meglio la sua Document Type Definition (DTD). Tale specificazione viene di norma inserita all’inizio di ogni documento (X)HTML per identificare un modello di documento unico, globalmente riconosciuto da chi utilizza uno stesso linguaggio di marcatura. Tale richiamo ad una codifica unica appare generalmente nei modi seguenti, all’interno di una struttura HTML 4.01 e di un documento XHTML 1.0.

esempio di parte di DTD per un documento HTML 4.01 Transitional

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html4/loose.dtd>

esempio di parte di DTD per un documento XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Una codifica DTD completa serve a indicare e a definire, a seconda della versione di linguaggio, tutti gli elementi e gli attributi del linguaggio utilizzabili in un dato documento e le regole necessarie al loro impiego. Secondo lâ&#x20AC;&#x2122;attuale normativa del W3C, attualmente vengono utilizzati tre versioni leggermente differenti di DTD, corrispondenti proprio alle diverse tipologie di linguaggio HTML 4.01: Transitional DTD, Strict DTD e Frameset DTD.

Lâ&#x20AC;&#x2122;esempio seguente mostra solo una piccola parte di una codifica completa DTD HTML 4.01, che definisce gli elementi p e h1â&#x20AC;&#x201C;h6 insieme agli attributi a questi associabili. Esempio di un documento DTD

Il linguaggio XHTML Il linguaggio HTML è limitato a quelle tipologie di contenuto che possono essere “descritte”, contenenti quindi principalmente elementi di testo, immagini, file video, ecc. Per permettere la visualizzazione e la condivisione globale di contenuti di tipologia diversa è necessario utilizzare un linguaggio di marcatura più specialistico. Per questo motivo il W3C ha elaborato un linguaggio di marcatura specifico: l’XML (eXtensible Markup Language). Attraverso l’utilizzo dell’ XML, gli autori possono creare un linguaggio di marcatura personalizzato, adeguato alle informazioni che si vogliono condividere in rete.

Utilizzando un linguaggio XML sarà pertanto possibile inserire autonomamente dei nuovi elementi di marcatura. Inoltre è possibile in un singolo documento usare diversi linguaggi di marcatura di tipo XML. Mentre il linguaggio HTML di più largo utilizzo viene prevede l’utilizzo di un set prestabilito di elementi e di una sintassi comune per la “descrizione” e la formattazione delle pagine web, l’XML viene impiegato per creare nuovi linguaggi di marcatura, utili per la descrizione di documenti sempre diversi. Creando singolarmente sempre nuovi elementi di marcatura diventa ovviamente difficile controllare l’effettiva accessibilità e usabilità di quei contenuti realizzati in XML.

I browser infatti devono poter riconoscere i nuovi elementi di marcatura introdotti e allo stesso tempo capire il perchĂŠ alcuni elementi comuni sono stati sostituiti o omessi in una struttura base di documento. Proprio per questo motivo le regole di utilizzo della marcatura dei XML sono molto piĂš rigide di quelle seguite durante la creazione di un normale documento HTML. Esempio struttura base di un documento XML <?xml version="1.0" encoding="UTF-8"?> // versione del linguaggio e codifica standard <corsisti cpuacademy> <corsista webdesign>

<nome>Giorgio</nome> <cognome>Rossi</cognome> <luogo nascita>Palermo</luogo nascita> <data nascita>10/02/1971</luogo nascita> </corsista webdesign> <corsista webdesign> <nome>Giovanni</nome> <cognome>Verdi</cognome> <luogo nascita>Torino</luogo nascita> <data nascita>23/05/1985</luogo nascita> </corsista webdesign> </corsisti cpuacademy>

Riscrivere l’HTML Per favorire un utilizzo congiunto di più linguaggi di marcatura in un unico documento, progettato per essere condiviso in rete, il W3C ha elaborato l’XHTML: una versione rielaborata del linguaggio HTML, rispondente alle rigide regole di utilizzo della marcatura XML. Una prima versione del linguaggio XHTML, la cosiddetta “1.0”, risulta identica al linguaggio HTML 4.01. I due linguaggi condividono infatti gli stessi elementi di marcatura e gli stessi attributi. Inoltre anche per l’XHTML 1.0 abbiamo gli stessi

tre tipi di DTD relativi all’HTML 4.01: Transitional, Strict e Frameset. Sintassi XHTML Quello che rende diverso dall’HTML il linguaggio XHTML è che quest’ultimo è un linguaggio di tipo XML, dove l’utilizzo di una sintassi corretta è fondamentale. Ad esempio, ogni elemento deve essere sempre chiuso con il tag appropriato e correttamente annidato, mentre gli attributi devono sempre essere racchiusi dalle doppie virgolette.

Oltre a delle nuove regole sintattiche, lâ&#x20AC;&#x2122;XHTML aggiunge ulteriori caratteristiche specifiche, proprie di un linguaggio di tipo XML, non necessarie invece per lâ&#x20AC;&#x2122;utilizzo del solo linguaggio HTML 4.01. La lista seguente comprende tutti i requisiti per una corretta elaborazione di un documento di tipo XHTML. Alcuni di questi presentano sostanziali differenze rispetto alle caratteristiche proprie di un normale documento HTML.

ď&#x201A;ˇ Gli elementi e gli attributi devono comparire in minuscolo In HTML gli elementi e gli attributi non sono case-sensitive. Pertanto Ă¨ possibile scrivere il tag body in entrambi i modi seguenti, senza pregiudicare la struttura del documento: <html> = <HTML>. In XHTML invece gli elementi e gli attributi sono case-sensitive: <html> â&#x2030; <HTML>. Pertanto, per essere correttamente interpretati, gli attributi e gli elementi dovranno sempre essere inseriti in lettere minuscole. I valori degli attributi tuttavia non devono essere necessariamente riportati in lettere minuscole, a meno che la lista di valori predefinita per un dato attributo non specifichi diversamente.

 Tutti gli elementi devono essere chiusi Come menzionato nell’introduzione all’HTML, è possibile omettere il tag di chiusura di alcuni elementi. In XHTML questo non è mai possibile. Ogni tag di apertura deve essere “terminato” dall’appropriato tag di chiusura. Tale regola si estende in XHTML anche agli elementi vuoti. Pertanto anche quegli elementi come , <hr> e <img> devono essere terminati. Ad esempio, mentre in HTML l’elemento può anche essere utilizzato senza chiusura, dal momento che non racchiude alcun

contenuto, in XHTML tale tag dovrà sempre apparire nel modo seguente: come menzionato già nell’unità introduttiva. Allo stesso modo anche gli altri elementi vuoti dovranno sempre essere chiusi, inserendo uno slash prima della parentesi di chiusura: es. <img/ >, <hr/ >.  I valori degli attributi devono essere racchiusi da doppie virgolette Mentre in HTML alcuni valori di attributo possono comparire non racchiusi tra doppie virgolette, in XHTML tali valori devono sempre essere racchiusi nel modo seguente: attributo="valore". Inoltre non

dovrebbe essere inserito dello spazio extra (caratteri di spaziatura e/o invio) prima o dopo il valore di attributo racchiuso tra le virgolette. Es. <elemento attributo="valore"> ≠ <elemento attributo=" valore ">  Tutti gli attributi devono avere valori espliciti L’XML e quindi anche l’XHTML non supporta la cosiddetta “minimizzazione degli attributi”, che implica l’inserimento di un attributo riportando solamente il suo valore.

 Gli elementi devono essere annidati correttamente In XHTML è fondamentale rispettare il corretto annnidamento dei vari elementi, secondo criterio gerarchico. Esempio di annidamento corretto in XHTML

Il mio cane è nero

Esempio di annidamento non corretto in XHTML Il mio cane è nero

 Utilizzare sempre le entità di carattere per l’inserimento di caratteri speciali o riservati. Tutti i caratteri riservati (es. <, >, e &), che vedremo in dettaglio nell’unità successiva, devono essere rappresentati con la loro codifica di carattere o letterale e non con quella di tipo numerico. Tale codifica specifica è necessaria anche per i valori degli attributi e i titoli stessi dei documenti XHTML. Struttura giusta per una corretta visualizzazione finale: <img src="olivercompany.jpg" alt="Oliver &amp; Company" />

Struttura errata per una corretta visualizzazione finale: <img src="olivercompany.jpg" alt="Oliver & Company" />

 Utilizzo di id al posto dell’attributo name come identificatore Nel linguaggio XHTML, l’attributo id sostituisce l’attributo name, quando utilizzato come identificatore. Infatti l’attributo name, utilizzato in origine come elemento di identificazione al posto di id, è ormai deprecato e non più utilizzato in associazione alla maggior parte degli elementi (X)HTML.

 Gli script devono essere racchiusi nella sezione CDATA Utilizzando l’XHTML è necessario collocare gli eventuali script di programmazione in una sezione del documento specifica, chiamata CDATA, affinchè possano essere correttamente interpretati. Es. <script type="type/javascript"> <![CDATA[ I programmi JavaScript vanno inseriti qui ] ]> </script>

 Restrizioni aggiuntive di annidamento In HTML esistono già delle regole di base da rispettare nell’annidamento dei vari elementi di markup. Ad esempio non è bene posizionare un elemento p all’interno di un altro tag p, oppure non si dovrebbe inserire un elemento di blocco livello all’interno di un elemento in linea. In XHTML esistono delle ulteriori regole da seguire affinchè i vari tag vengano interpretati correttamente.

 L’elemento ancora a non deve contenere altri elementi a.  L’elemento pre non deve contenere elementi img, object, big, small, sub o sup.  L’elemento button non deve contenere gli elementi: input, select, textarea, label, button, form, fieldset, iframe e isindex .  I form non devono contenere ulteriori elementi form.

Requisiti di nomenclatura (namespace) e lingua Dal momento che l’XHTML è un linguaggio XML, ci sono alcuni attributi specifici richiesti per la realizzazione della struttura base di un documento. Tali attributi non vengono richiesti e usati in un normale documento HTML. In un documento XHTML l’elemento HTML, alla base della struttura del documento, deve essere scritto nel modo seguente: <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> L’attributo xmlns sta per XML namespace.

Un namespace è una convenzione stabilita in XML per identificare univocamente il linguaggio usato da un determinato documento. Dal momento che l’XML permette l’utilizzo di più linguaggi all’interno di un solo documento, è possibile che si verifichi una sovrapposizione dei nomi degli elementi. Ad esempio un elemento a potrebbe essere allo stesso tempo un l’elemento “ancora” del linguaggio (X)HTML oppure un eventuale elemento “answer” abbreviato, inserito a livello individuale come nuovo strumento di marcatura. Utilizzando l’XML namespace, è possibile specificare la tipologia dei documenti creati, affinchè non si verifichino errori di interpretazione al momento della visualizzazione finale.

Per i documenti XHTML, l’xmlns deve essere identificato come XHTML, utilizzando l’identificatore unico per tutti i documenti XHTML, come evidenziato nella struttura sopra riportata. Gli attributi lang e xml:lang rappresentano due modalità per specificare il linguaggio base di un documento (X)HTML. Il valore dei due attributi è costituito da un codice abbreviato di lingua, composto da due o tre lettere (es. en, come nell’esempio riportato). E’ possibile visualizzare una lista completa dei codici di lingua attraverso il seguente link: http://www.loc.gov/standards/iso6392/php/code_list.php

Gli standard W3C e i browser DifficoltĂ nel rispetto degli standard comuni nello sviluppo dei documenti per il web vengono affrontate non solo dagli sviluppatori di siti ma anche da chi sviluppa i browser. I browser di moderna generazione devono infatti conformarsi allo standard comune stabilito dal W3C e, allo stesso tempo, permettere una corretta visualizzazione di tutti quei contenuti giĂ presenti in rete. Per compiere entrambe le operazioni i browser possono operare secondo due modalitĂ distinte:

 La modalità standard segue le regole stabilite per una corretta interpretazione e visualizzazione dell’HTML 4.01 e del XHTML 1.0.  La modalità “quirks” permette ai browser di visualizzare anche quei documenti realizzati con una marcatura errata o non conforme agli standard. Il problema di utilizzo di questa modalità è che browser diversi hanno differenti modalità di visualizzazione di pagine di questo tipo. Pertanto stessi documenti potrebbero essere interpretati e visualizzati ogni volta diversamente. Creando dei documenti per il web, secondo gli standard W3C, è possibile comunicare ai browser di utilizzare direttamente la modalità

standard per la loro interpretazione e visualizzazione. Per comunicare questo è necessario dichiarare il tipo di documento. Dichiarare il tipo di documento Per dichiarare il tipo di documento è necessario comunicare al browser, in una dichiarazione all’inizio del documento, definita DOCTYPE, la versione (X)HTML esatta (che costituisce appunto il DTD), utilizzata nella creazione del documento.

I documenti (X)HTML iniziano sempre con una dichiarazione DOCTYPE, relativa al tipo di documento in oggetto, affinchè questo venga considerato valido secondo gli standard comuni. Mentre prima questa dichiarazione poteva essere facilmente omessa, adesso nell’ambito dello sviluppo dei moderni siti web è necessario includere sempre una dichiarazione DOCTYPE all’inizio di ogni documento. L’esempio seguente rappresenta una dichiarazione DOCTYPE che indica che il documento in oggetto è stato realizzato conformemente alle regole dell’HTML 4.01 Strict DTD.

La dichiarazione DOCTYPE deve essere inserita prima del tag di apertura <html> Esempio di dichiarazione DOCTYPE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/HTML4.01/strict.dtd"> <html> ...resto del documento... Vediamo ora i singoli componenti di questa dichiarazione

Il simbolo <! in apertura comunica al browser che quello che segue costituisce una dichiarazione relativa al tipo di documento (un documento di tipo HTML in questo caso) e non un elemento del linguaggio HTML. La parte PUBLIC "-//W3C//DTD HTML 4.01//EN" costituisce la stringa di identificazione pubblica che rappresenta la modalitĂ unica per identificare un particolare DTD. Infine nella dichiarazione compare lâ&#x20AC;&#x2122;URL relativa alla versione Strict DTD che serve da identificatore unico per quei browser che non possono interpretare altre versioni.

Dichiarazioni DOCTYPE disponibili Durante la creazione di un documento (X)HTML conforme agli standard W3C Ă¨ sufficiente inserire la dichiarazione DOCTYPE iniziale, semplicemente copiandola tra quelle attualmente disponibili. Utilizzando software specifici per il web-authoring, come ad esempio Adobe Dreamweaver, Ă¨ anche possibile che tali dichiarazioni vengano inserite in automatico, alla creazione di ogni documento. Eâ&#x20AC;&#x2122; possibile visualizzare la lista completa delle dichiarazioni attraverso il seguente link: www.w3.org/QA/2002/04/valid-dtdlist.html.

Di seguito vengono elencate le dichiarazioni DOCTYPE più comuni e di più largo utilizzo a seconda del linguaggio di markup di riferimento. 

per HTML Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD "http://www.w3.org/TR/html4/strict.dtd">

HTML

4.01//EN"

 per HTML Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  per HTML Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

 per XHTML 1.0 Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

1.0

Strict//EN"

 per XHTML 1.0 Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  per XHTML 1.0 Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Quale dichiarazione tra quelle più comunemente utilizzate dovremmo quindi inserire nei documenti (X)HTML appena creati?

Imparando un linguaggio di marcatura per la prima volta è senz’altro bene utilizzare elementi e attributi non deprecati, attenendosi agli standard W3C attuali. Pertanto è possibile in questo caso fare riferimento ad una “Dichiarazione” HTML 4.01 versione Strict. Altrimenti, nel caso in cui sia necessario gestire delle pagine web già create in precedenza, è bene utilizzare una “Dichiarazione” di tipo transitional, dal momento che alcuni elementi nel linguaggio utilizzato potrebbero non essere più conformi agli attuali standard W3C.

HTML o XHTML? L’XHTML costituisce senz’altro il futuro del linguaggio di marcatura utilizzato nello sviluppo dei siti web. I browser di futura generazione saranno infatti largamente compatibili con questo specifico linguaggio di markup. Tuttavia è possibile già da adesso utilizzare direttamente questo linguaggio di marcatura nella creazione dei nostri documenti.

I suoi precisi requisiti sintattici rendono tale linguaggio più facilmente “leggibile” attraverso l’utilizzo di dispositivi diversi. Molti apparecchi portatili, come ad esempio i telefoni cellulari e i palmari utilizzando l’XHTML come codifica standard. Pertanto pagine realizzate esclusivamente secondo i criteri dell’XHTML saranno più facilmente fruibili attraverso questi dispositivi. Dal momento che si tratta di un linguaggio di tipo XML, nei singoli documenti XHTML è possibile combinare diversi linguaggi XML.

Dal momento che l’XHTML costituisce il linguaggio del futuro, nell’ambito dello sviluppo della rete, durante questo corso verranno prese in considerazione soprattutto le rigide regole di marcatura dell’XHTML. Nonostante tale scelta, è necessario ricordare che attualmente il linguaggio HTML è universalmente supportato. Tuttavia utilizzare direttamente una rigida sintassi XHTML sarà utile anche durante l’utilizzo di quei software dedicati al web-authoring, dal momento che consentono di richiamare automaticamente parti di struttura di un documento XHTML, velocizzando enormemente il lavoro di sviluppo.

Validare i documenti Validare un documento per la rete significa controllare la marcatura realizzata per verificare che questa sia interamente conforme alla dichiarazione (DTD) scelta. Documenti senza errori nella struttura di base verranno definiti validi. Documenti (X)HTML validi verranno interpretati e visualizzati correttamente e più velocemente attraverso browser diversi. Saranno pertanto più accessibili. Attualmente i browser non richiedono necessariamente la “validità” dei vari documenti per poterli visualizzare.

Pertanto ogni browser proverà a interpretare e visualizzare le pagine web anche quando queste presentano errori nella struttura del documento. Per controllare la “validità” dei documenti realizzati è possibile utilizzare un valida-tor, un software che controlla i documenti sorgente, rispetto al DTD che è stato specificato per essi. Un software di questo tipo controllerà i seguenti elementi relativi al documento da validare:

 L’utilizzo, all’inizio del documento, della dichiarazione DOCTYPE. Senza di questa il software non saprà a quale tipo di documento far riferimento.  L’utilizzo di un’indicazione per la codifica di carattere del documento (si veda il paragrafo successivo dedicato).  L’utilizzo delle regole e degli attributi necessari  L’utilizzo di elementi non conformi agli standard  L’utilizzo errato degli elementi di marcatura  Errori di annidamento  Violazioni delle regole DTD.

ď&#x201A;ˇ Errori di digitazione Il W3C offre gratuitamente uno strumento per validare i documenti creati, accessibile attraverso il seguente link: validator.w3.org. Codifica del carattere Dal momento che la rete Ă¨ diffusa a livello mondiale, esistono forme di scrittura diverse, con un enorme numero di caratteri unici destinati ad essere visualizzati anche sulle pagine web. Tale insieme di forme e simboli comprende non solo i vari alfabeti (Occidentale, Ebraico,

Arabo, ecc.) ma anche tutti quei simboli pertinenti a scritture ideografiche (Cinese, Giapponese e Coreano). Diversi set di caratteri sono stati standardizzati per essere sempre visualizzati in uno stesso modo attraverso i computer presenti in rete. Ad esempio il set di 256 caratteri utilizzati soprattutto in relazione alle lingue occidentali è stato standardizzato e definito come Latin-1 (o ISO 8859-1, per usare il codice di identificazione “formale”). Il Latin-1 è pertanto la “codifica di carattere” utilizzata già a partire dall’HTML 2.0 and 3.0, ed è possibile utilizzarla ancora oggi nella realizzazione dei moderni documenti per il web.

Unicode Alcuni set di caratteri appartengono alla codifica Unicode (ISO/IEC 10646), che include i caratteri per le lingue piĂš conosciute e utilizzate nel mondo. Nellâ&#x20AC;&#x2122;Unicode rientrano infatti piĂš di un migliaio di caratteri.

Il codice Unicode assegnato ai vari caratteri viene rappresentato con il simbolo U+, seguito da quattro (o sei) cifre che costituiscono il numero che individua ogni singolo carattere. La codifica Unicode viene riconosciuta e utilizzata dai moderni linguaggi di programmazione e dai linguaggi di marcatura utilizzati nel campo del web-design. Il repertorio di codici numerici della codifica Unicode Ă¨ serializzato tramite diversi schemi di codifica (in binario) che permettono un utilizzo di codici specifici per quei gruppi di caratteri usati con maggiore frequenza. Il set di caratteri Unicode puĂ˛ pertanto essere codificato attraverso lâ&#x20AC;&#x2122;uso di codici con unitĂ da 8 bit (codifica UTF8), 16 bit (codifica UTF-16) e 32 bit (codifica UTF-32).

La codifica più utilizzata nella realizzazione di documenti per il web è senz’altro la UTF-8. Tuttavia è’ possibile trovare nella dichiarazione DOCTYPE dei documenti per il web codifiche di tipo UTF-16 o UTF-32, che utilizzano diversi numeri di byte per descrivere i caratteri. La codifica UTF-8 rimane comunque la codifica espressamente raccomandata per tutti i documenti HTML 4.01, XHTML, e XML.

Specificare la codifica del carattere Esistono diversi modi per associare una codifica di carattere ad un dato documento (X)HTML.  Chiedere all’amministratore del server di configurare il documento (X)HTML affinchè questo includa automaticamente la codifica di carattere nell’intestazione http. Tale intestazione costituisce una sezione informativa che il server associa ad ogni documento web prima di restituirlo attraverso il browser.

Tuttavia, dal momento che questa informazione può essere separata dal resto del documento è bene includere, secondo gli attuali standard W3C, tale codifica anche all’interno del documento stesso.  Nei documenti HTML 4.01 e XHTML 1.0, la codifica di carattere viene indicata utilizzando un meta-elemento che costituisce un elemento vuoto che fornisce quelle informazioni specifiche relative al documento, come ad esempio: la sua data di creazione, l’autore, i dati relativi al copyright e soprattutto proprio quelle informazioni specifiche relative alla codifica dei caratteri e al tipo di documento. Il cosiddetto meta-elemento va inserito nella sezione head del documento, così come evidenziato nell’esempio seguente relativo ad una struttura XHTML 1.0:

<head> <meta http-equiv="content-type" 1) content="text/html; 2) charset=utf-8" / > <title>Documento base</title> </head>

Lâ&#x20AC;&#x2122;attributo http-equiv indica che il meta-elemento fornisce informazioni specifiche relative al tipo di contenuto del documento (content-type). Lâ&#x20AC;&#x2122;attributo in questione fornisce tali informazioni in due sezioni distinte:

1) una prima parte indica che il documento costituisce un file di testo HTML e pertanto questo specifico valore dell’attributo http-equiv identifica la tipologia di linguaggio utilizzato. Sebbene l’esempio presentato sia stato indicato come esempio di documento XHTML, anche in questo caso l’attributo riporterà sempre, per ragione di compatibilità relativi all’utilizzo dei browser, l’indicazione HTML. 2) La seconda parte dell’attributo indica infine il valore specifico relativo alla codifica di carattere relativa al documento: in questo caso la codifica UTF-8.

Per fare un ulteriore esempio relativo alla codifica dei caratteri, viene riportata di seguito la struttura di un meta-elemento per un documento (X)HTML che utilizza invece una codifica Latin-1 . <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> //

Gli esempi seguenti mostrano la struttura minima di markup, secondo gli attuali standard W3C, necessaria alla pubblicazione dei documenti HTML 4.01 versione Strict e XHTML 1.0 versione Strict. HTML 4.01 Strict Di seguito viene indicata la struttura di markup minima per i documenti HTML 4.01 Strict, cosĂŹ come indicato dagli standard W3C. <!DOCTYPE html PUBLIC "-//W3C//DTD "http://www.w3.org/TR/html4/strict.dtd">

HTML

4.01//EN"

<html> <head> <title>Esempio di documento HTML 4.01 Strict </title> <meta httpequiv="content-type" content="text/html; charset=utf-8"> </head> <body> ... Contenuto del documento ... </body> </html>

XHTML 1.0 Strict Di seguito viene riportata la struttura di markup minima per i documenti XHTML 1.0 Strict, cosĂŹ come stabilito dagli standard W3C. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns = http://www.w3.org/1999/xhtml xml:lang="en" lang="en"> <head> <title>Esempio di documento XHTML 1.0 Strict </title> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> </head> <body>

... Contenuto del documento ... </body> </html>

Sebbene negli esempi (X)HTML riportati, contenuti nelle altre unità didattiche dedicate all’HTML, tale “dichiarazione” dei documenti non venga indicata, è sempre necessario includerla all’interno dei documenti, per la loro effettiva pubblicazione e validità.

FINE LEZIONE