Il Toolbox e le risorse del sistema a griglia 960
Il sistema Grid 960 è stato creato da Nathan Smith per ottimizzare il flusso di lavoro di sviluppo Web fornendo dimensioni di uso comune basate su una larghezza di 960 pixel.
Il 960.gs (o qualsiasi framework CSS) è stato sviluppato principalmente per la prototipazione rapida, riducendo i compiti ripetitivi e noiosi, ma è anche più che adatto per essere utilizzato per qualsiasi progetto di web design.
Darà al tuo sito una base solida e strutturata su cui costruire e personalizzare il tuo design.
In questo articolo troverai tutorial, una vetrina di siti progettati utilizzando 960.gs, spin off, temi WP di base creati su 960.gs e possibili framework alternativi, se per qualche motivo non ti piace la griglia 960 sistema.
All'interno del pacchetto di download ci sono fogli di schizzo da stampare, layout di progettazione e un file CSS con misurazioni identiche.
Hai due modelli, una griglia di 12 colonne divisa in porzioni di 60 px e una griglia di 16 colonne divisa in 40 px. Ogni colonna ha 10 pixel di margini a sinistra e a destra, che creano grondaie da 20 pixel tra le colonne.
Homepage: 960.gs Homepage .
Scaricare : Scarica il 960.gs .
Demo: Visualizza la pagina dimostrativa 960.gs .
Tutorial 960.gs
960 Framework CSS: impara le basi
Questo è un ottimo tutorial di base per iniziare, scritto da Stefan Vervoort da divitodesign. Ti vengono fornite le basi del caricamento del framework, quindi puoi iniziare a sviluppare velocemente con 960.gs.
Lavorare con 960.gs
Un altro tutorial che illustra le basi dell'installazione di 960.gs, particolarmente utile per i CSS contestati.
Uno sguardo dettagliato al Framework CSS 960
Una volta che hai colto l'occasione per passare un po 'di tempo con 960.gs, rimarrai stupito di quanto tempo possa potenzialmente essere salvato durante lo sviluppo dei tuoi progetti web.
Prototipazione con il framework CSS Grid 960
Questo articolo copre l'intero processo di prototipazione, spiega le basi di Grid 960, pianificando la griglia per un progetto e codificando il prototipo. Così veloce.
Crea un tema per i giornali con WP_Query e il Framework CSS 960
Questo tutorial ti insegnerà come usare WP_Query per creare un tema di giornale a 3 colonne che abbia tutti i tuoi post principali del blog nella colonna principale, e a lato una serie di post di una categoria selezionata. Usando il framework CSS 960 per il layout e il resto del tema, ti viene mostrato come ciò acceleri notevolmente la tua produttività.
Crea un nuovo blog sul tema della griglia 960
Questo tutorial ti insegna a prendere in giro un tema blog in Photoshop progettato per essere utilizzato all'interno del framework 960. Questo tutorial è stato progettato più per la teoria del web design che per la tecnica di Photoshop, ma dedica molto più tempo alla teoria e all'applicazione del design.
960 Spin Offs
Typogridphy - Un framework CSS tipografico e con layout a griglia
Typogridphy è un framework CSS creato per consentire ai web designer e agli sviluppatori front-end di codificare rapidamente layout di griglia tipograficamente piacevoli. Ti permette di creare layout di griglia che sono versatili e attraenti, convalida i rigorosi xHTML e CSS. Utilizza anche un metodo tipografico noto come "creazione del ritmo verticale" , in cui tutte le righe di testo adiacenti si allineano orizzontalmente, indipendentemente dalle interruzioni di riga e dai nuovi paragrafi.
Demo: Demo di Typogridphy
Overture - Fluid 960 Grid System 1.0
Sviluppato da Stephen Bau da Design7 , ha creato una libreria di elementi HTML comunemente usati, combinandoli con i CSS per la tipografia e il layout e aggiungendo alcuni effetti di base dalle librerie JavaScript più diffuse (principalmente MooTools). Al momento del download è possibile scegliere tra tre modelli: larghezza fissa di 960 px , larghezza del fluido di 12 colonne o larghezza del fluido di 16 colonne . Questi modelli sono fantastici, devi vedere i dettagli per crederci.
Demo: Demo di Overture .
vetrina
Tutti i bellissimi siti sottostanti sono stati costruiti utilizzando il sistema di griglia 960:
Temi di WordPress
Proprio come i 960.gs attuali, questi temi WP sono virtualmente senza stile e con funzionalità di base, ma sono stati creati utilizzando la 960.gs. Molto utile per qualsiasi sviluppatore WP.
5 anni di tema WordPress
Un tema WP di base creato utilizzando 960.gs.
Tema WordPress 960bc
Il tema 960bc è essenzialmente una tela bianca con uno stile minimo e nessuna immagine basata sul sistema a griglia 960 (solo 12 colonne) per gli sviluppatori di WordPress che desiderano lavorare all'interno di un layout basato su una griglia tradizionale.
Possibili alternative
Scegliere un framework CSS può essere difficile, se il 960.gs non è adatto a te, forse potresti provare alcuni dei framework qui sotto.
Cianografia: una struttura CSS
Blueprint è un framework CSS, che mira a ridurre il tempo di sviluppo CSS. Ti offre una solida base CSS per costruire il tuo progetto, con una griglia facile da usare, una tipografia sensibile e persino un foglio di stile per la stampa. È molto meno gonfiato rispetto al framework YUI ed è probabilmente alla pari con 960.gs in termini di facilità d'uso.
CSS-Boilerplate
Da uno degli autori di Blueprint. Ha creato una struttura ridotta che fornisce gli elementi essenziali per iniziare qualsiasi progetto. Questo quadro è leggero e si sforza di non suggerire convenzioni di denominazione non semantica.
Elementi: un framework CSS Down to Earth
È stato progettato per aiutare i designer a scrivere CSS in modo più rapido ed efficiente. Gli elementi vanno oltre il semplice essere un framework, è il proprio flusso di lavoro del progetto. Ha tutto il necessario per completare il tuo progetto.
WYMstyle - CSS framework - Panoramica
Lo scopo di questo progetto è di fornire una serie di file CSS modulari ben testati, che possono essere utilizzati per la progettazione rapida di siti Web.
Ancora un altro layout a più colonne | YAML
"Yet Another Multicolumn Layout" (YAML) è un (X) HTML / CSS framework per la creazione di layout float moderni e flessibili. La struttura è estremamente versatile nella sua programmazione e assolutamente accessibile per gli utenti finali.
CleverCSS
CleverCSS è un piccolo linguaggio di marcatura per CSS ispirato a Python che può essere usato per costruire un foglio di stile in modo pulito e strutturato. In molti modi è più pulito e più potente dei CSS2.
sparkl CSS Framework
Sparkl combina markup POSH, CSS Bulletproof e JavaScript non intrusivo in un unico framework di sviluppo web facile da usare che rende semplice la creazione di siti Web a prova di proiettile conformi agli standard web. Utilizza una struttura modulare, che consente di utilizzare ciò di cui si ha bisogno e di escludere ciò che non si fa.
L'interfaccia grafica di jQuery CSS
Interfaccia utente di query include un solido framework CSS progettato per la creazione di widget jQuery personalizzati. Il framework include classi che coprono una vasta gamma di esigenze di interfaccia utente comuni e possono essere manipolate utilizzando ThemeRoller UI jQuery. Costruendo i componenti dell'interfaccia utente utilizzando l'interfaccia utente di jQuery CSS Framework, si adottano convenzioni di markup condivise e si facilita l'integrazione del codice nella comunità di plug-in in generale.
Scritto esclusivamente per WDD da Paul Andrew da Speckyboy.com
Utilizzi la 960gs per i tuoi siti web? Quali sono i principali vantaggi? Ci piacerebbe sentirti ...