Salta il menu

Codice valido

Notizia del 08/01/2007

Esiste questa mania dei bollini che mi vede parecchio scettica: un sacco di webmaster sono convinti che appiccicare un bollino in calce alle loro pagine sia indice di buona qualità, ma non è proprio così.

Quando scrivo una pagina di codice devo seguire delle regole sintattiche dettate dal W3C, l'organo internazionale che si occupa di stilare la "grammatica" dei linguaggi per il web.

Lo stesso organo mette a disposizione dei validatori - strumenti molto utili - che servono al webmaster a verificare di non essere incappato in errori grossolani nello scrivere il codice: tag aperti e non chiusi, annidamenti sbagliati etc.

Il codice però può essere usato "correttamente" in modo sbagliato, che sembra un controsenso, ma non lo è: se io scrivo un menu di navigazione in questo modo:

<table style="font-weight: bold; color: red;"> <tr> <td style="text-align: center; font-size: 150%;"><a style="text-decoration: none; color: black; href="http://www.yahoo.it">Yahoo</a></td> <td style="text-align: center; font-size: 150%;"><a style="text-decoration: none; color: black; href="http://www.google.it">Google</a></td> <td style="text-align: center; font-size: 150%;"><a style="text-decoration: none; color: black; href="http://www.virgilio.it">Virgilio</a></td> </tr> </table>

il validatore lo accetterà, ma il mio codice sarebbe stato molto più leggero, pulito e semanticamente corretto se lo avessi scritto in questo modo:

<ul id="menu"> <li><a href="http://www.yahoo.it">Yahoo</a></li> <li><a href="http://www.google.it">Google</a></li> <li><a href="http://www.virgilio.it">Virgilio</a></li> </ul>

Nel primo caso il contenuto vero e proprio (Yahoo - Google - Virgilio) si perde in mezzo a un sacco di altra roba inutile; nel secondo caso inserisco solo gli elementi indispensabili: i tag corretti (trattandosi di una lista di link uso l'elenco puntato) che forniscono tra l'altro un'indicazione allo spider e un id che mi permette di esportare tutta la formattazione nel css esterno; il giorno in cui deciderò di modificare l'aspetto al sito non dovrò darmi la pena di cambiare a mano tutti quei "color: red" in qualcos'altro, accorciando notevolmente il lavoro e dandomi la sicurezza che non me ne sono dimenticata neanche uno.

Altro esempio (per semplicità ometto la formattazione):

<table> <tr> <td><p>Panorama</p></td> <td><img src="foto01.jpg" alt="" /></td> </tr> <tr> <td><p>Marina</p></td> <td><img src="foto02.jpg" alt="" /></td> </tr> <tr> <td><p>Monti</p></td> <td><img src="foto03.jpg" alt="" /></td> </tr> </table>

Se un navigatore visita questa galleria fotografica senza visualizzare per scelta (connessione lenta) o per necessità (browser testuale o vocale) le immagini, non saprà mai cosa gli sto mostrando, infatti né il nome della foto, né l'alt usato mi danno indicazioni utili; inoltre la didascalia è davvero risicata e inserita in una cella diversa rispetto alla foto stessa, quindi una volta linearizzata la tabella (un browser testuale non mostra tabelle), non saprò più a cosa si riferisce l'una piuttosto che l'altra e chiunque abbia bisogno di certi accorgimenti - ad esempio il testo sostitutivo delle immagini - si sentirà preso in giro se in una pagina con tanto di bollino in fondo troverà un "alt" inutile.

Codice corretto, sempre usando una tabella:

<table id="galleria_fotografica"> <tr> <td><p>Verona - inverno</p> <img src="piazza_dei_signori.jpg" alt="Piazza dei Signori a Verona al tramonto sotto la neve" /></td> </tr> <tr> <td><p>Capri - I faraglioni</p> <img src="faraglioni_di_capri.jpg" alt="Forte tempesta che si abbatte sui faraglioni di Capri" /></td> </tr> <tr> <td><p>Cortina - Il Cristallo</p> <img src="monte_cristallo.jpg" alt="Una foto del Monte Cristallo visto da Cortina da dietro il vetro di una finestra" /></td> </tr> </table>

Codice validabile in tutti e quattro gli esempi, ma nel primo e nel terzo caso la validazione non è sinonimo di qualità o comunque di un servizio migliore al navigatore, anzi generalmente offre al webmaster una falsa sicurezza di aver fatto un buon lavoro, mentre così non è!

La validazione del codice è solo il primo passo per creare delle buone pagina, ma per offrire un servizio veramente degno di un professionista è indispensabile la cura dei particolari: in questo modo non ci sarà bisogno di esporre un bollino, ma i navigatori stessi si accorgeranno di quant'é leggera la pagina che stanno scaricando oppure di come è navigabile il nostro sito.

Altro punto che spesso crea confusione: il sito dev'essere validato pagina per pagina e ogni volta che vi si apportano modifiche; inoltre non è affatto indispensabile usare lo stesso linguaggio in tutto il sito, ma ogni pagina fa storia a se: l'importante è che il linguaggio dichiarato all'inizio della pagina sia poi quello effettivamente usato. Spesso invece si tende a piazzare un bollino nella home già durante la creazione del template e poi a lasciarvelo indipendentemente dai contenuti, col rischio che prima o poi un navigatore controlli, trovando molto probabilmente degli errori che faranno in modo che la dichiarazione data dal bollino ci si "rivolti contro".

No: i bollini solo se sono obbligata per qualche motivo, altrimenti preferisco concentrarmi sulla sostanza!

Commenti

Non ci sono ancora commenti a questa news!

Aggiungi il tuo commento

I campi con * sono obbligatori.

Torna a inizio pagina