HTML Tidy

Chiunque sviluppi applicazioni web si sarà trovato più una volta nella vita a scontrarsi con i capricci dell’interfaccia utente.
Il primo problema che si riscontra di solito consiste nella eccessiva permissività dei vari device di visualizzazione, i browser infatti sono tendenzialmente poco suscettibili verso il codice scritto male oppure contenente imprecisioni sintattiche. I concetti di well-form tipici di XML erano ben lontani quando sono nate le prime versioni di HTML.
Il secondo problema, che fa perdere di solito molte ore di sonno agli sviluppatori HTML alle prime armi, consiste alle diverse interpretazioni che i browser possono dare dello stesso codice HTML.

Appare chiaro quindi che queste premesse siano il terreno ideale per far nascere un terzo tipo di problema, figlio dei due precedenti: come si comportano browser differenti nell’interpretazione di codice HTML brutto, disomogeneo, disorganizzato e, insomma diciamolo… scritto male?
La risposta spesso si traduce in ore ed ore perdute nella ricerca delle compatibilità tra browser di codice che appare scritto in maniera corretta ma che, a ben guardare, scritto bene non è.

Quello che occorre quindi è uno strumento in grado di dare un’occhiata al nostro codice HTML, sia che si tratti di codice statico, codice generato dinamicamente oppure codice generato da trasformazioni XSL di flussi o documenti XML.

Bene, questo strumento esiste. Si tratta di HTML Tidy, progetto originale del W3C ed ora preso in gestione da un gruppo di volontari all’interno del gruppo SourceForge.net
È possibile scaricare l’ultima versione di questa utility.
Il download del file eseguibile per piattaforma Win32 dura abbastanza poco, si tratta di un file eseguibile di circa 140K da salvare sul vostro file system.

Come funziona

Facciamo subito un esempio: creiamo il file in.html con il seguente contenuto:

/

Come vedete il file non contiene nulla se non il tag aperto e chiuso. Questo coincide con un documento che ha poco significato, ed infatti se utilizziamo l’utility appena scaricata attraverso il comando:

tidy04aug00.exe in.html

/

questi ci risponde in questo modo:

Tidy (vers 4th August 2000) Parsing “in.html”
line 3 column 1 – Warning: discarding unexpected
line 5 column 1 – Warning: inserting missing ‘title’ element

in.html: Document content looks like HTML 2.0
2 warnings/errors were found!

HTML & CSS specifications are available from http://www.w3.org/
To learn more about Tidy see http://www.w3.org/People/Raggett/tidy/
Please send bug reports to Dave Raggett care of
Lobby your company to join W3C, see http://www.w3.org/Consortium

/

Ci dice cioè che ha scartato il tag perché in quella posizione non serve a nulla ed ha inserito altre informazioni fino a generare l’output descritto.

Quello che otteniamo, quindi, è una versione riveduta e corretta del nostro codice html.

Proviamo adesso qualcosa di più difficile, scriviamo un nuovo file in2.html dal seguente contenuto:

/

Come vedete una bruttezza ed un’imprecisione difficilmente eguagliabile.

Utilizzando la nostra utility attraverso il comando:

tidy04aug00.exe in2.html

/

otteniamo quasi un miracolo, cioè: una buona sequenza di segnalazioni ed il codice HTML completamente ricostruito:

Tidy (vers 4th August 2000) Parsing “in2.html”
line 4 column 1 – Warning: discarding unexpected
line 5 column 4 – Warning: inserting missing ‘title’ element
line 6 column 9 – Warning: lacks “summary” attribute
line 8 column 79 – Warning: lacks “alt” attribute
line 10 column 13 – Warning: discarding unexpected
line 11 column 1 – Warning: isn’t allowed in elements
line 11 column 1 – Warning: isn’t allowed in elements

in2.html: Document content looks like HTML 3.2
7 warnings/errors were found!

riga della tabella

riga della tabella

The table summary attribute should be used to describe
the table structure. It is very helpful for people using
non-visual browsers. The scope and headers attributes for
table cells are useful for specifying which headers apply
to each table cell, enabling non-visual browsers to provide
a meaningful context for each cell.

The alt attribute should be used to give a short description
of an image; longer descriptions should be given with the
longdesc attribute which takes a URL linked to the description.
These measures are needed for people using non-graphical browsers.

For further advice on how to make your pages accessible
see “http://www.w3.org/WAI/GL”. You may also want to try
“http://www.cast.org/bobby/” which is a free Web-based
service for checking URLs for accessibility.

HTML & CSS specifications are available from http://www.w3.org/
To learn more about Tidy see http://www.w3.org/People/Raggett/tidy/
Please send bug reports to Dave Raggett care of
Lobby your company to join W3C, see http://www.w3.org/Consortium

/

Conclusioni

Naturalmente il codice HTML prodotto da HTML Tidy segue lo standard del W3C, pertanto dovrebbe essere compatibile con i browser più diffusi. Dovrebbe. La collezione di anomalie rispetto agli standard, infatti, è davvero impressionante, pertanto è obbligatorio testare sempre ogni singola componente su tutte le piattaforme di destinazione indicate dal cliente.