Pregătire de tipografie pentru site-uri

UI-kit este un set de elemente de interfață sau chiar ecrane tipice din care se asamblează interfața. Uneori, aceasta include nu numai butoane, pictograme, casetele de selectare, dar și elemente de tipografie: un fel de titluri, subtitluri, corpul de text, citate, liste, și așa mai departe.







Suntem în studio a încercat să înceapă dezvoltarea interfeței cu crearea UI-kit-ul, dar de multe ori se termină că setul de elemente necesare pentru a modifica cursul studiului fiecărui ecran.

În curând am încetat să mai facem acest lucru și, ca rezultat, UI-kit-ul a început să apară nu înainte de etapa de prototipare, ci în timp. În această etapă - stadiul de redare, nu doriți, dar există elemente comune. Dintre acestea, și a obținut un kit stabil UI, deoarece aceste elemente ale interfeței au fost deja testate și se potrivesc perfect în aspectul general al site-ului.

Elementele au fost sortate, dar există o zonă mult mai importantă decât elementele de interfață - aceasta este o tipografie.

tipografie

Unul dintre obiectivele principale ale majorității site-urilor este de a furniza informații utilizatorului final. S-a făcut, bineînțeles, textul. Tipul de rubrici, font, mărime, spațiere, linii între paragrafe - acești parametri influențează ușurința percepției informațiilor. Dacă un site cu o mulțime de text, atunci dimensiunea în el ar trebui să fie utilizate mai mult. În cazul în care acest lucru nu este un site simplu și un sistem CRM complex cu o mulțime de grafice, aveți posibilitatea să tastați dimensiune mai mică, dar pur și simplu trebuie să acorde mai multă atenție la distanță interalphabetic ca atunci când se utilizează anumite fonturi, litere de dimensiuni punct mic se unesc unul cu altul, ceea ce duce la o dificultăți de citire.







Apple a dezvoltat un font excelent SanFrancisco: atunci când utilizați acest font cu o mărime mică, spațiul crește automat.

Aceste trei fișiere conțin cel puțin următoarele elemente:

Într-un fișier, se pare că textul abstract utilizează metodele de proiectare de mai sus.

Pregătire de tipografie pentru site-uri

Ca rezultat, o tipografie subțire a site-ului apare în trei fișiere: paragraful-desktop, paragraful-tabletă și paragraful-telefon.

Pregătire de tipografie pentru site-uri

Practic, nu este supus nici unei modificări în timpul prototipării site-ului. Din cauza acestei stabilități, puteți transfera fișiere către alți designeri și nu vă temeți că ceva va merge prost. Ele pot fi, de asemenea, transmise dezvoltatorilor pentru a accelera dezvoltarea site-ului. Această tipografie subliniază în continuare proiectarea elementelor de interfață.

Bonus pentru cei care au citit până la sfârșit

Render fonturi în sistemele de operare este diferit. Deci același font arată diferit în Windows și OS X. Este chiar mai diferit în Photoshop.

Pregătire de tipografie pentru site-uri

Modul corect de a alege fonturile corecte este de a verifica în practică. Pentru a face acest lucru, trebuie să faceți această pagină cu text și să vedeți în browser.

Această metodă nu este potrivită pentru toți designerii, deoarece mulți dintre ei nu sunt familiarizați cu elementele de bază ale codului HTML. Dar vă recomand să cunoașteți aceste principii. Nu poți desena ceea ce nu știi, cum se va realiza.







Articole similare

Trimiteți-le prietenilor: