Super Mario
Giocare a Super Mario online
20 aprile 2009
Gmail: suggerisci altri destinatari
Nuove funzionalità dai Labs di Gmail: suggerisci più destinatari
22 aprile 2009
Mostra tutto
Css Grid Builder

Css Grid Builder

Ogni volta che si inizia un nuovo sito o un nuovo progetto ci si trova ad affrontare i soliti, importantissimi problemi. Un errore di valutazione o una semplice svista in questa fase potrebbero in futuro costare cari, in termini di prestazioni, tempo e (di conseguenza) denaro. Fortunatamente molti servizi online ci aiutano nelle attività più ripetitive, che spesso nascondono queste insidie piccole ma pericolose.

Un ottimo framework per la generazione di applicazioni web ci viene fornito dalla Yahoo! User Interface Library (YUI). Nello specifico illustriamo Grids CSS, che nella YUI CSS foundation si occupa di fornire template per layout facilmente customizzabili.

I template hanno caratteristiche molto particolari ed interessanti:

  • sono facili da personalizzare
  • sono completamente table-less, perché sono tutti realizzati a DIV senza fare uso di tabelle
  • l’ordine di visualizzazione delle colonne è indipendente dall’ordine con cui sono presenti nel codice, fatto molto importante se si vuole ottimizzare l’indicizzazione dei motori di ricerca (SEO) e l’ accessibilità
  • il footer si piazza automaticamente  in fondo alla pagina, indipendentemente dalla colonna più lunga (self-clearing footer)
  • supportano il grado A di compatibilità con i browser, ovvero si applicano i principi di Progressive Enhancement e Graceful Degradation: si migliora progressivamente il supporto verso le nuove implementazioni dei vari browser mentre si lascia decadere il supporto verso i browser più datati; mira a soddisfare il 96% dell’utenza web
  • sono compatibili con gli standard più evoluti e superano la validazione W3C con doctype strict
  • le larghezze sono facilmente impostabili, layout con dimensioni inferiori al 100% della pagina vengono automaticamente centrati

È disponibile inoltre un fantastico tool per costruire interattivamente il proprio layout sfruttando questo framework CSS, il CSS Grid Builder. Bastano pochi click per ottenere il proprio layout personalizzato valido w3c, cross browser e perfettamente testato!

Utilissimo e molto comodo è il sito di Myers, che propone una vasta scelta di layout generati sfruttando Grids CSS, tutti senza fare uso di tabelle e validi con doctype strict del W3C.

Sono disponibili layout a due, tre, quattro colonne di varie misure e proporzioni, fissi e fluidi. Il file zip di ogni layout contiene:

  • un file HTML con la struttura del sito
  • un file base.css con il foglio di stile specifico
  • il css di reset che serve a rimuovere da ogni elemento HTML le “tare ereditarie” di ogni browser

Lascia una risposta

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *