Skip to main content

Så här bestämmer du vilken typsnitt som ska användas för webbdesign

Gifs With Sound #228 (April 2024)

Gifs With Sound #228 (April 2024)
Anonim

Titta på vilken webbsida som helst online, oavsett storlek på webbplatsen eller branschen som den är för, och du kommer att se att en sak som de alla delar gemensamt är textinnehåll.

Ett av de enklaste sätten att påverka utformningen av en webbsida är med de teckensnitt som du använder för textinnehållet på den här webbplatsen. Tyvärr, många webbdesigners som är tidiga i sin karriär blir lite galen genom att använda för många teckensnitt på varje sida. Detta kan göra en muddied upplevelse som verkar sakna designsammanhang. I andra fall försöker konstruktörer experimentera med teckensnitt som är nästan oläsliga, med hjälp av dem bara för att de är "coola" eller olika. De kan faktiskt vara snygga teckensnitt, men om texten som de är avsedda att förmedla inte kan läsas, då "coolness" av det teckensnittet kommer att slita av när ingen läser den webbplatsen och istället lämnar efter en webbplats som de kan bearbeta!

Den här artikeln kommer att se på några av de artiklar du bör överväga när du väljer en typfamilj för ditt nästa webbplatsprojekt.

Några regler-of-thumb

  1. Använd inte mer än 3-4 teckensnitt på någon sida. Något mer än detta börjar känna sig amatörligt - och även i vissa fall kan 4 teckensnitt vara för många!
  2. Ändra inte teckensnittet i mitten men om du inte har en mycket bra anledning (Obs! Jag har aldrig, i alla mina år som webbdesigner, funnit en bra anledning att göra det)
  3. Använd sans serif-teckensnitt eller serif-teckensnitt för kroppstext för att göra de innehållsblicken enklare att läsa.
  4. Använd monospace-teckensnitt för skrivmaskinens text och kodblock för att ställa in den här koden bortsett från sidan.
  5. Använd skript och fantasikonfonter för accenter eller stora rubriker med mycket få ord.

Kom ihåg att det här är alla förslag, inte svåra och snabba regler. Om du ska göra något annat, bör du dock göra det med avsikt, inte av misstag.

SANS SERIF FONTS är basen för din hemsida

Sans serif-teckensnitt är de teckensnitt som inte har några "serifs" - den lilla extra designbehandlingen i slutet av bokstäverna.

Om du har tagit några utskriftsdesignkurser har du förmodligen fått veta att du bara ska använda serif-teckensnitt för rubriker. Detta är inte sant för webben. Webbsidor är avsedda att ses av webbläsare på datorskärmar och dagens skärmar är ganska bra för att visa både serif och sans-serif typsnitt tydligt. Vissa serifonter kan bli lite utmanande att läsa i mindre storlekar, särskilt på äldre skärmar, så du borde alltid vara medveten om din publik och se till att de kan läsa seriffonter innan du fattar beslutet att använda dem för din kroppstext. Med det sagt är de flesta serif typsnitt idag utformade för digital konsumtion och de kommer att fungera bra som kroppskopia så länge de är inställda på en rimlig typsnitt.

Några exempel på sans-serif-teckensnitt är:

  • Arial
  • genever
  • Helvetica
  • Lucida Sans
  • Trebuchet
  • Verdana

Trivia: Verdana är en typfamilj som uppfanns för användning på webben.

ANVÄND SERIF FONTS FÖR PRINT

Medan serif typsnitt kan se till att läsa på nätet för äldre bildskärmar, är de perfekta för utskrift och bra för rubriker på webbsidan. Om du har utskriftsvänliga versioner av din webbplats är det här den perfekta platsen att använda serif-teckensnitt. Serifs, i tryck, gör det lättare att läsa, eftersom de tillåter människor att skilja bokstäverna tydligare. Och eftersom utskriften har en högre upplösning kan de ses tydligare och verkar inte suddas ihop.

Bästa praxis: Överväg att använda serif typsnitt för dina utskriftsvänliga sidor.

Några exempel på serif-teckensnitt är:

  • Garamond
  • georgien
  • Times
  • Times New Roman

MONOSPACE FONTS ANVÄNAR LIKNANDE RUM FÖR VARJE Brev

Även om din webbplats inte handlar om databehandling, kan du använda monospace för att ge instruktioner, ge exempel, eller ange maskinskriven text. Bokstäver med samma storlek har samma bredd för varje tecken, så de tar alltid upp samma mängd utrymme på sidan.

Skrivmaskiner använder vanligtvis monospace-teckensnitt, och att använda dem på din webbsida kan ge dig känslan av det skrivna innehållet.

Några exempel på monospace-teckensnitt är:

  • Kurir
  • Courier New
  • Lucida Console
  • Monaco

Bästa praxis: Monospace-teckensnitt fungerar bra för kodprover.

FANTASY OCH SCRIPT FONTS är svåra att läsa

Fantasy och manus typsnitt är inte så spridda på datorer, och i allmänhet kan det vara svårt att läsa i stora bitar. Medan du kanske gillar effekten av en dagbok eller annan personlig post som använder en kursiv typsnitt kan ge, kan dina läsare ha problem. Detta gäller speciellt om din målgrupp innehåller icke-modersmål. Dessutom innehåller inte fantasy och kursiva teckensnitt alltid accenttecken eller andra specialtecken som begränsar din text till engelska.

Använd fantasi och kursiva teckensnitt i bilder och som rubriker eller call-outs. Håll dem korta och var medvetna om att vilken typ av teckentyp du väljer kommer troligtvis inte att ligga på en majoritet av dina läsares datorer, så du måste leverera dem med hjälp av webbfonter.

Några exempel på fantasiefonter är:

  • Kopparplåt
  • Desdemona
  • Inverkan
  • Kino

Trivia: Påverkan är typsnittsfamiljen som är mest sannolikt att vara på Mac, Windows och Unix-maskiner.

Några exempel på skript teckensnitt är:

  • Apple Chancery
  • Comic Sans MS
  • Lucida Handskrift

Trivia: Studier har visat att typsnitt som är svårare att läsa kan hjälpa studenter att behålla mer information.

Originalartikel av Jennifer Krynin. Redigerad av Jeremy Girard den 9/8/17