Share
Sunteți gata pentru doza din această lună de design de web awesomeness? Pun pariu că ești! Max ține luna liberă, dar ne-a dat o listă de 15 site-uri care prezintă unele dintre cele mai bune tipografii pentru băieții voștri pentru a fi verificați. Hai să intrăm!
Vorbind despre regulile tehnice ale tipografiei potrivite este grozavă ... dar unde cauciucul atinge într-adevăr drumul este atunci când putem începe să ne uităm la exemplele de tipografie în acțiune și să analizăm de ce funcționează. Unul dintre lucrurile frumoase despre tipografie este că, la fel ca limbile pe care le folosim pentru a comunica între ele, modul în care folosiți tipul într-un design îi dă o voce. Puteți să țipați și să țipați sau să șoptiți în liniște ... depinde de dvs. și de modul în care doriți ca mesajul dvs. să fie auzit.
În fiecare lună, vom analiza între 10 și 20 de exemple de tipografie excelentă în designul web ... dar mai important, vom analiza, de asemenea, de ce funcționează tipografia. Să ne aruncăm în oferta din această lună:
Este prea rar să văd site-uri ca asta ... sincer. Este o abordare pe care aveți tendința de a vedea o mulțime de design tiparit, dar rareori adus pe web. Care sunt componentele?
Uită-te la cât de simplu este designul ... nu există un singur element pe care un elev de proiectare de primul an nu-l poate crea ... dar cât de elegant și sofisticat face simți pe ecran? Despre asta vorbim atunci când discutăm despre tipografie inspirativă. Folosind un aspect simplu, bine structurat, designerul reușește să articuleze un sentiment de încredere și profesionalism înainte ca vizitatorul să citească chiar textul.
Uneori, un design necesită ceva neobișnuit pentru a atrage atenția vizitatorului. Acesta este locul pe care site-ul Amazee Labs îl face atât de bine. Nu numai că Amazee optează să nu utilizeze fonturi web standard, ci și amestec de tip HTML, alături de tipul bazat pe imagine, pentru a oferi un nivel ridicat de creativitate și entuziasm. În multe privințe, Amazee încalcă regulile ... dar așa fac ei să facă să strălucească:
Toate acestea ajută la păstrarea sentimentului de ordine, chiar și atunci când selecția de tip este pe toată hartă.
Site-ul Finch este surprinzător de minim în utilizarea tipului său. Nu vă înșelați de emblema imensă de pe prima pagină ... totul în acest design este subevaluat (într-un mod bun).
Chestia despre folosirea tipului pe o pagină necompletată este că, atunci când se face corect, pagina se simte ca ea are mult mai mult decât doar textul.
Am menționat Mecanica Imaginilor în postul nostru Anual Web Design Trends, dar merită să ne ridicăm din nou pentru că este vorba de roci. Designul se abate de la paradigma standard de navigație UI, făcând blocuri reale de text de navigație (spre deosebire de cuvinte sau butoane unice). Acest lucru atrage vizitatorul, reamintindu-i ca exista idei reale in spatele fiecarui link. Conținutul real al corpului în cadrul designului este remarcabil de bine conceput - se simte aproape ca o revistă, cu un text cu antet mare, îndrăgit, ilustrații bine asociate și schimbări subtile de culoare (cum ar fi culorile spot într-un zon tipărit). Îmi place, de asemenea, imensul logotip pe pagina lor de întâlniri "Meet the Makers"!
În regulă, recunosc că sunt îndreptată imediat spre ilustrația imensă și sexy de culoare roșie ... atât de mult încât tipografia ar putea fi chiar oribilă fără ea (nu este) și probabil că nu aș observa. Punctul pe care încerc să-l fac cu acest lucru este că potrivirea corectă a imaginii cu tipul (prin dimensiune, stil, culoare etc.) poate face minuni pentru a crea un design memorabil al site-ului. Doriți să faceți o impresie de durată? Luați câteva note despre abordarea îndrăzneață a lui Kaleidoscope.
Site-ul Fe.ro este un exemplu în care fiecare parte a site-ului se simte "proiectată". Ceea ce înseamnă că nimic nu a lăsat setările implicite ale browserului în stil ... Acest lucru poate fi adesea un lucru rău când nu se face bine, dar în mâinile designerilor Fe.ro, se simte inteligent și elegant.
Nu voi spune prea mult despre acest design, deoarece cred ca vorbeste destul de bine pentru sine. Formatul și tipul de utilizare sunt destul de obișnuite, dar unde devine interesant este în imaginile mari folosite în cursă. Amintiți-vă că tipografia web poate exista și în imagini ... crearea unui stil vizual distinct pentru tipografia bazată pe imagine poate aduce o mulțime într-un aspect altfel obișnuit.
Voi fi primul care va recunoaste ca imi place Conferintele Condensate Sans-Serif ... dar ele pot merge oh-asa-gresesc daca nu sunt folosite in mod corespunzator. Aici, ele se situează în centrul scenei ca o cruce între un titlu și un font de accent. Rezultatul: doar cantitatea potrivită de strigăte. Integrarea fontului de scripturi fanteziste ajută să aducă un pic de stil și forțelor rigide ale chipului Ligii Ligii. Observați cum cele două fonturi se echilibrează unul pe altul. Bun? Da, e minunat.
Structura site-ului Infinvision este simplă și supusă ... care ajută la evidențierea și atragerea atenției asupra ilustrațiilor fantastice de tip tipic pe care le folosesc pentru a-și prezenta compania. Spațiul alb funcționează în mod surprinzător aici - nuff a spus.
King Size este singurul șablon pe această listă - Ceea ce îmi place tipografic este că nu se simte deloc o temă WordPress. Panglica mare, combinată cu designul de laur, face ca acest lucru să se simtă stâncos și Roman în estetică ... ceva ce nu vedeți adesea (dacă este deloc) în modelele de șablon care se simt, de obicei, rigide și previzibile.
Logo-ul pentru Heaven-ul lui Devin este grozav, dar ceea ce îmi place cu adevărat în legătură cu site-ul este modul în care tipul este prevăzut pentru posturile de blog. Paragraful intro este lățimea totală, iar restul posturilor se reîntoarce la abordarea standard cu 2 coloane / bara laterală. Este atât de simplu ... dar acel paragraf cu lățimea completă vă face să vă simțiți ca întreaga pagină este dedicată acelui singur articol. În cazul în care alte layout-uri de blog se simt ca șabloane pe care articolele se potrivesc simplu, aceasta se simte ca și cum ar fi totul despre articol în primul rând.
Site-ul Societății Istorice Mare din Dunnellon se simte doar distractiv. Luați în considerare mai întâi scopul site-ului: de a păstra istoria lui Dennelon pentru comunitate. Ca atare, tipografia din cadrul site-ului mimează multe dintre caracteristicile societății pe care le conservă. Nu este nimic sălbatic și nebun ... dar totul, de la multi-coloane, copie de corp nou inspirată la butoane se simt autentice pentru istorie (cu câteva actualizări moderne). Formarea coroanei, ilustrațiile capricioase și rafturile adaugă cantitatea potrivită de adâncime pentru a face acest site să se simtă într-adevăr ca o capsulă de mini-timp pentru această comunitate.
Structura site-ului Stuart Hobday este o respirație de aer proaspăt, după ce am văzut câteva dintre aceste situri foarte ilustrative. Abordarea sa minimalistă simplă este simplă și nepretențioasă. Totul este plasat în mod logic și fără înfrumusețare ... uneori cu ce poate face un designer Mai puțin spune mult mai mult despre cât de mult este maturitatea și disciplina. Într-o lume a portofoliilor extravagante și a concurenței dure, este nevoie de o încredere și o viziune serioasă pentru a scoate un design subevaluat ca acesta.
Am acoperit noul site al lui Ryan în articolul nostru despre tendințele Web din 2011, dar este destul de sincer să menționăm din nou. Ryan îmbină tipul și ilustrația fără probleme într-un frumos site de navigare verticală. Efectul combinat este unul care creează un sentiment de aventură și explorare creativă ... care funcționează perfect ca o metodă de promovare a potențialilor clienți.
Site-ul lui Pat Dryburgh este în contrast cu Ryan Scherf ... dar nu într-un mod rău. Pat folosește o structură rigidă, bine structurată, o selecție sofisticată a tipului de text și un amestec interesant de spațiu pozitiv și negativ pentru a crea o estetică generală care se simte încrezătoare și profesională. Îmi plac în special coloanele mari de spațiu alb care sunt lăsate pe partea stângă a zonelor mari de tip (sub imaginea principală). Ar fi putut să umple acel spațiu cu ceva? Sigur ... dar ceea ce a decis să părăsească din proiectare vorbește volumelor la constrângerea sa ca designer.
Ei bine, este din nou momentul postului. Am avut niște râde, niște plânse, dar împreună am ajuns la concluzie și trebuie să vă părăsesc aici. Așa cum am menționat mai sus, dacă nu l-am lovit pe favoriții dvs. în această lună, asigurați-vă că o împărțiți mai jos în secțiunea de comentarii! O să fiu sigur că o voi verifica pentru post luna viitoare!
Citiți mai multe despre tipografia web la postarea mea pe Alegerea fontului potrivit: Un ghid practic pentru tipografie pe Web!
De asemenea, am început o listă mare de articole din categoria Tipografia Web ... deci verificați și ele!
Accentsconagua