20 fantastici modelli e temi reattivi (gratuiti e premium)
Il web design reattivo è di gran moda in questo momento, ma come designer a tempo pieno è difficile trovare il tempo per cogliere nuove tendenze, non importa quanto possano essere utili e forse necessarie.
Temi e modelli predefiniti offrono un modo rapido e semplice per iniziare con un design web reattivo. Molti di loro fanno tutto il lavoro per te e forniscono un semplice flusso di lavoro plug and play, altri si occupano solo del sollevamento pesante occupandosi delle richieste dei media e ti danno il controllo completo sul design. Questo post contiene 20 modelli gratuiti e premium, tutti immediatamente pronti a rispondere.
Layout reattivo: moda o necessità?
Ultimamente ci sono state molte discussioni sul responsive web design. Molti lo salutano come il futuro del web design e arrivano addirittura a dire che semplicemente non stai facendo il web design nel modo giusto se i tuoi siti non sono conformi alla loro formula specifica per la massima compatibilità. Altri sostengono che questo è solo un altro giocattolo in una lunga serie di mode che vanno e vengono.
La risposta è probabilmente da qualche parte tra i due. La verità è che il web design ha davvero colpito un grosso ostacolo con la ricchezza di schermi di dimensioni diverse che ora accedono regolarmente al web. Molti siti non possono permettersi di tralasciare grandi porzioni di utenti mobili, né possono creare siti personalizzati perfettamente adattati a tutti gli smartphone, tablet, laptop e desktop presenti sul mercato.
Il responsive design, che si tratti di tendenza o meno, è attualmente la migliore risposta a questo problema. Se le richieste dei media falliscono, sarà semplicemente perché è arrivata una soluzione migliore, non perché il problema cessi di essere importante.
Non posso dire come svilupperemo siti tra dieci anni, ma puoi scommettere che le dimensioni dello schermo continueranno a diventare più frammentate dal momento che tutto ciò che con una batteria o una spina sta rapidamente diventando in grado di accedere al web. Se definiamo il web design "reattivo" come un insieme di tecniche utilizzate per garantire la massima compatibilità su quanti più dispositivi possibile, allora non stiamo sicuramente osservando una moda passeggera ma lo standard attuale e futuro per i professionisti del nostro settore.
Alcuni si lamentano dello sforzo aggiuntivo e del tempo di sviluppo, ma in realtà non è così male come potresti pensare e una volta che lo hai tirato fuori un paio di volte, l'impatto sul tuo flusso di lavoro può essere abbastanza minimo. Gli strumenti in questo post lo rendono ancora più veloce, togliendo la maggior parte della pressione da te quando si tratta di elementi reattivi.
20 modelli e temi reattivi
Yoko - Temi WordPress 3.1+ HTML5 / CSS3 gratuiti
“Yoko è un tema WordPress moderno e flessibile. Con il layout reattivo basato su query multimediali CSS3, il tema si adatta alle diverse dimensioni dello schermo. Il design è ottimizzato per schermi desktop di grandi dimensioni, tablet e schermi di piccoli smartphone. Per rendere il tuo blog più individuale, puoi utilizzare i nuovi formati di post (come galleria, a parte o citazione), scegliere il tuo logo e l'immagine dell'intestazione, personalizzare lo sfondo e il colore del link ".
Scheletro
Skeleton è una piastra di cottura che rende lo sviluppo di siti Web responsive un gioco da ragazzi. Ne abbiamo scritto alcune volte su Design Shack e adoro la sua semplicità. Insieme al download, ovviamente, ottieni un file demo, che può essere facilmente utilizzato come modello iniziale su cui costruire il tuo lavoro.
Responsive Twenty Ten (tema WP)
Responsive Twenty Ten è un tema figlio del tema WordPress predefinito con molte fantastiche funzionalità come immagini flessibili. Gli autori ti danno il permesso di "scaricare, prendere, usare, cambiare e fare quello che vuoi con esso".
Modello di Web design reattivo Onextrapixel
Un modello / tutorial gratuito molto semplice ma solido per il web design reattivo. Questo è perfetto se vuoi solo scavare e vedere come funziona un semplice modello reattivo senza tutto il fluff.
The Novelist: Responsive WP Theme for Writers
Un tema dall'aspetto davvero unico con un'interfaccia simulata di libro aperto che si ridimensiona bene quando si ridimensiona il browser. Perfetto per portfolio di scrittori personali.
Tema Ari WordPress
Ari è un tema blog minimale che è super attraente nella sua semplicità. È costruito per WordPress 3 e versioni successive e presenta sia un tema chiaro che uno scuro. Ti consigliamo di dare un'occhiata a questo.
Golden Grid
Come Skeleton, Golden Grid è più di un modello, è un framework per la creazione di siti reattivi. Auto-etichettato come una griglia pieghevole per un design reattivo, "le 16 colonne possono essere combinate o piegate in 8 colonne per schermi di dimensioni tablet e in 4 colonne per quelle di dimensioni mobili".
Buono minimo - Un modello HTML5 reattivo
"Good Minimal è un modello di stile pulito e minimalista adatto a portfolio, blog e aziende." Molto simile al modello precedente sotto molti aspetti ma con un design più audace e unico. Mi piace molto l'aspetto della tipografia in questo.
iTheme2 (WordPress)
iTheme2 è uno splendido modello di blog gratuito che ha un layout reattivo e tonnellate di fantastiche funzioni come un dispositivo di scorrimento personalizzabile, un widget per social media, due skin per temi e altro ancora.
Folio due
"Folio Two è un portafoglio avanzato, un modello pratico e utilizzabile progettato con HTML5 + CSS3 e che utilizza jQuery per migliorare un'esperienza utente straordinaria."
Questo modello presenta una grande griglia di immagini davvero gradevole che si trasforma senza problemi quando la finestra del browser viene ridimensionata. La griglia sembra grande sia piccola che grande!
Grido WP Theme
Grido è un'impresa straordinaria e impressionante di trucchi per il layout web. Presenta sia un layout simile a una muratura che un sistema reattivo che regola nuovamente tale layout per diverse dimensioni dello schermo. Viene fornito con più combinazioni di colori, una galleria lightbox, sette skin e altro ancora.
Tema WordPress flessibile
“Flessibile è un tema WordPress che aiuta a presentare i tuoi contenuti e a visualizzarli per adattarsi a schermi di dimensioni diverse, con un design tutto tuo. Fornisce inoltre un'integrazione davvero semplice con Facebook e Fan Gate, un must se gestisci un sito Web. "
Costellazione di temi WordPress
Questo tema ha tutto. Non solo è reattivo, è costruito su HTML5 Boiler Plate e contiene sia una griglia orizzontale che un ritmo verticale perfetto dei pixel che si adatta perfettamente ai dispositivi. Questo è il punto di partenza perfetto per il tuo prossimo progetto WordPress.
Griglia fotografica reattiva senza soluzione di continuità
Un piccolo esperimento di Chris Coyier che puoi scaricare e utilizzare. Fondamentalmente è solo una grande griglia di foto che si adatta istantaneamente alle diverse dimensioni della finestra del browser.
Tema Tisa WP
Un altro tema Themify dall'aspetto accattivante e reattivo con molte immagini grandi, una splendida combinazione di colori e sei skin tematiche.
Tema WordPress reattivo per Meerkats
“Il tema Meerkats è stato creato per rispondere a piattaforme e dispositivi diversi. È un tema WordPress semplice e di base creato da Gregor McKelvie. ”
Quadro di lavagna
“Il framework della lavagna per WordPress è stato sviluppato per accelerare il processo di sviluppo di un tema WordPress. Whiteboard lo fa eliminando il tempo dedicato al codice comune a tutti i temi WordPress e include un codice non intrusivo che migliora il tema generale di WordPress in molti modi, tra cui SEO, velocità, usabilità e supporto mobile. "
Costruito sul popolare Less Framework, Whiteboard utilizza sia HTML5 che CSS3 e ti offre un punto di partenza quasi imbattibile per lo sviluppo di temi WP perfettamente reattivi.
Conclusione
Con queste venti incredibili risorse, dovresti essere pienamente armato per iniziare a creare progetti Web reattivi sia in HTML / CSS che WordPress. Indipendentemente dal tuo budget, qui ci sono diversi temi e modelli che sono perfetti per te.
Lascia un commento qui sotto e facci sapere se ne abbiamo perso uno. Hai incontrato fantastici modelli e temi reattivi? Vogliamo vederli!
){kind=link}