Share
Come ha detto Ferris Bueller "La vita si muove piuttosto velocemente, se non ti fermi a guardarti intorno una volta ogni tanto, potresti perderlo". Diamo ascolto al suo saggio consiglio e prendiamoci un momento per dare un'occhiata alle tendenze del web design cui abbiamo assistito nel 2011.
Il web è una bestia in continua evoluzione, piena di difetti, imperfezioni e sperimentazione. - Dan Cederholm
Responsive Web Design sta diventando un po 'come una canzone brillante, ma sovraffollata. Sembra che tutti abbiano detto la loro, e l'agenda di Ethan Marcotte non è mai stata più salutare. C'è una buona ragione per questo però; il concetto è semplice, i motivi sono logici, la tecnologia è semplice e i risultati sono estremamente soddisfacenti.
Il 2011 ha visto un'esplosione del numero di siti Web costruiti in modo reattivo e la bellezza di tutto ciò è che siamo tutti coinvolti nello sviluppo del processo. È ancora nella sua giovinezza, i progettisti e gli sviluppatori stanno inventando nuovi approcci tutto il tempo, e siamo ancora molto lontani da una vera e propria best practice. Dovremmo prima progettare schermi di grandi dimensioni e utilizzare le query multimediali per degradare con garbo i nostri design per dispositivi mobili? O dovremmo progettare prima per dispositivi mobili, migliorando progressivamente per dispositivi più capaci? Paul Irish ha dato il via a un'interessante discussione su GitHub se vuoi immergerti nella discussione.
Una cosa su cui RWD ha fatto luce è l'attenzione al contenuto. A prescindere da tutti gli altri fattori, il contenuto di un determinato sito Web è ciò che è importante; il meat and two-veg deve essere leggibile, accessibile e chiaro su qualsiasi dispositivo. I progettisti stanno certamente prendendo in considerazione questo aspetto, come è evidente in molti dei siti Web emergenti del 2011.
Quando tutto va detto, anche se sei un po 'stanco di vedere altri tutorial e articoli sul RWD spuntare, restate sintonizzati. Il 2012 vedrà grandi sviluppi nel modo in cui tutti ci avviciniamo.
Partner nel crimine per il layout reattivo è la griglia. Il 2011 ha visto i quadri di rete fissi apportare miglioramenti flessibili, per non parlare dell'aspetto di ulteriori strumenti per aiutarci. Tutti i seguenti quadri, strumenti e guide soddisfano le esigenze odierne e offrono fluidità. La maggior parte di questi siti mostra anche un design reattivo, in quanto le miniature 1: 1 di seguito mostrano:
Ovviamente, la tipografia non è una disciplina che è emersa nel 2011, ma è un'area del web design che continua a crescere ed è facilitata più che mai dai web font e servizi.
Due aspetti degni di nota della tipografia sono l'estetica (i caratteri web consentono ai designer di sbizzarrirsi) e la crescente comprensione del fatto che il tipo esista principalmente per essere letto. I caratteri non devono essere microscopici per sembrare chique, e l'enfasi sui contenuti prima ci spinge verso una rete piena di caratteri grandi e belli.
Il 2011 ha visto enormi balzi in avanti in termini di funzionalità del browser (e numeri di versione!). Anche Microsoft ha recentemente ammesso che gli aggiornamenti automatici per Internet Explorer sono probabilmente una buona idea. Tutto ciò significa che i web designer hanno più giocattoli con cui giocare in termini di HTML e CSS, il che porta comprensibilmente alla creatività come risultato della tecnologia. Il 'perché posso' avvicinarmi, se ti va.
Non riesco a pensare ad un titolo migliore per questo po ', mi dispiace. Quindi di cosa sto parlando? Scorrimento verticale.
È un compito quotidiano per i web designer di minimizzare l'importanza della piega. La piega è impossibile da definire, con la pletora di dispositivi e risoluzioni in questi giorni, quindi il contenuto "essere sopra di esso" non dovrebbe essere la priorità numero uno del cliente in una soluzione di design.
Stiamo abbracciando lo scrolling verticale. L'ascesa dei dispositivi mobili ha ricordato alle persone che loro può scorrere e lì è contenuto pertinente sotto i primi pochi pixel di una pagina web. Alcuni designer hanno portato questo al livello successivo e reso lo scrolling una parte fondamentale dell'esperienza di navigazione.
Un approccio è in effetti di parallasse sottile.
Nota: Le immagini qui sotto ovviamente non rendono giustizia ai siti web - vai a dare un'occhiata (e metti la rotellina del mouse pronta ...)
Poi c'è l'idea che alcuni contenuti possano scorrere fino a un certo punto. Il 2011 ha visto un ampio uso di questo effetto; mantenendo persistenti le icone sociali, i carrelli della spesa, le barre dei menu, le chiamate all'azione ecc.
Quindi, come è stato realizzato? Spesso, una combinazione di posizionamento jQuery e CSS. Qui ci sono solo due risorse per aiutarti:
Alcuni siti hanno ulteriormente ampliato il concetto, animando elementi e chiamando eventi quando vengono raggiunti determinati punti verticali nella pagina:
E poi ci sono degli esempi che portano a scorrere una pagina web in una dimensione completamente nuova (davvero, controlla questo fuori) ...
Diagonal è goffo, non gioca con gli ambienti di oggi, ma per qualche motivo nel 2011 sono apparse linee oblique dappertutto. È come un contraccolpo a un tempo ancor prima che internet tradizionale, e tu Troverò anche altri ricordi visivi di quell'epoca; combinazioni di colori strani, effetti di luce, beige e bronzo. Strano.
Non posso fare a meno di ricordare le vecchie inserzioni di riviste con le loro linee diagonali astratte, serifs di visualizzazione, capelli grandi, Joan Collins e perle. È uno sguardo stranamente attraente ...
L'avvicinamento dei layout in modo modulare è ancora una volta favorito da Responsive Web Design. Gestire le aree di un progetto in blocchi modulari consente il riposizionamento fluido e segrega i contenuti in modo chiaro. Si potrebbe sostenere che l'ascesa delle interfacce modulari dipende dall'influenza delle app. Sempre più spesso ci troviamo a pubblicare (e ad accedere) ai contenuti web tramite app esterne come Facebook e Twitter; le linee si confondono tra schermi desktop e dispositivi palmari.
Ho chiesto al maestro Ivor della rivista Themeforest cosa avesse visto accadere sul mercato numero uno di Envato durante l'ultimo anno. Ha osservato un paio di aspetti di tendenza:
Il 2011 è stato l'anno di Minimal Design in ThemeForest - Ivor Padilla
Non devi guardare in profondità negli archivi della Themeforest per vedere cosa intende o ...
In nessun modo ho coperto tutti gli sviluppi significativi del web design del 2011, quindi segui i tuoi commenti! Quali tendenze ti hanno colpito nel 2011? Dove stiamo al momento, e dove pensi che stiano andando le cose?
Accentsconagua