Quando si sviluppa un sito oltre a vederne il risultato con i principali browser è buona norma uilizzare uno strumento di validazione.
Spesso i browser ignorano molti errori e cercano di risolverli durante il caricamento delle pagine.
Nel risolvere i problemi di tag di chiusura mancanti o altro danno dei buoni risultati ed è forse questo uno dei motivi per cui ci si dimentica di passare al setaccio il codice html contenuto nel proprio sito con uno strumento di validazione.
Il consorzio W3C offre davvero tanti servizi utili agli sviluppatori web tra cui il "Markup Validation Service".
Se provate ad utilizzarlo vi accorgerete di quante inesattezze puo' essere composto il vostro codice html.
In questi giorni ho provato a validare byman.it ed ho scoperto circa 200 errori e non ricordo quante decina di warning.
Un bel respiro profondo e via alla ricerca degli errori....
Per fortuna molti errori erano ripetitivi, quindi bastava risolverne uno per eliminarne tanti.
Gli errori più difficili da risolvere li ho trovati nell'html per la visualizzazione degli oggetti flash.
Il codice html comunemente usato è composto da due tag <object> e <embed>, quest'ultimo non è un tag html standard, è nato con netscape ed alcune versioni di browser come firefox lo usano.
Dopo diverse ricerche sui forum specializzati ho finalmente trovato un'interessante soluzione in javascript che supera il controllo di validazione : SWFObject.js .
Nota: La versione che utilizzo al momento è la 1.5 ma nel momento in cui vi scrivo so che l'ultima versione disponibile è la 2.2.
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<div id="FlashLogo" style="text-align:center;"></div> <script type="text/javascript"> var fo = new SWFObject("/common/flash/byman_logo_148x118.swf", "FlashLogo", "148px", "118px", "8,0,0,0"); fo.addParam("quality", "High"); fo.addParam("scale", "ExactFit"); fo.addParam("wmode", "Transparent"); fo.addParam("play", "true"); fo.addParam("loop", "false"); fo.addParam("menu", "false"); fo.addParam("allowfullscreen", "false"); fo.addParam("allowscriptaccess", "sameDomain"); fo.write("FlashLogo"); </script> |
Finalmente il sito byman.it ha superato il test di W3C Validation sia per html4 che html5.
Per quanto riguarda il tag HTML5, l'unica cosa utilizzata al momento sul mio sito è l'attributo "placeorder".
Sto utilizzando il doctype html 5 per i seguenti motivi :
- Imparare a non utilizzare codice che in html 5 verrà considerato un errore mentre in html 4 è accettato o genera solo warning.
- Cominciare a testare la nuova versione html5
- Verificare man mano come si comportano le ultime versioni di browser nel trattare codice html 5
Prima di effettuare un controllo di validazione con html 5 ho ripulito tutti gli errori e warning dell'html 4. Ho notato che moldi errori durante la validazione dell'html 5 erano dovuti agli attributi di formattazioni inseriti direttamente all'interno dei tag senza l'uso degli stili.
Ad esempio align="center" in html 5 causa un errore è va sostituito con style="text-align:center;".
Dopo che il w3c validator mi ha confermato che byman.it è compliant sia con html 4 che 5, mi ha suggerito di validare il CSS e dopo un "giro di macinino" ho scoperto un bel po di errori CSS da risolvere...
...to be continue..
- Validate byman.it using the "W3C Validator"
CONGRATULATION
The document located at http://www.byman.it was successfully checked as HTML5. This means that the resource in question identified itself as "HTML5" and that we successfully performed a formal validation using an SGML, HTML5 and/or XML Parser(s) (depending on the markup language used).
1
|
<!DOCTYPE html>
|
1 2 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
BROWSER SHOTS
Per finire vi segnalo un sito interessante, Browser Shots, dove è possibile fare un test di compatibilità della vostra home page su più di 50 versioni browser. In pratica dopo aver immesso la url del vostro sito e scelto su quali versioni di browser simulare la compatibilità, il sistema vi propone le immagini del vostro sito viste dalle varie versioni di brower.
