Fonturi
Tipografia este mai mult decât simple cuvinte pe o pagină; este un element fundamental care împletește țesătura identității mărcii noastre. Fonturile noastre atent alese sunt ambasadorii tăcuți ai mesajului nostru, oferind o voce consecventă și recognoscibilă în toate comunicările noastre.
Linkuri rapide:
Dincolo de transmiterea informațiilor, fonturile noastre întruchipează esența mărcii noastre - un amestec armonios de curățenie, modernitate și profesionalism. În această secțiune, explorăm nu doar fonturile pe care le folosim, ci și principiile care ghidează aplicarea lor, asigurând o reprezentare fără cusur și de impact a brandului nostru în fiecare interacțiune.
Sistemul nostru tipografic este conceput pentru versatilitate, oferind linii directoare fluide adaptabile la diverse medii; fiecare canal posedă specificații distincte, adaptate din sistemul nostru general pentru o reprezentare de brand coerentă, dar personalizată.
Simplon
Paleta noastră principală construiește cea mai mare parte a creației noastre și ar trebui să reprezinte cele mai puternice nuanțe din orice piesă.
Norma
Sub-familia Norm este fontul nostru principal și este disponibilă în 8 gramaje.
Mono
Deși există un set complet de caractere mono, acestea sunt utilizate doar cu moderație pentru numere.
Roboto
Roboto este utilizat în cazurile în care Simplon nu poate fi utilizat. Dacă un font de sistem este absolut necesar sau obligatoriu, Roboto este o soluție de rezervă acceptabilă.
Font Awesome Pro
accesibilitate. Este esențial să rețineți că acest font nu este un substitut pentru sistemele noastre de pictograme dedicate; mai degrabă, acesta ar trebui aplicat în situațiile în care sunt necesare soluții bazate pe text.
Utilizați această pagină sau site-ul Font Awesome pentru a găsi, copia și lipi cu ușurință caracterele pictogramă.
Font Awesome Pro este împachetat cu câteva greutăți diferite. Noi folosim doar Regular sau Solid și niciodată light, deoarece aceste caractere sunt folosite doar la dimensiuni mai mici pentru tabele și grafice.
Familia de fonturi vine cu 100 de caractere. Mai jos sunt prezentate câteva care sunt aprobate pentru utilizarea în grafice și tabele.
Font Awesome Regular
Font Awesome Solid
Culoare
Utilizare și aplicare
Explorați exemplele de utilizare și aplicare de mai jos, unde descriem modalitățile corecte și incorecte de utilizare a sistemului nostru de fonturi și tipografie. În ritmul nostru de design, conținutul și tipografia colaborează ca într-un dans bine coordonat. Aceste reguli ghidează modul în care tipografia vizuală și designul conținutului lucrează împreună, asigurându-se că se completează reciproc pentru un amestec perfect de lizibilitate, estetică și identitate de brand. Unele provocări vizuale pot fi rezolvate prin modificări de conținut, iar unele provocări de conținut au nevoie de soluții vizuale.
Deși veți găsi îndrumări conceptuale, specificațiile exacte sunt absente în mod intenționat din cauza naturii variate și dinamice a mediilor pe care le cuprinde marca noastră. Departamentele, cum ar fi designul pentru print sau web, își stabilesc propriile specificații pe baza acestor principii directoare pentru a se alinia la cele mai bune practici ale fiecărui mediu.
Utilizați fontul nostru Simplon Norm Bold la dimensiuni mari pentru ca afirmațiile noastre eroice și puternice să aibă un impact puternic.
Utilizați fontul nostru Simplon Norm Bold la dimensiuni mari pentru ca afirmațiile noastre eroice și puternice să aibă un impact puternic.
Oferiți titlurilor mari mult spațiu liber. Lăsați mesajul să vorbească de la sine, fără a fi împiedicat de elemente grafice străine sau de apropierea de alt conținut.
Declarațiile de impact mari și îndrăznețe trebuie să fie scurte; 3-5 cuvinte maxim. Punctuația poate fi folosită pentru a crea dramatism cu un punct sau o întrebare. Punctuația și casarea propoziției trebuie utilizate întotdeauna împreună și nu nepotrivite.
Uneori trebuie să facem o declarație puternică care să nu fie de 3-5 cuvinte. Utilizați fontul cu greutate normală, dar păstrați dimensiunea mare, spațierea și regulile de punctuație și casare.
Titlurile și declarațiile de impact au o dimensiune mare și necesită o înălțime a liniei mai mică decât corpul textului. Se recomandă un raport de 100% între înălțimea liniei și dimensiunea fontului, dar poate fi ajustat în funcție de mediu. Evitați întinderea înălțimii liniei și comprimarea înălțimii liniei până la punctul în care coborâtoarele și urcările ating textul de impact.
Titlurile și declarațiile de impact au o dimensiune mare și necesită o înălțime a liniei mai mică decât corpul textului. Se recomandă un raport de 100% între înălțimea liniei și dimensiunea fontului, dar poate fi ajustat în funcție de mediu. Evitați întinderea înălțimii liniei și comprimarea înălțimii liniei până la punctul în care coborâtoarele și urcările ating textul de impact.
Nu utilizați greutatea bold la dimensiuni mai mici, deoarece aceasta creează probleme de lizibilitate pe măsură ce devine mai mică. Trebuie să menținem un nivel ridicat de contrast și ordine a conținutului, deci folosiți dimensiunea, culoarea și greutatea pentru a face pagina confortabil de citit.
Nu folosiți tratamentul de impact pentru a afirma ceea ce este evident. Folosiți supratitluri, subtitluri sau proximitate pentru a păstra aceste blocuri în context.
SECȚIUNEA URMĂTOARE
Ierarhia este importantă
Totul nu poate fi cel mai important lucru. Folosiți tipografia pentru a ghida utilizatorul și pentru a face piesa o scanare rapidă sau o scufundare confortabilă.
Subtitlurile sunt rapid de citit și scanat
Nu încercați să spuneți prea multe într-un subtitlu similar unui titlu. Oferiți utilizatorului morcovul sau firul de pâine pentru a citi mai mult, dacă dorește. Folosiți titlurile de pe întregul articol ca marcaje kilometrice în poveste. Dacă utilizatorul derulează întreaga pagină sau scanează o pagină și citește doar titlurile, va înțelege premisa de bază a poveștii? Poate găsi rapid ceea ce este important pentru el?
Subtitlurile trebuie să respecte aceleași reguli de punctuație și de casare ca și titlurile principale.
Vor exista cazuri în care va trebui să faceți afirmații secundare sau imbricate. Utilizați aceleași principii pentru aceste subtitluri. La fel ca în cazul declarațiilor cu impact mai mare, utilizați culoarea, greutatea și dimensiunea pentru a crea suficient contrast și ierarhie în articolul dvs. Nu doar pentru că arată bine, ci și pentru că este mai ușor de citit.
Ierarhia contează
Folosiți toate instrumentele din cutia de instrumente a brandului pentru a face povestea să strălucească.
Tipul curat arată expertiza noastră.
- Înălțimea liniei - Înălțimea liniei poate varia și va trebui să varieze pentru anumite medii. Pentru ca corpurile de literă să fie accesibile, dar și confortabile și lizibile, începeți cu 130% și nu depășiți niciodată 155% din dimensiunea fontului. Legenda poate fi mai îngustă, dar caracterele de corp nu trebuie să fie niciodată mai înguste de 100%. O lucrare tehnică poate necesita o cantitate semnificativă de conținut într-un spațiu restrâns, în timp ce o lucrare de marketing ar trebui să se orienteze întotdeauna către claritate și deschidere față de supraîncărcarea cu conținut.
- Înălțimea paragrafului - La fel ca mai sus, va trebui să vă asigurați că acest lucru funcționează pentru conținut și mediu. Acestea fiind spuse, trageți între 100% și 140% din dimensiunea fontului.
- Stilizarea în linie - Stilizarea în linie poate adăuga un punct de accent sau de concentrare într-un corp de text mai mare. Utilizați aceste tehnici cu moderație și încercați să subliniați doar cele câteva cuvinte cheie.
Dacă trebuie să subliniem un gând sau o propoziție întreagă, încercați să treceți la o linie nouă.
Utilizați culoarea caracterelor pentru a crea o experiență de lectură confortabilă și utilizați culori care evocă acțiunea. Nu utilizați niciodată o culoare de acțiune ca titlu. Rezervați albastrul nostru pentru acțiune și linkuri și evitați utilizarea acestuia pentru caractere statice. Asigurați-vă că consultați următoarele orientări privind accesibilitatea pentru a afla cerințele privind contrastul adecvat al caracterelor.
Accesibilitate
Pentru a ne asigura că un număr cât mai mare de clienți ai noștri au parte de o experiență consistentă, ne dorim întotdeauna să rămânem cât mai accesibili posibil. Un mod în care putem face acest lucru este prin aderarea la liniile directoare WCAG 2.1 privind raporturile de contrast pentru text.
Mai jos veți vedea raportul de contrast minim acceptabil pentru paletele noastre primare ca culori de fundal. Suprapuse vor fi afișate diferite culori de text acceptabile din paleta noastră. Prin "minim" înțelegem că identificăm cel mai deschis text pe fundaluri mai deschise care poate fi utilizat pentru a respecta standardele AAA. Această culoare, inclusiv orice culoare mai închisă din grupul de nuanțe, poate fi utilizată. Și viceversa pentru fundaluri întunecate și text mai deschis.
Vă rugăm să rețineți că, dacă culoarea textului este afișată într-o greutate bold, aceasta va atinge doar standardele AA și ar trebui evitată în cazul aplicațiilor cu fonturi mici, ușoare.
Afișăm doar culorile recomandate pentru text. Accentele violet, portocaliu, galben și teal nu sunt recomandate pentru text.
Neutru
Textul dvs. poate fi mai închis la culoare decât oricare dintre nuanțele menționate mai jos.
Marină
Textul dvs. poate fi mai deschis decât oricare dintre nuanțele menționate mai jos.
Albastru
Textul dvs. poate fi mai deschis sau mai închis decât oricare dintre nuanțele menționate mai jos, în funcție de jumătatea paletei pe care o folosim.