Vantaggi e limitazioni di utilizzo di tabelle a pagine Web

May 29

Vantaggi e limitazioni di utilizzo di tabelle a pagine Web


Tabelle in Web design sono più di meno fuori moda, sostituito da layout CSS tableless che utilizzano elementi div, che permettono la personalizzazione completa con meno codice. È possibile progettare il sito web invece si sceglie, a patto che si crea con cura e in modo da massimizzare i benefici delle tabelle più elementi div CSS-strutturato. Quando viene utilizzato in modo non corretto, le tabelle possono limitare le opzioni e impantanarsi tuo sito web.

Struttura

Le tabelle sono l'assoluto nella struttura: c'è una scatola che hai creato, e un certo numero di righe, colonne e celle all'interno di quella scatola. Utilizzando i CSS, è possibile lo stile delle celle singolarmente, consentendo di creare un layout modulare senza il sito web di essere troppo noioso e uniforme. Con le tabelle, è possibile creare griglie perfette (come ad esempio un layout 4-by-4) o utilizzare il codice speciale per rendere le colonne coprono più righe, o viceversa. Questo effetto crea un layout a colonne con più sezioni.

Flessibilità

Tabelle perdono quando si tratta di flessibilità. Che cosa si guadagna nella struttura gestibile, si perde nella capacità di muoversi completamente, la forma e le dimensioni gli elementi. Con elementi div in un layout tableless, è possibile inserire una casella sul lato sinistro dello schermo a 300 pixel di altezza, e l'altro sul lato destro a 400 pixel di altezza, ciascuna indipendente dall'altra e senza bisogno di un sacco di codice aggiuntivo . Con un layout presentato, se la colonna è larga 200 pixel, la creazione di una piazza che è 250 pixel di larghezza diventa un problema.

elementi div hanno anche opzioni CSS specifiche per trattare con contenuto in eccesso - quando qualcosa all'interno dell'elemento è maggiore l'elemento stesso, come ad esempio un'immagine di 400 pixel in un div 300 pixel. Questo tipo di contenuti mal gestita può rompere tutto il tavolo quando è all'interno di una cella.

Codice

I tag di apertura e chiusura per un elemento DIV sono tutto ciò che serve per creare il blocco di contenuti. Tabelle di creare codice più ingombrante, perché i tag HTML devono essere annidati - prima del tag di apertura tavolo, quindi il tag per una riga, poi uno per ogni cella. La quantità di codice necessario per tre celle per un valore di contenuti rispetto a tre elementi DIV è significativamente più, rendendo più difficile da scrivere, più difficile trovare gli errori e anche prendere più tempo per caricare.

Compatibilità

Il grande supporto per le tabelle è che funzionano con qualsiasi browser, mentre alcuni CSS e gli elementi CSS3 non funzionano nei browser più vecchi. Se il vostro sito si rivolge a imprese o organizzazioni che utilizzano i browser più vecchi per motivi di sicurezza, la creazione di un layout con tabelle assicura che il vostro sito renderà esattamente come si desidera guardare per quegli utenti. Con questo metodo, il sito funziona anche nei browser moderni.

layout multipli

Responsive Web Design - in cui il layout risponde alle esigenze del dispositivo del visitatore - richiede CSS. Con un layout CSS, è possibile creare più fogli di stile e dire al browser che da utilizzare con le media query. Questo funziona, perché gli elementi DIV non hanno una struttura intrinseca senza il foglio di stile. Tabelle hanno struttura anche senza styling, rendendoli più difficile da manipolare in più layout.