Statul de tendințe de design web ediția anuală 2011

2010 a fost un an incredibil de verde pentru web designeri. Mobile a lovit mainstream-ul; Tipografia web a atins un nivel nou de sofisticare; Noile tehnici de codare ne-au îmbunătățit considerabil capacitatea de a crea creații prin design (fără a compromite stabilitatea). În ansamblu, a fost un an care sa mutat rapid, chiar și după standardele de pe web, așa că să intrăm în primul nostru post anual care acoperă stadiul de design web, pe măsură ce 2010 se transformă în 2011.


Moartea dansului

Tradiționalul "ori" (linia imaginară de pe un ecran care desemnează ce conținut este vizibil înainte ca un vizualizator să trebuiască să deruleze) a devenit vag, neimportant și aproape irelevant în 2010.

De ce? Deoarece "ecranul" tradițional pe care oamenii îl văd pe web a suferit o explozie de soi ... nu mai putem aștepta ca surferii web să fie pe ceva aproape de un monitor de 19 ", cu o rezoluție undeva între 1024x768 și 1280x700. toate formele și dimensiunile, de la dispozitive iPhone (și telefoane mai mici) până la televizoare HD de 60 ". Nu este doar o rezoluție care poate varia în mod sălbatic; chiar raportul de aspect al unui ecran (chiar pe același dispozitiv ca iPhone) se poate schimba odată cu mișcarea încheieturii mâinii. Desigur, designerii de web vor fi întotdeauna sfătuiți să păstreze cele mai importante mesaje ale unui site aproape de partea de sus, dar cu atât de multe modalități noi pentru web-surferi pentru a vizualiza web-ul, nu mai există o înălțime definită pentru locul în care trebuie să fie deasupra conținutului.

Vom discuta acest subiect cu mult mai multe detalii în această lună, deci abonați-vă (este gratuit) pentru a rămâne la îndemână :)


Site-uri mobile

Site-urile au fost concepute pentru scenarii mobile de la începutul dispozitivelor mobile ... dar 2010 a făcut o apăsare uriașă către subsite-uri întregi care sunt concepute special pentru a fi vizualizate pe ecrane mici, handheld. Puteți mulțumi iPhone-ului pentru pornirea acestei tendințe, dar valul de site-uri "mobificate" se răspândește ca un foc sălbatic ... și veniți în același an anul viitor, sunt sigur că veți fi greu să găsiți un site publicitar major fără site-ul companionului mobil.

Ceea ce este elegant cu privire la ecranele mobile este faptul că forțează designerii să devină creativi cu o sumă relativ mică de bunuri imobiliare. Reușita în mediul mobil nu este dificilă dacă țineți cont de câteva reguli: Mesajele trebuie transmise mai repede și cu mai multă eficiență; Legăturile trebuie să fie proiectate pentru un mediu touchscreen; iar textul trebuie să devină lizibil (sau, cel puțin, să poată fi efectiv redus). Iată doar câteva exemple de site-uri mobile:

Puteți citi mult mai multe despre designul mobil pe site-ul nostru sursă: Mobile.tutsplus.com!

SubTrend: site-uri testate

La fel cum sa observat și în 2010 o explozie a designului site-urilor mobile, se poate aștepta ca consumatorii să ridice comprimate mai des, site-urile majore urmând exemplul prin crearea de site-uri (și aplicații) proiectate special pentru medii de ecran tactil de dimensiuni medii.


Explozie tipografică

Bine, cred că ați putea face afirmația că "tipografia va exploda" în fiecare an ... dar 2010 a văzut câteva schimbări majore ale tehnologiei care stau la baza faptului că această afirmație este legitimă. În primul rând, cantitatea imensă de creștere a tehnologiei de înlocuire a fontului în ultimul an și adoptarea în masă a "fonturilor ca servicii", în care companiile terțe găzduiesc fonturi (și licențe) pe care designerii le pot utiliza în medii de dezvoltare live. S-ar putea spune, de asemenea, că designerii devin mult mai îndrăzneți cu typogrpahy, de asemenea ... cu tot mai multe modele care ies în ultimul timp care încețoșează linia dintre print-4design și designul web.

Puteți citi mai multe despre acest mod de navigare în varietatea acestor noi soluții tipografice noi aici. Să examinăm câteva exemple (unele folosind înlocuirea fontului, altele folosind alte metode):

SubTrend: Site-uri inspirate de imprimare de design

Acest lucru a fost tot furia în 2009 - 2010, dar "revoluția tipărită" este în viață și bine pe web și tot mai multe site-uri sunt concepute pentru a imita design-uri de imprimare excelente, cum ar fi reviste, postere, pliante și multe altele.


Aplicația desktop IUI Influența

Dacă aș fi fost un jucător de pariuri în 2009, mi-aș fi pus toți banii în aplicații ... aplicații pentru iPhone, aplicații Android, aplicații Apple, aplicații pentru PC, aplicații web ... mediul software pare să fi trecut complet în ultimul an sau doi . Toate aceste emoții asupra creării de aplicații s-au strecurat într-un mod interesant în stilul de web-lexicon: unde, odată ce web-ul a arătat, bine, ca un site web, în ​​zilele noastre se poate arăta adesea mai mult ca o aplicație. Totul din ferestre modale, meniuri context, butoane inspirat de sistemul de operare și multe altele sunt aduse în mediul de design web în moduri noi și interesante ... rezultatul final: site-uri care se simt mai ușor de utilizat și mai natural.


Grid Intensive Layouts

Amplasarea rețelei nu este nouă în 2010 (sau chiar în 1980), însă designerii web încep să se desprindă de layout-urile web tradiționale (antetul, coloana de conținut, bara laterală, subsolul) în favoarea mai multor planuri unice. Ceea ce a început cu mișcarea 960.gs sa răspândit rapid în sistemele de rețea care se pot adapta la rezoluția ecranului spectatorilor.


