Pietro Vischia: h=c=±1=±i=±2
ItalianoEnglish

Layout table-free

Due parole sulla campagna

Guardando il codice sorgente delle pagine della maggior parte dei siti web, si può notare che la loro forma grafica (menu laterali, titoli e così via) è ottenuta inserendo il testo in tabelle, usando il tag <table>. Questa operazione è altamente scorretta, perché consiste nell'utilizzare un tag per uno scopo diverso da quello per cui è stato creato (contenuti tabulari). Neil Crosby, webmaster di www.workingwith.me.uk, ha quindi creato una campagna volta ad usare le tabelle per i dati tabulari, lasciando ai fogli di stile il compito di gestire il layout.
Io ho deciso di aderire a tale campagna, come potete vedere nella sezione "Convalidato!" del menu laterale. Questa pagina dunque riporta una traduzione completa in italiano della pagina in cui Neil spiega i vantaggi di non usare le tabelle per il layout.

Le sette ragioni migliori per evitare l’uso delle tabelle

  1. Usare le tabelle per effetti grafici significa confondere il contenuto con il modo di presentarlo, e ciò rende il consumo di banda del vostro sito più alto del necessario, visto che ad ogni pagina consultata i vostri visitatori dovranno scaricare nuovamente gli stessi dati riguardanti la presentazione.
  2. Ridisegnare lo stile del sito diventa molto più complicato del necessario. Poiché infatti le tabelle possono essere mostrate sullo schermo in una sola maniera, se vorrete cambiare la struttura presentazionale di un sito basato sulle tabelle dovrete agire su ogni tabella in ogni singola pagina del sito, un lavoro nient’affatto divertente. Con un sito interamente basato sui fogli di stile CSS, invece, tutto quello che dovrete fare sarà modificare un solo file CSS.
  3. Le tabelle non aiutano affatto l'accessibilità del sito per utenti disabili. Infatti, benché il vostro layout possa sembrare logico quando mostrato sullo schermo, l’ordine con cui esso sarà letto da, diciamo, un software che acquisisce i dati dalloschermo, potrebbe essere molto differente. Inoltre, molti stati ora hanno delle precise leggi che stabiliscono che i siti internet devono essere accessibili a tutti.
  4. Similmente, le persone che visitano il vostro sito usando PDA, telefoni cellulari e oggetti simili, non hanno lo spazio sullo schermo richiesto dalla vostra lampeggiante grande tabella. Un sito in CSS ben scritto, invece, generalmente sarà scalabile molto meglio per adattarsi a schermi particolarmente piccoli o particolarmente grandi, rispetto ad un layout basato sulle tabelle.
  5. Le tabelle sono decisamente complicate da guardare in codice sorgente. Prima di arrivare a qualunque contenuto sia in esse, infatti, si è già arrivati a tre livelli di indentazione.
  6. Le tabelle possono avere effetti deleteri sull’importanza assegnata al sito dai motori di ricerca. Se infatti state usando una "classica" bassa di navigazione a sinistra, essa nel sorgente HTML sarà piazzata prima del contenuto. Poiché generalmente i Motori di Ricerca assegnano maggiore importanza alle cose più vicine all’inizio della pagina rispetto a quelle lontane, ci sono serie possibilità che il vostro contenuto sia per la maggior parte ignorato dai Motori di Ricerca.
  7. Le tabelle ci mettono più tempo a piazzare ogni elemento al proprio posto rispetto al tempo impiegato da un foglio di stile CSS. Se usate Internet Explorer, avrete notato questo effetto molte volte caricando siti basati sulle tabelle. Mentre la pagina viene scaricata, infatti, Internet Explorer continua a ri-stamparla a schermo, facendo rimbalzare i contenuti avanti e indietro fino al termine dello scaricamento completo, quando finalmente sa dove piazzare ogni cosa...

E dunque, come dovreste scrivere le vostre pagine? Con un markup appropriato alla semantica dei contenuti, ecco come! Il vostro markup non dovrebbe occuparsi di descrivere come mostrare sulla pagina il contenuto, ma solo di descrivere quali sono le differenti parti del vostro documento. I paragrafi saranno dunque contenuti in tags <p>, le liste in tags <ul> e <ol>, e così via. Per ciò che volete muovere nella pagina in funzione del layout, usate i tags <div>. Sicuramente ci sarà una curva di apprendimento, all’inizio, ma non è forse vero che tutto rappresenta un’esperienza istruttiva? A lungo termine, risparmierete tempo e denaro.

Naturalmente, se siete qui, probabilmente sapete già che usare le tabelle per il layout è una cosa da evitare. Forse addiruttura create già il vostro layout senza usare tabelle. E quindi, perché non proclamare al mondo la vostra correttezza e pulizia? Aderite alla campagna "table free"!

Inizio della pagina   ∴   Pagina iniziale

Last site update:
20 Mar 2010, 00.51 (GMT+1)

Sito creato in sorgente
Powered by GNU-Emacs Logo GNU-Emacs

Pagine visitate:
Online:

Dài visibilità al mio sito votandomi sulle top 100: ci metti poco e non ti costa nulla!

Votatemi sulla Heracleum Top Sites
Convalidato!
W3CCSS 3
W3CXHTML 1.0
DIVTABLE FREE

Google logo
Search WWW Search pietrovischia.altervista.org

Creative Commons License
This work is copyright © Pietro Vischia, 2005, and is licensed under a Creative Commons Attribution-NonCommercial-NoDerivs 2.5 License.