ISSN 1722-375X
[Vai al menu di navigazione principale]


Home > Tutorial > Css vs table > CSS e tabelle a confronto

[Vai al piè di pagina]

CSS e tabelle a confronto

In questo articolo, dopo una breve introduzione sul perchè sia errato utilizzare le tabelle per impostare la grafica di un sito web, saranno messi a confronto i vantaggi e gli svantaggi dei CSS con i vantaggi e gli svantaggi delle tabelle.

Tra contenuti e forma

Agli inizi, quando Internet era usato come mezzo di comunicazione fra scienziati e ricercatori, il contenuto informativo era l'aspetto più importante della pagina web. Per aiutare i ricercatori a riportare in maniera organizzata dati sperimentali, furono create le tabelle che, per loro stessa natura, servivano a intabellare dei dati, basti pensare al tag <td> dove l'acronimo td sta per table data.

Le tabelle sono però in grado di contenere molti tipi di informazioni, non solo parole e numeri, come immagini e altre tabelle. Tra i webmaster si diffuse dunque la cattiva abitudine di utilizzare le tabelle per la realizzazione del layout di un sito, tradendo quello che era lo scopo della loro creazione. Annidando tabelle dentro tabelle è possibile realizzare impaginazioni più o meno complesse. La cosa andò peggiorando con l'introduzione di software per la realizzazione di pagine web del tipo WYSIWYG (What You See Is What You Get: ciò che vedi è ciò che otterrai) che si basano quasi esclusivamente sull'uso delle tabelle. Il webmaster si trova di fronte a un'interfaccia grafica e "disegna" il layout del sito senza accorgersi che il software sta creando un codice che, nella migliore delle ipotesi è ridondante e disorganizzato, nella maggior parte dei casi risulta anche errato. Si ottengono così pagine pesanti (in termini di dimensione dei files) e lente da scaricare ed elaborare, spesso non utilizzabili da dispositivi come i PDA ovvero da utenti non vedenti che utilizzano screen reader, solo per fare alcuni esempi. Si pensi ad esempio ad utenti che utilizzano browser vocali o a linea di testo. Il testo sarà letto dall'inizio alla fine nell'ordine in cui compare nel codice, ed essendo il contenuto informativo indissolubilmente mescolato al codice per la grafica capita spesso che l'ordine in cui sono lette le informazioni non sia corretto.

Per garantire una completa accessibilità dei contenuti, la grafica deve essere separata dal testo, le tabelle devono intabellare.

Per fornire un'impaginazione ai contenuti esiste una apposita tecnica, quella dei CSS (Cascading Style Sheets: fogli di stile a cascata), di cui ora mostreremo i vantaggi.

CSS Vs <Table>

I vantaggi dei CSS

Gli svantaggi dei CSS

I vantaggi delle tabelle

Gli svantaggi delle tabelle

Un cambiamento di filosofia

Il confronto fra CSS e tabelle, che vede quest'ultime inequivocabilmente sconfitte, evidenzia la necessità di un cambiamento nel concepire la realizzazione della pagina web: prima vengono i contenuti e la loro organizzazione strutturata, poi si realizza uno o più CSS che istruiscano il browser su come presentare le informazioni. La vecchia tecnica, disegno una griglia con le tabelle e realizzo la grafica e in seguito ci mescolo i contenuti appartiene al passato e non può più condurre in nessun luogo.

Progettare con i CSS, realizzando pagine standard (magari in XHTML) significa progettare per il futuro, senza però trascurare il passato: una pagina (X)HTML standard + CSS standard è accessibile con tutti i dispositivi per la navigazione nel web. Certo, i browser più datati richiederanno CSS specifici, magari più semplici, ma ottenere la stessa grafica su tutti i dispositivi/browser non è possibile e neppure utile. Un sito indipendente dal browser è quello in grado di presentare correttamente i contenuti su tutti i browser, non quello che ha la stessa grafica su IE e NN.

Commenti sull'articolo

G.T. -- ultima revisione: 15.09.2002

File correlati

Articoli correlati:


Strumenti



l'indirizzo di questa pagina è: http://www.constile.org/tutorial/css_vs_table/index.php