7 tips för att välja den bästa webbsteget för din design

Det finns inget sätt att kvantifiera alla typsnitt som finns tillgängliga för webbdesigners. Nästan varje dag visas en ny typsnitt i mitt inkorg eller Twitter-flöde. Men inte alla en av dessa typsnitt - oavsett hur vacker - är rätt för att designa en webbplats.

När det gäller att välja det perfekta teckensnittet, har du funderare på en mängd olika saker, bland annat kompatibilitet, lasttid och design. Idag har vi sju tips som hjälper dig att välja och använda det bästa webbfontet för ditt designprojekt.

1. Börja med grundlagen

Att arbeta med webbfonter är precis som alla andra typografiprojekt. Det börjar med grunden.

  • Serif vs Sans Serif: Det finns andra typer av kategorier men när det gäller webbdesign är nästan varje projekt baserat på ett av dessa alternativ. (Och sans serif typsnitt är det dominerande valet.)
  • Kerning, spårning och ledning: Mängden utrymme som omger text kan vara lika viktigt som typsnittet. Kerning är utrymmet mellan brevpar; medan spårning är mellanslag mellan gruppdos tecken. Ledande är mängden utrymme mellan textrader (aka linjehöjd).
  • Läsbarhet: När du arbetar med text för webben kan antalet tecken per rad vara viktigt. Tänk på storleken på skärmen där texten kommer att visas och utforma den för att vara lätt att läsa.
  • avstavning: Gör bara inte det. Hyphens gör en röra av text på skärmen.
  • Anpassning och rättfärdigande: Mest tillämplig på stora textblock, men tänk på hur texten kommer att anpassa sig på skärmen - vänster, höger eller centrum - och om textblock kommer att ha raggade kanter eller vara fullt motiverade.
  • Antal teckensnitt: Som med något projekt, högst tre tecken? om du inte har en riktigt bra anledning.
  • Kom ihåg kontrast: Det spelar ingen roll vilken typ av text du väljer om det inte finns tillräckligt med kontrast mellan text och bakgrunden för att den ska kunna läsas. Element som bidrar till kontrast inkluderar storlek, slagvikt, färg och utrymme.

2. Överväga kompatibilitet

En av de saker som gör webtypografi svårt är att webbläsare ändras och får uppdateringar. Du vill välja ett typsnitt som är kompatibelt med moderna webbgränssnitt som används på både stationära och mobila enheter.

Låter enkelt, eller hur? Det kan ta testning på flera enheter för att hitta något som fungerar sömlöst.

Du kommer att ha ännu större lycka om du håller dig till en typfamilj som är design för webben eller genom att använda alternativ från Google Fonts eller @ font-face-regeln. (Du kan lära dig mer om det senare och hur det fungerar från Six Revisions.)

3. Använd en tjänst

När det gäller Google-teckensnitt väljer många designers att använda en webbtypstjänst. Det är en bra idé och kan göra mycket av de möjliga tekniska problemen lätt att övervinna.

Bortsett från Google (förmodligen det mest populära alternativet) finns det en mängd andra val. Medan Google Fonts är en gratis tjänst varierar prissättningsnivåerna för de andra från fria alternativnivåer till dyrare kit.

  • Adobe Typekit
  • Fonts.com
  • Webtype
  • Fontspring

Var och en av dessa tjänster har tusentals typalternativ och är ganska lätta att använda. Vad som är bra med något av dessa alternativ är att de kan erbjuda ett expansivt typbibliotek utan att behöva spendera pengar på många enskilda teckensnitt. Nackdelen är att de flesta typsnitt endast är tillgängliga för dig att använda online och inte i tryckta projekt.

4. Var hänsyn till ton och meddelande

Börja med typen. Ibland kommer teckensnittsval nästan som en eftertanke; saker kommer att bli enklare om du först bestämmer typalternativ. Tänk sedan på hur texten kommer att spela in med andra designelement som färg och bilder.

Att välja en typsnitt kan göra din hjärna till visuell överbelastning med alla tillgängliga val. Det är lättare att navigera genom alla typsnittet om du har en uppfattning om vad du letar efter från början.

Det är viktigt att du ser till att typsnittet du väljer matchar tonen och meddelandet om det projekt du arbetar med. Här är några frågor som hjälper dig att kartlägga det:

  • Är projektet formellt eller ledigt?
  • Bör texten vara fet eller lättare?
  • Är teckensnittet för stor text eller liten?
  • Hur kommer det att para med färg eller bilder?
  • Matchar stämningen i bokstäverna orden som läses?

5. Det är OK att titta på förslag

En av de saker som Google Fonts gör exceptionellt bra är att användaren kan titta på typsnittskombinationer och göra förslag på typsnittskombinationer. Det finns ingen skam att använda ett av dessa alternativ. (Adobe Typekit-biblioteket gör också ett bra jobb för att hjälpa användare att välja typsnitt baserat på hur de ska användas. Ta en titt på verktygen till höger på skärmen för vägledning.)

Fontparing kan vara svårt. Det är inte en stark kostym för alla designer. Få hjälp är OK. Var bara försiktig med överdrivna teckensnittskombinationer; Det första alternativet du ser kan vara det som används mest.

Kom ihåg dina grundläggande principer för fontparning och leta efter brevformar som liknar stämning, stroke och x-höjd. Tänk på form och snedsteg av bokstäver och välj typsnitt med liknande konturer. Det är en bra idé att blanda och matcha typ stilar och välj serif och sans serif par eller en sans serif och nyhet typsnitt.

6. Tänk om belastningstiderna

Om ett teckensnitt inte laddas snabbt, leta efter ett annat alternativ. Användare har inget tålamod för långsamma webbplatser. Oavsett hur fantastiskt typsnittet, det måste laddas vid nästan blixtens hastighet för att vara effektiv.

När du väljer ett typsnitt testar det för hastighet. (De flesta typer av tjänster hjälper dig med detta, inklusive Google.) Tänk sedan på andra sätt att behålla belastningstiderna till ett minimum.

  • Använd ett begränsat antal teckensnitt.
  • För varje typsnitt väljer du bara de stilar du planerar att använda.
  • Välj endast de språk du ska använda för en viss typsnitt.

7. Vara välsignelse

Du behöver inte använda Helvetica, Arial eller Droid Sans för att skapa webtypografi. Ta din tid och vara kön när du väljer en typsnittspalett.

Typewolf är en stor resurs när det gäller att undvika populära typsnitt. Webbplatsen rankar de 10 mest populära alternativen i olika kategorier - serif, sans serif, slab serif, monospaced och så vidare. Det har också några roliga listor för alternativ till populära typsnitt som de som nämns ovan.

Bonus: 10 stora webbfonter

Abril Fatface

Josefin Slab

Lato

Liga gotiska

Öppna Sans

PT Sans

Roboto Slab

Dödläge

Ubuntu

Vollkorn

Slutsats

Välja ett perfekt webbfont kan vara en av de processer som känns otroligt givande - när du hittar den perfekta kombinationen - eller gör att du vill dra ditt hår ut - när ingenting verkar fungera. Men du kan arbeta igenom alla tillgängliga alternativ för att hitta en typsnitt och ett system som fungerar för dina webbdesignprojekt.

Hur väljer du ett webbfont? Finns det någon annan process än de steg vi har skisserat ovan? Vi skulle gärna vilja dela dina tips också i kommentarerna.