Der er 1052 forskellige Google Font-familier tilgængelige gratis (på tidspunktet for skrivning af denne artikel). Det er mange valgmuligheder! Så det er ikke underligt, at du har brug for hjælp til at finde nålen i en høstakken med en liste over de bedste Google Fonts.

Vi har det til dig, og så deler vi også nogle bedste fremgangsmåder til brug af Google Fonts i WordPress.

At vælge en skrifttype er mere end blot et æstetisk valg – det kan have en væsentlig effekt på dit websteds bounce rate og konverteringsrater, især hvis du vælger en skrifttype, der er svær at læse. Derfor kan det betale sig at tage lidt tid at vælge den perfekte Google Fonts-familie til dit websted, i stedet for at bruge den første skrifttype, du støder på.

Hvis du har brug for endnu flere skrifttyper, så se vores indlæg om 50+ moderne skrifttyper til brug på dit WordPress-websted.

Hvorfor bruge Google Fonts?

Der er tusindvis af skrifttyper på internettet, så hvad gør Google Fonts så speciel?

Google Fonts-katalog.
Google Fonts-katalog.

For det første er det gratis! Derudover vedligeholdes og leveres Google Fonts af Google, hvilket betyder, at de med garanti er sikre. Selvfølgelig er der masser af risikable websteder, hvor du kan downloade gratis skrifttyper, men hvem ved, hvad du ellers kan hente med disse filer?

Kvaliteten af ​​skrifttyper på sådanne websteder kan nogle gange også være tvivlsom.

Google har udvalgt et udvalg af over tusinde skrifttyper af høj kvalitet. Når du ikke er en grafisk designer med et perfekt øje for typografi, er det et mere sikkert valg.

For det andet er der ingen indviklede licensbegrænsninger. Alle skrifttyper i Google Fonts-kataloget er open source og gratis at bruge i kommercielle projekter. Du kan downloade eller integrere dem på dit websted, og du kan endda bruge dem i printprojekter.

Selvom der ikke er nogen samlet licens, bruger de fleste skrifttyper i depotet Open Font License.

Open Font License.
Open Font License.

Andre “gratis skrifttyper” er sjældent gratis og kommer med en lang række forvirrende licensbegrænsninger, der kan bringe dig i problemer, hvis du laver en fejl. Desværre kommer Google Fonts ikke med den samme bagage.

Og endelig er det nemt at tilføje Google Fonts til dit websted ved hjælp af Google Fonts API. Alternativt kan du downloade dem enkeltvis og uploade dem til din webserver via FTP/SFTP.

Selvom Google Fonts har en tendens til at være enkle og måske ikke så prangende som nogle betalte skrifttyper, slår det bestemt websikre skrifttyper, der er forudinstalleret med større operativsystemer, de samme skrifttyper, som alle har set tusindvis af gange før.

Hvad skal du kigge efter i en Google font

Hvis der er én ting, du bør lære, når du designer et websted, er det, hvordan du vælger en Google-skrifttype, der passer til dit projekt. God typografi vil højne eller ødelægge dit websted.

Det kan virke som en uvigtig detalje, men det kan være forskellen på, om nogen forlader dit websted tidligt eller bliver ved med at blive en loyal læser eller kunde.

At vælge den rigtige skrifttype er noget, grafiske designere bruger år på at mestre, men med nogle få principper i tankerne, kan du vælge en smuk skrifttype til dit websted.

  • Passer den til dit brand: Dette kan være det mest kritiske aspekt. De bedste hjemmesider har en skrifttype, der viser deres personlighed, mens de stadig er læsbare og passer ind i det nuværende design. For eksempel bruger Apple og Iron Maiden vidt forskellige skrifttyper, men de passer begge til deres mærke.
  • Læsbarhed: Det næstmest afgørende princip er læsbarhed. En sindssyg fantasi eller grungy skrifttype kan helt sikkert passe til dit brand, men hvis dine besøgende ikke kan læse det, vil de være hurtige til at forlade dit website. Derfor skal dine skrifttyper være professionelle og læselige.
  • Skrifttype Klassificering: Selvom der er hundredvis af måder at klassificere en skrift på, er disse de fem hovedtyper: serif, sans-serif, script, monospace og dekorativ. Et script eller en serif-skrifttype formidler elegance, mens monospace-skrifttyper er populære på tekniske websteder. At kende disse klassifikationer vil give dig et bedre udgangspunkt i din søgning.
  • Display eller Brødskrift: Display Skrifttyper er til store størrelser, headers eller printprojekter. De har råd til at være mindre læselige af hensyn til unikt design. Brødtekst Skrifttypers primære direktiv er læsbarhed, da de vil udgøre hovedparten af ​​dit websted.
  • Stemning og hensigt: Ligesom ethvert kunstnerisk værk designer kunstnere skrifttyper til specifikke stemninger og omgivelser. De fleste skrifttyper kommer med noter om, hvordan de blev designet, og hvordan du kan bruge dem. Brug dem til at afgøre, om skrifttypen passer til dit projekt.