Imagini masive

Iată o altă tendință care se întâmplă pentru mai mult decât anul trecut. Imaginile masive au fost o dată tabu pentru designerii web, dar datorită optimizării imaginii, conexiunilor rapide la internet și metodelor de încărcare mai inteligente, designerii pot câștiga foarte mult în unele site-uri prin împingerea dimensiunilor imaginilor la maxim.

Mai mult decât "imagini mari", începem să vedem mai multe tendințe către site-uri care folosesc fundaluri ilustrative (și fotografică) uriașe care fac parte din experiența reală, deoarece acestea sunt doar lucrări de artă suplimentare.


Immersivă integrare Script (jQuery Sliders, etc.)

Pluginurile codificate au fost o idee ulterioară în majoritatea modelelor web ... ați termina un mockup, apoi înlocuiți o imagine cu un cursor dacă ați putea găsi un plugin excelent pentru el. În zilele noastre, desenele întregi pot fi bazate pe scripturi și plugin-uri care fac mai mult decât "adăugați ceva" la un design ... ei pot defini intreaga experienta a site-ului.

Iată doar câteva exemple de site-uri care nu adaugă doar interactivitate script, ei îl constituie fundamentul site-ului:

Puteți citi mai multe despre jQuery și alte trucuri de integrare a script-urilor la site-ul nostru sursă: Net.tutsplus.com!


CSS3 accesează fluxul principal

Dacă aș avea un ban pentru fiecare articol CSS3 pe care l-am văzut în 2010, aș fi înotat într-o piscină. În timp ce adoptarea în masă a CSS3 este încă o mică călătorie (aici este un link la îndemână pentru a vedea ce browsere au adoptat ce părți ale CSS3), designerii nu au ezitat să înceapă să utilizeze unele dintre noile caracteristici fantastice. Totul de la colțuri rotunjite, umbre de cutie, efecte strălucitoare, animație CSS3, @ font-face și multe altele au început să apară în modele peste tot. aici este doar o mână de exemple:

Puteți citi mai multe despre trupele CSS3 la site-ul nostru sursă: Net.tutsplus.com!


Textura, textura, textura

Texturile nu sunt noi, dar după cum trece în fiecare an, vedem că este integrată în moduri noi și interesante. 2010 a văzut o mulțime de textura "zgomotului subtil", dar mai mult decât orice, începem să intrăm într-o fază de stil în care mai multe modele încep să se simtă "atinge". Acest lucru nu înseamnă neapărat că se folosesc texturi mari, de fișiere grele ... în schimb, vedem texturi mai subtile, bine proiectate, care se repetă în mod natural.


Designuri infografice

Am fost întotdeauna un mare fan al infographics, deci este frumos că începem să vedem că acestea sunt integrate în design-ul web ca mai mult decât atașamente. Cred că există o mulțime de oportunități pentru metode noi și interesante de integrare a site-urilor infografice, deci țineți cont de aceste modele în 2011.


Site-uri cu o singură pagină


Medii 3D

Aceasta este mai mult o noutate decât o tendință ... Site-urile bazate pe 3D sunt distractive pentru utilizare, dar nu sunt accesibile în întregime de la unele browsere și dispozitive. Acestea fiind spuse, există câteva lucruri distractive noi care se întâmplă în calea mediilor tridimensionale, deci merită să le verificați, chiar dacă nu le veți mai vedea pe iPhone în curând;)


Convergența socială a mass-media

Ultima tendință pe care o voi menționa nu este una care necesită mult în ceea ce privește capturile de ecran ... în principal pentru că schimbarea este mai mult decât substanța. Deși această tendință se întâmplă de ani de zile, lucrurile par să se îndrepte în acest moment ... și soarta viitorului internetului va fi decisă.

Despre ce vorbesc este "convergența social media", sau mai degrabă, modelul de branduri și companii care își concentrează eforturile pe site-urile de social media (și nu pe site-urile lor independente). În loc de domenii individuale, începem să vedem tot mai multe companii care se deplasează la strategii care se bazează pe site-uri precum Facebook sau care integrează cel puțin caracteristicile sociale într-o manieră care depinde 100% de site-urile media sociale.

... în loc de o internet compusă din milioane de site-uri diferite și unice, am putea ajunge cu o mână de "mega-site-uri" pe care toată lumea (indivizii și întreprinderile deopotrivă) au pur și simplu o pagină pe ...

Acest lucru are sens pentru un număr de întreprinderi; este mult mai ușor să îi atragi pe oameni să descopere și să viziteze pagina dvs. de pe Facebook sau pe Twitter decât să le împiedică (propriu-zis) propriul domeniu (de ex.: myownawesomewebsite.com/me). Câștigătorii acestei tendințe sunt, desigur, marile site-uri media sociale care adună din ce în ce mai mult trafic. Cei învinși? Ei bine, dacă această tendință continuă, perdanții ar putea fi foarte bine oricine nu sare pe bandwagon ... așa că, în loc de o internet compusă din milioane de site-uri diferite și unice, am putea ajunge cu o mână de "mega-site-uri" că toată lumea (indivizii și întreprinderile deopotrivă) are pur și simplu o pagină.


Lăsați discuția să înceapă!

Bine, așa că am lovit vârful aisbergului pentru toate cele mai mari tendințe care au avut loc în 2010 și voi fi primul care va recunoaște că sunt sigur că mi-a lipsit ceva. Postați comentariile, gândurile, tendințele și orice altceva în secțiunea de comentarii și voi lua în considerare comentariile cu adevărat mari atunci când va veni timpul să editați această postare mai târziu!

Happy 2011!