10 Regler för perfekt typdesign, varje gång

Har du någonsin lagt märke till att vissa projekt bara verkar glöda med stor typ? Vissa designers har en viss förmåga att designa perfekt typografi för varje projekt.

Du kan också göra det. Med en handfull enkla regler kan du förbättra utseendet och utformningen av typografi i alla dina projekt, digitalt och i tryck. Om du kämpar med att plocka teckensnitt och para skrifter, kommer dessa regler att hjälpa dig att designa perfekt typ, varje gång. (Se bara till att följa dem.)

1. Ange mål för projektet

God typografi börjar med en gedigen förståelse för vad ditt projekt ska göra. Innan du ens tittar på Google Fonts eller Typekit, skriv ner svaren på några frågor.

  • Vem försöker du nå med det här projektet?
  • Vad ska användarna göra med designen?
  • Vad är konverteringspunkterna?
  • Vad är stämningen i projektet?
  • Behöver du matcha eller samordna med andra mönster eller branding?

Svaren hjälper dig att börja rama en uppfattning om vilken typ av typografi du letar efter. (Här är en guide till betydelse och humör för typsnitt i designprojekt.)

2. Leta efter liknande former

När det gäller att matcha flera teckensnitt i en design kan något så enkelt som formen av bokstäver göra eller bryta typsnittskombinationen.

Så hur ska du se till att du gör det?

Leta efter typsnitt med liknande former. Tänk på om varje typsnitt är mer rund eller oval, tjock eller tunn, har en kort eller lång x-höjd eller innehåller en snedställning eller lutning.

Välj en primär eller kropp, typsnitt som du gillar och matcha sedan kompletterande teckensnitt med liknande former.

  • Titta på små bokstaven? O? i varje typfamilj. Är insidan? Skål? rund eller oval? Match typsnitt där insidan av? O? är samma.
  • Det är OK att para ihop tjocka och tunna typsnitt. Det är bättre att para en tjock eller tunn och vanlig typsnitt.
  • Leta efter typsnitt med liknande x-höjder (den vertikala storleken på en? X?).
  • Var inte rädd för att mixa och matcha olika typer av stilar. Prova serif och sans serif kombination. Se bara till att om en typsnitt är komplex, är den andra enkel. Och använd den enkla typsnittet för den bredaste applikationen, till exempel kroppstext.
  • Var uppmärksam på snedställd och kursiv. (Du kan titta på mitten av? O? Igen som en riktlinje.) Använd inte mer än en snedställd typ och undvik typsnittspar som snedställs i motsatta riktningar. De kan krossa för användare.

Fortfarande osäkert? Här är en guide till blandning av teckensnitt.

3. Ställ in en typskala för dimensionering

Storleken på bokstäverna kan göra eller bryta ett projekt. Om texten är för stor resulterar det i ett onaturligt läsemönster med för många pauser och slutar. Om texten är för liten kan den påverka ögonen och få användarna att lämna designen.

När texten är rätt, går användarna fritt genom orden.

Texten som är rätt stor, kommer också med en skala för olika storlekar i projektet. Kroppstext är en storlek, rubrikerna är en annan storlek och underrubrikerna är ännu en storlek. Och alla storlekar och användningsområden bör vara konsekventa i hela designen.

Vad det här gör för användarna gör allting lättare att läsa.

  • Textstorleken prioriterar information av betydelse. Större typ är viktigare och är mer sannolikt att skummas av de flesta användare.
  • En skala ökar skannern i text så att användarna snabbt kan titta på det.
  • Relaterade föremål har samma utseende.
  • Större textelement, som underrubriker, hjälper till att bryta upp långa block av text, vilket gör det enklare att läsa.

4. Var uppmärksam på spacing

Det är inte typen i sig, men typavstånd är viktiga.

Kerning, ledning, spårning och vaddering kan göra din typ vackert eller göra den till en het röra.

Det finns en fin konst för att få avstånd precis precis. Och mycket beror på de faktiska bokstavskombinationerna som används, storlek och typsnitt. Det finns ingen ordningsregel - annat än att göra det vid behov - och det finns inte en perfekt mängd vaddering för text och andra element.

Du kommer att behöva eyeball det.