De 10 bedste Google-skrifttyper (Ifølge folket)

Så hvordan udvikler du en liste over de bedste Google-skrifttyper, når så meget af dette er subjektivt? Vi ønsker ikke, at hele denne liste skal være forudindtaget, så vi vil gå med dataene for at bygge en liste over de mest populære Google-skrifttyper.

Vi bruger Google Fonts analytics til at stole på menneskemængdens ord. Med over 50 billioner samlede skrifttypevisninger har Google kun en lille smule data at hente fra.

Derefter går vi lidt ud over de rå popularitetstal og vælger nogle kommende HTML-skrifttyper, der vinder popularitet.

Parat? Lad os dykke ned!

1. Roboto

Roboto
Roboto.

Roboto, den langvarige #1-plads og Kinstas foretrukne skrifttype, er et sans-serif-tilbud fra Christian Robertson, som Google udviklede som systemskrifttype til Android. Det er nu enormt populært, kommer i 12 forskellige stilarter og optræder flere gange i Google Fonts’ analyser.

For eksempel er Roboto den mest populære skrifttype. Men Roboto Condensed er også den sjette mest populære skrifttype, og Roboto Slab dukker også op som nummer 12!

2. Open Sans

Open Sans
Open Sans.

Open Sans Condensed er en meget læselig skrifttype bestilt af Google og inspireret af sin forgænger Droid Sans. Google bruger Open Sans på nogle af dets websteder og dets trykte annoncer og webannoncer. Open Sans Condensed, dens søsterskrifttype her, har også den trettende mest populære plads på Google Fonts.

3. Lato

Lato
Lato

Lato er en andet populær sans-serif-skrift, denne gang udviklet af Łukasz Dziedzic. Den har noget af en historie bag sit design, der balancerer modstridende mål, hvilket resulterer i en unik, let sans-serif skrifttype.

4. Montserrat

Montserrat
Montserrat.

Montserrat er en sans-serif skrifttype fra Julieta Ulanovsky, der bor i det mononymiserede Montserrat-kvarter i Buenos Aires. Med 18 forskellige stilarter, er der mange muligheder at vælge imellem.

5. Oswald

Oswald
Oswald.

Oswald er en sans-serif skrifttype, der oprindeligt er udviklet af Vernon Adams. Den blev designet med den distinkte alternative gotiske stil i tankerne, tydeliggjort af dens dristige streger.

6. Source Sans Pro

Source Sans Pro
Source Sans Pro.

Source Sans Pro er en sans-serif-skrifttype skabt til Adobe og Adobes første open source-skrifttype. Lavet af Paul Hunt, dens lette bogstaver gør den ren og læselig.

7. Slabo 27px/13px

Slabo
Slabo.

Slabo er en serif-skrifttype udviklet af John Hudson fra Tiro Typeworks. Denne skrifttype er specielt designet til bestemte størrelser – enten 27px eller 13px, afhængigt af dine behov.

8. Raleway

Raleway
Raleway.

Med 18 forskellige stilarter  Raleway en anden stor sans-serif skriftfamilie, som oprindeligt blev skabt af Matt McInerney. Hvis du synes om Raleway og søger noget unikt, tilbyder Raleway Dots en lignende stilart med en prikket format, som kan fungere godt for store overskrifter.

9. PT Sans

PT Sans
PT Sans.

PT Sans blev udviklet til den russiske føderations offentlige typer og inkluderer som sådan både latinske og kyrilliske tegn. Der er også flere andre skrifttyper i PT-familien, inklusive nogle serif-indstillinger.

10. Merriweather

Merriweather.
Merriweather.

Merriweathers navn fremkalder ideen om et behageligt design, og det er præcis, hvad dets designere havde til hensigt. Selvom det ikke er helt så populært, er Merriweather Sans et søsterprojekt, der passer usædvanligt godt med det.

Bonusskrifttyper + kommende

Med tallene er de ti ovenstående skrifttyper de mest populære Google-skrifttyper. Men kun at vise de mest populære muligheder er en bjørnetjeneste for gode kommende skrifttyper, der ikke har fået eksponeringen til at dukke op i analyserne.

