Frustrato con la qualità dei modelli CSS gratuiti online, ma non è abbastanza al livello di costruire il tuo? Stanco di passare ore a cercare di personalizzare i design pre-fab lame?
Oggi vi presentiamo oltre settecento modelli CSS scaricabili gratuitamente che si concentrano sul fornire solo un layout di base su cui basarsi. Utilizzando questi layout cross-browser puoi evitare infiniti problemi di posizionamento CSS e concentrarti su ciò che sei bravo a: design.
Per chi sono questi?
Molti di voi sono nel gioco del design da anni ma solo ora stanno appena iniziando a creare siti Web e li codificano a mano. Hai abbastanza competenze di Photoshop per scovare un bel design e abbastanza conoscenza base di CSS per rendere il testo più carino.
Tuttavia, il problema più grande che possono incontrare molti nuovi sviluppatori è semplicemente quello di far funzionare il layout di base in CSS. Il posizionamento con i CSS può essere molto più complicato rispetto allo stile di base, specialmente quando si inizia a utilizzare più browser. Se non sei sicuro di come risolvere un problema, le ore di perfezionamento possono portarti indietro dove hai iniziato, immensamente frustrato e disperato per un piccolo aiuto.
I semplici layout scaricabili di seguito ti forniranno una solida base su cui costruire i tuoi siti e fornirti ottimi esempi per imparare a crearne di tuoi.
Perché non i modelli completi?
Se esegui una rapida ricerca su Google per i modelli CSS gratuiti, ne troverai un milione. Tuttavia, la maggior parte di questi non è l'ideale per gli sviluppatori Web reali che intendono creare siti unici. Quello che ottieni in genere è qualcosa del genere:
Modelli come questo ti costringono davvero in un brutto disegno prestabilito che devi seguire o passare ore a separare per provare e personalizzare. Alla fine sarebbe stato più semplice codificarlo da zero!
Penso che sia molto più utile scaricare alcuni layout CSS super base che siano il più semplici possibile. Ciò consente di prototipizzare rapidamente il layout per una pagina senza sprecare metà giornata ordinando il codice che non è necessario. Il layout tipico di questa categoria è più simile a questo:
Qui non abbiamo testo o immagini da buttar via, è solo uno scheletro pronto per essere riempito. Dai un'occhiata alle fantastiche risorse qui sotto per trovare tutti i modelli di layout di base di cui avrai mai bisogno!
CSS primario: 22 layout
"Primario è un semplice framework CSS, progettato per sviluppatori e progettisti per rendere l'uso dei CSS il più semplice possibile.
Scatole piccole: 16 layout
Una raccolta interessante di quattro layout di base eseguiti attraverso una serie di metodi diversi.
CSS facile: 8 layout
Una raccolta di quattro layout fissi e quattro fluidi finalizzati a insegnare le basi del posizionamento CSS.
Max Design: 25 layout
Una solida raccolta di modelli di base super molti dei quali hanno tutorial che ti accompagneranno in modo da imparare come è fatto.
Iron Meyers: 224 layout
Sicuramente una delle migliori risorse della lista. Questo sito contiene 56 layout di base, ciascuno con quattro versioni: 100% fluido, 974px, 950px e 750px.
Dynamic Drive: 47 layout
Questi layout CSS sono suddivisi in quattro categorie: due colonne, tre colonne, layout fissi, layout liquidi e frame CSS.
Intensivstation: 16 layout
Una piccola ma utile raccolta di layout XHTML 1.0 e CSS2.
BlueRobot: 3 layout
Solo tre modelli qui, ma sono layout solidi e popolari che ti consigliamo di verificare se hai bisogno di qualcosa di base.
Matthew James Taylor: 7 layout
? No hack CSS. SEO amichevole. Nessuna immagine. Nessun JavaScript. Cross-browser e iPhone compatibili.? Questi layout hanno anche un sacco di documentazione per iniziare.
CSS gratuito: 252 layout
Un enorme 252 layout CSS che sono sicuri di iniziare sulla strada giusta. Veloce da scaricare e facile da personalizzare!
Code Sucks: 95 Layouts
Code Sucks ha un'impressionante collezione di layout scaricabili gratuitamente con 53 versioni a larghezza fissa e 42 versioni di finte colonne. I layout di colonne di Faux usano un'immagine di sfondo per far sembrare che le colonne di sinistra e di destra siano di uguale altezza e indipendenti l'una dall'altra.
Conclusione
Distruggere i layout di cui sopra dovrebbe insegnarti tantissime cose sul posizionamento dei CSS in un modo molto più pratico rispetto alla lettura di tre libri su CSS. Assicurati di non solo implementare questi modelli, ma di dare veramente un calcio alle gomme e modificare i numeri per vedere come funzionano.
Lascia un commento qui sotto e facci sapere se hai trovato utile questo post. Assicurati inoltre di condividere qualsiasi altra grande risorsa che usi per i layout CSS di base!