Testet är känsla. Om designen känns? Av? på ett sätt som du inte kan identifiera, kan problematiskt avstånd vara att skylla på. Det krävs bara övning - och ett bra öga - för att få det rätt.

5. Justera vänster för läsning

På engelska, liksom andra språk, läser användarna från vänster till höger. Det är också den perfekta anpassningen för att optimera läsbarheten inom block av kopia.

Små bitar av text - menyelement eller hjälterubriker - behöver inte anpassas till vänster eftersom de är snabba att läsa. Stora mängder av kopia - något mer än en mening - borde troligen lämnas i linje. (Motivering är argumenterbart, även om det kan orsaka vissa problem med avståndet om du inte är mycket försiktig.)

6. Välj två typfamiljer

Denna regel har förmodligen blivit inlagd i ditt huvud: Använd bara två teckensnitt för ett projekt.

Det sägs här igen eftersom så få designers faktiskt uppmärksammar denna regel. Skanna på webben eller en portföljwebbplats och du får se massor av projekt med? Teckensnitt gått vilda !?

Om du planerar att bryta mot denna regel, tänk igen. Vad får du genom att lägga till en annan typsnitt till mixen? Titta istället på den typsnitt du har valt och se om en annan stil - fet eller tunn eller kursiv - kan vara en bättre lösning.

7. Ändra inte teckensnitt

Aldrig sträcka eller vrida eller sneda en typsnitt. Om du behöver något annat än vad du har väljer du ett annat alternativ.

Typdesigners spenderar mycket tid på att skapa bokstäver som fungerar som presenteras. Att ändra bokstäver gör ont i läsbarhet och kan orsaka att teckensnitt bryts? På det sättet blir ett foto pixelerat när du använder större än originalstorlek.

8. Använd mycket kontrast

En av de saker som får designers i problem är att sätta typ på en bild eller bakgrundsdel.Det fungerar bara när du har mycket kontrast mellan element för att skapa separation och säkerställa läsbarhet.

Om du måste lägga till en droppskugga till bokstäver, finns det inte tillräckligt med kontrast.

Ljus på mörkt eller mörkt på ljuset kan garantera läsbarhet. Det hjälper också att använda en typsnitt med en regelbunden eller bredare stroke.

Men det är inte alltid fallet. Ett foto kan innehålla ljusa och mörka utrymmen eller låta innehålla tjocka och smala streck.

Alternativen inkluderar boxningstext, plockar en tyngre typsnitt eller lägger till ett färgöverlägg på bilden. Alla dessa tekniker kan bidra till att skapa mer kontrast och göra texten mer läsbar. (Dessutom tenderar de att hålla upp när de används i flera mottagliga brytpunkter där text och bilder rör sig runt.)

9. Kom ihåg mobil typografi

När det gäller typografi för webben, bör mobilläsbarhet vara en viktig fråga. Roliga tekniker som att lägga till ett mönster eller en textur i bokstäver kan fungera i tryck och några skrivbordsskärmar men kommer att bli korta på mindre enheter.

Du måste tänka på hur teckensnitt kommer att göras i alla användningsområden. (Gå tillbaka till din typografi skala och kom ihåg att inkludera specifikationer för typ på stora och små skärmar.)

Mobiltypografi är ofta lite stor och innehåller lite mer avstånd än typografi på skrivbord. Det hjälper också om styckena är kortare så att du inte hamnar i block av text som tar flera rullar att läsa, vilket kan skrämmande användare.

10. Håll dig till en stilguide

När du har en gedigen uppfattning om hur typen ska se ut i ett projekt, skapa en stilguide med alla dina exakta regler för användning.

Göra kopior. Lägg det online på en tillgänglig plats. Och använd det när du ändrar designen.

Konsistens är en nyckelkomponent i perfekt typografi design.

Slutsats

Saken med bra mot dålig typografi är att de flesta användare kan identifiera den ena eller den andra. De vet bara när designen inte är helt rätt.

Den viktigaste oro när det gäller att skapa perfekt typografi är läsbarhet. Typ måste vara lätt att läsa och förstå. Den ska matcha stämningen i kopian. Och det borde känna sig nästan osynligt för användarna. det fungerar när de inte behöver tänka på det och kan läsa med lätthet.