Calendari per il web: tabelle o liste?
Venerdì 20 Aprile 2007 - 09:24
di Alessandro Fulciniti
Ho trovato di recente The Simplest Semantic Calendar 0.9, un modo per realizzare calendari con liste ordinate e CSS, di cui riporto uno screenshot:
Ora, non è la prima volta che mi capita di trovare una
soluzione simile (ricordo ad esempio Unordered List Calendar) ma ho più di un dubbio su approcci di questo tipo.
Il fatto è che siamo così abituati a non considerare le tabelle che le evitiamo anche quando forse sarebbero la soluzione più adeguata e logica. Un calendario è imprescindibile dalla sua struttura, che non dovrebbe essere veicolata esclusivamente mediante i CSS: vi invito a consultare i due esempi citati in assenza di fogli di stile e cercare di capire in che giorno cade una tale data. C’è da sottolineare poi che un calendario codificato con tabella, se linearizzato, presenta l’ordine dei contenuti naturale, proprio come una lista.
Due interessanti opinioni in merito alla marcatura dei calendari si possono trovare in Calendar Semantics: table or list
e Describing a semantic calendar. Entrambi gli articolo concludono che la soluzione migliore per la marcatura di un calendario è l’uso delle tabelle. Tra i commenti del primo post, un’interessante riflessione: usare le liste è accettabile solo se non vengono indicati i giorni della settimana. E voi, che ne pensate?
Categoria: Web Standards | Permalink
Commenti
1
In molti casi siamo passati da un uso indiscriminato delle tabelle ad un uso eccessivo dei DIV.
Bisogna trovare un equilibrio: nessuno ha mai detto che le tabelle devono uscire dal panorama dello sviluppo web. Vanno usate quando necessario. E nella strutturazione di un calendario sono necessarie.
Usare i DIV per un calendario, per me, è un errore simile a quello che si commette quando si vuole includere il layout dentro una tabella.
le tabelle servono per “intabellare” dati. punto.
2
Credo che in generale quando una tabella è la soluzione più corretta per rappresentare un certo tipo di contenuti(dal punto di vista semantico) è abbastanza inutile cercare di sostituirla con qualcos’altro per poi renderlo visivamente uguale alla tabella tramite i Css, a meno che ci sia un reale vantaggio per l’accessibilità e l’usabilità del contenuto stesso mantenendo valida la struttura semantica.
Volevo segnalare a tal proposito questo articolo: http://diegolamonica.info/tuto......php?id=10 dove con le liste e i css si ottiene un calendario semanticamente valido, accessibile(forse maggiormente che con una tabella) e visivamente gradevole.
Nell’esempio le informazioni aggiuntive per la navigazione interna al calendario se inserite in una tabella e visualizzate senza css avrebbero reso il calendario stesso meno accessibile.
Che ne dite?# - postato da Paolo - 20 Aprile 2007 - 11:09
3
Quando ho visto i primi esempi di calendari realizzati senza tabelle ho avuto gli stessi dubbi.. secondo me una tabella è ancora la soluzione migliore.
Inutile volere a tutti i costi un codice tableless, si rischia di esagerare nel senso opposto.
4
Sono assolutamente a favore della soluzione di diego lamonica per il calendario accessibile; non credo che una tabella, linearizzata, avrebbe reso alla stessa maniera.
@ saibal: la dimostrazione l’abbiamo avuta.
@ tom: se sostieni che si possa esagerare nel senso opposto, allora posso dirti che da quando conosco i css (saranno 5-6 anni), difficilmente ho trovato una maniera di ottenere con le tabelle quello che si può realizzare con essi. Semmai il contrario.
Diciamo la verità: fa comodo affidarci ai programmi che se la “vedono loro” per realizzare una pagina. E’ questo concetto, secondo me, che deve sparire. Scriviamo il markup che ci serve il css per presentarlo. Rcordiamoci che oltre il 90% dei siti presenti in rete nun se pò guardà (per il codice).
Sto aspettando sempre il giorno in cui un browser nn visualizzi nulla se le tabelle sono state usate per impaginare. Pura utopia, lo so, ma la speranza…
Sciao!
5
Anch’io aborro questo ricorso talebano ai div o alle ul per rappresentare dati che sono implicitamente, naturalmente tabellari, come un calendario.
# - postato da paperogiallo - 20 Aprile 2007 - 12:37
6
@Floyd: l’esagerazione nell’utilizzo di div e CSS esiste.. e te lo dico come persona da sempre interessata agli standard del w3c, non vorrei essere frainteso. Non ritengo sensato usare i CSS a tutti i costi quando per i dati tabellari è già pronta una soluzione.
Come scritto da Alessandro nell’articolo, se si visualizza il calendario dell’esempio senza CSS leggerlo diventa molto più difficile.
7
Ok, però la soluzione di Diego Lamonica non fà uso di div generici e senza valore semantico, c’è una bella differenza fra l’elemento div e l’elemento ul.
Non è una gara a chi sa usare menglio i css, nessuno ha detto che le tabelle vanno abolite.
Siamo sicuri che un calendario che deve rimandare a degli eventi sia rappresentabile solo ed esclusivamente con una tabella?# - postato da Paolo - 20 Aprile 2007 - 15:26
8
Guardando le statistiche del mio sito mi sono reso conto che c’erano dei refer(r)er che venivano da questa url e guardando tra i commenti ho trovato una discussione relativa al calendario accessibile e riprodotto senza tabelle che ho proposto in un mio tutorial [1].
In effetti, come già hanno detto gli altri, la mia soluzione non è volta a dire: “Deprechiamo le tabelle, rivalutiamo i div, esaltiamo gli elenchi puntati!“. Le domande che mi sono posto quando ho redatto il tutorial sono state:
- E’ possibile costruire un calendario che sembri una tabella pur non essendolo, e mantenere il suo valore semantico?
- Visto che opera-mini[2] mi mostra la simulazione di rendering su un browser su dispositivo-mobile, e le tabelle vengono linearizzate, quale soluzione posso adottare per dare comunque una valida resa che sia accessibile come lo è una tabella?
- Quale rappresentazione posso adoperare per avere la massima accessibilità dell’informazione a prescindere dalla modalità fruizione(Browser moderni, browser datati, screen reader, dispositivi mobili)?
Ed ancora, visto che molte persone hanno sempre detto che fare accessibilità è limitare la qualità del web, io al contrario dico che vuol dire migliorare la qualità delle informazioni e mettere a punto al creatività della persona. Tutti i tutorials che troverete sul mio sito sono un ingegno di creatività e di semplicità. E vogliono essere l’esatta dimostrazione che fare un web accessibile oltre che essere possibile è anche divertente!
Per tornare all’esempio proposto in questo post, disabilitando i CSS ho notato una situazione poco piacevole. Il calendario perde completamente di significato e ci sono informazioni senza significato semantico ed informazioni ridondanti.
Grazie a tutti quelli che hanno apprezzato il mio tutorial e grazie a coloro che sapranno criticare in modo costruttivo la soluzione da me presentata. ;)
[1] Calendario senza tabelle? Da oggi è possibile
[2] Opera Mini Simulator# - postato da Diego La Monica - 21 Aprile 2007 - 09:31
9
Ho provato a guardare la soluzione proposta senza stili, cosa mi rappresentano, semanticamente, la lista
- Su
- Mo
- Tu
- We
- Th
- Fr
- Sa
che si trova prima di ogni mese? Come faccio a capire che giorno della settimana corrisponde al primo maggio?
Un calendario, dal punto di vista concettuale, può essere visto sia come semplice elenco di date associate a giorni della settimana (l’esempio proposto non mi pare che lo sia), sia come tabella in cui le colonne rappresentano i giorni della settimana mentre le righe rappresentano le settimane (l’esempio appare esserlo solo con i CSS).
# - postato da Gianluca - 22 Aprile 2007 - 11:55
10
Carino