Her er nogle af vores favoritter, der ikke dukkede op i toppen af ​​analysen.

11. Noto Sans / Serif

Noto Sans.
Noto Sans.

Noto er en Google-kommissioneret skrifttype, der kommer i både serif og sans-serif versioner. Den modtager regelmæssige opdateringer, og der er nu langt over 100 Noto-skrifttyper, og kommer hele tiden flere!

Notos mål er at dække alle alfabeter og tegn fra forskellige sprog, mens dets distinkte design er harmonisk på tværs af hundredvis af forskellige skrifttypefamilier. Disse derivater omfatter de populære Noto Sans KR og Noto Sans JP.

12. Nunito Sans

Nunito Sans.
Nunito Sans.

Nunito Sans er en sans-serif-mulighed, der hurtigt vokser i popularitet. Dens brug blev tredoblet mellem 2018 og 2019, og den bliver kun mere populær hvert år.

13. Concert One

Concert One Google font
Concert One Google font

Concert One er en afrundet grotesk skrifttype, der gør en fantastisk mulighed for overskrifter. Dets utraditionelle design vil helt sikkert tiltrække øjne.

14. Prompt

Prompt.
Prompt.

Prompt er et sans-serif-tilbud fra det thailandske kommunikationsdesign firma Cadson Demak. Den er loopless (den thailandske ækvivalent til sans-serif) og inkluderer både thailandske og latinske tegn.

15. Work Sans

Work Sans.
Work Sans.

Work Sans er en sans-serif skrifttype, der er optimeret til brug på skærme. Designerne anbefaler at bruge mellemvægtstyperne til alt fra 14 px-48 px.

Sådan opretter du de bedste Google-skrifttyper-kombinationer

Hvis du synes, at det må være svært at vælge en skrifttype fra Google Fonts, så bare vent indtil du skal forsøge at sætte dem sammen med din webside! Heldigvis er dette ikke et problem du selv skal løse, medmindre du er frisk på det. Der er et par måder, der kan hjælpe dig med at sammensætte de bedste Google Fonts-kombinationer.

For det første vil Google Fonts hjemmeside selv foreslå populære sammensætninger, hvis du ruller ned på siden:

Her finder du Google Fonts-kombinationerne
Her finder du Google Fonts-kombinationerne

Desuden kan du også bruge et websted som Font Pair til at se flere forslag.

Bedste fremgangsmåder til brug af google fonts i WordPress

Når du har fundet de optimale skrifttyper fra Google Fonts, er der nogle gode fremgangsmåder ift., hvordan Google Fonts bruges i WordPress.

Begræns antallet af skrifttyper, du bruger

Nogle af disse skrifttyper – som Montserrat og Raleway – kommer i 18 forskellige skrifttypevægte. Selvom det er godt at have mange muligheder, så vil du ikke indlæse alle de 18 valgte til din WordPress-webside, da dette vil bremse indlæsningstiden.

Dette er meget vigtigt at huske på!

En god tommelfingerregel for de fleste skrifttyper er, at bruge maks. 3 skriftvægte:

  • Regular (Regulær)
  • Italic (Kursiv)
  • Bold (Fed)

Mange WordPress-websteder, vi ser i dag, springer endda kursiv over og går bare med to forskellige skrifttyper vægte.

Hvis du selv indlejrer Google Fonts, kan du vælge præcis, hvilke vægte der skal inkluderes. Besøg først en skrifttypeside og klik derefter på Vælg denne typografi ud for dem, du ønsker.

Sådan vælger du Google Fonts-stilarter
Sådan vælger du Google Fonts-stilarter

De fleste WordPress-temaer i dag, tilbyder nemme muligheder for at vælge, hvilke Google-skrifttyper og vægte du vil bruge. Men ikke alle temaudviklere er fokuseret på ydeevnen. Derfor kan det i nogle tilfælde være bedre at deaktivere Google Fonts i dit tema og tilføje dem selv.

Variable skrifttyper er også begyndt at blive populære og understøttes af alle moderne browsere. Disse er fantastiske, fordi de tillader en skrifttypefil at transformere med forskellige egenskaber. Google Fonts har masser af variable skrifttyper at vælge imellem, og du kan endda indsnævre din søgning til dem specifikt.

Overvej hosting af Google Fonts lokalt

Som et alternativ til at hoste skrifttyper fra Googles server, kan du også være vært for skrifttyper lokalt, hvilket kan give nogle præstationsfordele. Husk på, at de fleste Google-skrifttyper sandsynligvis allerede er cache-lagret i folks browsere. Derfor anbefaler vi, at du lave dine egne præstationstest.

Hvis du bruger en premium skrifttype som ikke er fra Google Fonts, f.eks. “Brandon”-skrifttype, som vi bruger på vores Kinsta-webside, så er den bedste løsning at den hostes lokalt (og betjenes fra din CDN). Du kan læse mere om dette emne i vores indlæg om, hvordan man hoster skrifttyper lokalt.

Vælg en skrifttype, der bliver opdateret

Skrifttyper er ligesom WordPress-plugins og temaer – med tiden kommer der opdateringer og forbedringer, for at gøre dem endnu bedre. Og selvom opdateringerne måske ikke er ligeså væsentlige som for WordPress-plugins, så kan det stadig være en fordel at vælge en skrifttype, der modtager regelmæssige opdateringer. Noto fra Google er en skriftfamilie, der har modtaget regelmæssige opdateringer siden 2014.

Fordi de fleste skrifttyper på denne liste er populære, er de et godt bud på skrifttyper, der vil modtage regelmæssige opdateringer og forbedringer. Hvis du derimod vælger en skrifttype som ikke er fra listen, gør du klogt i at sikre dig, at den skrifttype du vælger, er populær nok til at der kommer opdateringer til den.

Glem ikke tilgængelighed

Ifølge World Health Organization, ifølge data indsamlet i 2015, lever anslået 253 millioner mennesker med synsnedsættelse: 36 millioner er blinde, og 217 millioner har moderat til svær synsnedsættelse. Derudover er antallet af personer med en eller anden form for værdiforringelse steget til 2,2 milliarder.

Når du anvender Google Fonts, får du kontrol over, hvordan det ser ud med hensyn til CSS, såsom farve og størrelse. Glem derfor ikke at følge Web Content Accessibility Guidelines (WCAG) 2.0. Dette sikrer, at dit indhold er let tilgængeligt for alle.

Overholdelse af disse anbefalinger vil gøre dit indhold mere tilgængeligt for et bredere udvalg af mennesker med handicap, herunder personer påvirket af blindhed og nedsat syn, døvhed og høretab, læringsforstyrrelser, kognitive begrænsninger, bevægelsesbegrænsninger, taleindskrænkninger, lysfølsomhed og kombinationer af disse. – Web Content Accessibility Guidelines (WCAG) 2.0

En meget vigtig anbefaling er farvekontrast. I et ældre design på Kinstas webside, var vores skrifttype lidt for lys, og de besøgende gav udtryk for, at det var svært at læse. Det sidste du vil gøre er, at publicere fantastisk indhold, bare for at det skal blive en belastning for folks øjne!

Du kan bruge et værktøj som Color Contrast Checker fra WebAIM for at se, om de skrifttyper du har, stemmer overens med de officielle anbefalinger. Nedenfor kan du se, at farverne på vores blogindlæg nu består testen. 👍

Color contrast checker tool
Værtøjet Color Contrast Tool

Sådan tilføjer du Google-skrifttyper til WordPress

Med en eller to skrifttyper valgt ud, er det sidste trin at tilføje den til din hjemmeside. Takket være Google Fonts er denne opgave endnu nemmere end normalt.

Antag, at du ønsker at få en skrifttype ind på dit websted. I så fald har du tre muligheder: at installere et plugin såsom Easy Google Fonts eller Google Fonts Typography, bruge Google Fonts API til at uploade skrifttypen til dit websted eller manuelt downloade det og hoste det på dit websted.

Hvis du har brug for at vide, hvordan du ændrer dine skrifttyper i WordPress, har vi skrevet en detaljeret guide til at hjælpe dig.

Opsummering

Google Fonts er fantastiske og bruges af millioner af websteder. De gør internettet mere behageligt, åbent, hurtigt og tilgængeligt gennem solide typografi- og ikonografiprincipper.

For at sikre en bedre overordnet oplevelse for dine besøgende, anbefaler vi, at du følger bedste skrifttypepraksis, såsom at begrænse skrifttypevægte, hoste skrifttyper lokalt (hvis nødvendigt) og holde dig til retningslinjer for tilgængelighed.

Nu over til dig – hvad er dine foretrukne skrifttyper og skrifttypepar fra Google Fonts? Fortæl os det nedenfor i kommentarerne, og glem ikke at læse vores dybdegående guide om WordPress-skrifttyper!

Brian Jackson

Brian har en stor lidenskab for WordPress, har brugt det i over et årti og udvikler endda et par premium plugins. Brian kan lide blogging, film og vandreture. Opret forbindelse med Brian på Twitter.