At v\u00e6lge en skrifttype er mere end blot et \u00e6stetisk valg \u2013 det kan have en v\u00e6sentlig effekt<\/a> p\u00e5 dit websteds bounce rate<\/a> og konverteringsrater<\/a>, is\u00e6r hvis du v\u00e6lger en skrifttype, der er sv\u00e6r at l\u00e6se. Derfor kan det betale sig at tage lidt tid at v\u00e6lge den perfekte Google Fonts-familie til dit websted, i stedet for at bruge den f\u00f8rste skrifttype, du st\u00f8der p\u00e5.<\/p>\n Hvis du har brug for endnu flere skrifttyper, s\u00e5 se vores indl\u00e6g om 50+ moderne skrifttyper til brug p\u00e5 dit WordPress-websted<\/a>.<\/p>\n Der er tusindvis af skrifttyper p\u00e5 internettet, s\u00e5 hvad g\u00f8r Google Fonts s\u00e5 speciel?<\/p>\n For det f\u00f8rste er det gratis! Derudover vedligeholdes og leveres Google Fonts af Google, hvilket betyder, at de med garanti er sikre. Selvf\u00f8lgelig er der masser af risikable websteder, hvor du kan downloade gratis skrifttyper, men hvem ved, hvad du ellers kan hente med disse filer?<\/p>\n Kvaliteten af \u200b\u200bskrifttyper p\u00e5 s\u00e5danne websteder kan nogle gange ogs\u00e5 v\u00e6re tvivlsom.<\/p>\n Google har udvalgt et udvalg af over tusinde skrifttyper af h\u00f8j kvalitet. N\u00e5r du ikke er en grafisk designer<\/a> med et perfekt \u00f8je for typografi, er det et mere sikkert valg.<\/p>\n For det andet er der ingen indviklede licensbegr\u00e6nsninger. Alle skrifttyper i Google Fonts-kataloget er open source og gratis at bruge i kommercielle projekter. Du kan downloade eller integrere dem p\u00e5 dit websted, og du kan endda bruge dem i printprojekter.<\/p>\n Selvom der ikke er nogen samlet licens, bruger de fleste skrifttyper i depotet Open Font License<\/a>.<\/p>\n Andre “gratis skrifttyper” er sj\u00e6ldent gratis og kommer med en lang r\u00e6kke forvirrende licensbegr\u00e6nsninger, der kan bringe dig i problemer, hvis du laver en fejl. Desv\u00e6rre kommer Google Fonts ikke med den samme bagage.<\/p>\n Og endelig er det nemt at tilf\u00f8je Google Fonts til dit websted ved hj\u00e6lp af Google Fonts API<\/a>. Alternativt kan du downloade dem enkeltvis og uploade dem til din webserver via FTP\/SFTP<\/a>.<\/p>\n Selvom Google Fonts har en tendens til at v\u00e6re enkle og m\u00e5ske ikke s\u00e5 prangende som nogle betalte skrifttyper, sl\u00e5r det bestemt websikre skrifttyper<\/a>, der er forudinstalleret med st\u00f8rre operativsystemer, de samme skrifttyper, som alle har set tusindvis af gange f\u00f8r.<\/p>\n\n Hvis der er \u00e9n ting, du b\u00f8r l\u00e6re, n\u00e5r du designer et websted<\/a>, er det, hvordan du v\u00e6lger en Google-skrifttype, der passer til dit projekt. God typografi vil h\u00f8jne eller \u00f8del\u00e6gge dit websted.<\/p>\n Det kan virke som en uvigtig detalje, men det kan v\u00e6re forskellen p\u00e5, om nogen forlader dit websted tidligt eller bliver ved med at blive en loyal l\u00e6ser eller kunde.<\/p>\n At v\u00e6lge den rigtige skrifttype er noget, grafiske designere bruger \u00e5r p\u00e5 at mestre, men med nogle f\u00e5 principper i tankerne, kan du v\u00e6lge en smuk skrifttype til dit websted.<\/p>\n S\u00e5 hvordan udvikler du en liste over de bedste Google-skrifttyper, n\u00e5r s\u00e5 meget af dette er subjektivt? Vi \u00f8nsker ikke, at hele denne liste skal v\u00e6re forudindtaget, s\u00e5 vi vil g\u00e5 med dataene for at bygge en liste over de mest popul\u00e6re Google-skrifttyper.<\/p>\n Vi bruger Google Fonts analytics<\/a> til at stole p\u00e5 menneskem\u00e6ngdens ord. Med over 50 billioner samlede skrifttypevisninger har Google kun en lille smule data at hente fra.<\/p>\n Derefter g\u00e5r vi lidt ud over de r\u00e5 popularitetstal og v\u00e6lger nogle kommende HTML-skrifttyper<\/a>, der vinder popularitet.<\/p>\n Parat? Lad os dykke ned!<\/p>\n Roboto<\/a>, 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\u00e6rt, kommer i 12 forskellige stilarter og optr\u00e6der flere gange i Google Fonts’ analyser.<\/p>\n For eksempel er Roboto den mest popul\u00e6re skrifttype. Men Roboto Condensed<\/a> er ogs\u00e5 den sjette mest popul\u00e6re skrifttype, og Roboto Slab<\/a> dukker ogs\u00e5 op som nummer 12!<\/p>\n Open Sans Condensed<\/a> er en meget l\u00e6selig skrifttype bestilt af Google og inspireret af sin forg\u00e6nger Droid Sans. Google bruger Open Sans p\u00e5 nogle af dets websteder og dets trykte annoncer og webannoncer<\/a>. Open Sans Condensed, dens s\u00f8sterskrifttype her, har ogs\u00e5 den trettende mest popul\u00e6re plads p\u00e5 Google Fonts.<\/p>\n Lato<\/a> er en andet popul\u00e6r sans-serif-skrift, denne gang udviklet af \u0141ukasz Dziedzic. Den har noget af en historie bag sit design, der balancerer modstridende m\u00e5l, hvilket resulterer i en unik, let sans-serif skrifttype.<\/p>\n Montserrat<\/a> 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\u00e6lge imellem.<\/p>\n Oswald<\/a> 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.<\/p>\n Source Sans Pro<\/a> er en sans-serif-skrifttype skabt til Adobe og Adobes f\u00f8rste open source-skrifttype. Lavet af Paul Hunt, dens lette bogstaver g\u00f8r den ren og l\u00e6selig.<\/p>\n Slabo<\/a> er en serif-skrifttype udviklet af John Hudson fra Tiro Typeworks. Denne skrifttype er specielt designet til bestemte st\u00f8rrelser – enten 27px eller 13px, afh\u00e6ngigt af dine behov.<\/p>\n Med 18 forskellige stilarter \u00a0Raleway<\/a> en anden stor sans-serif skriftfamilie, som oprindeligt blev skabt af Matt McInerney. Hvis du synes om Raleway og s\u00f8ger noget unikt, tilbyder Raleway Dots<\/a>\u00a0en lignende stilart med en prikket format, som kan fungere godt for store overskrifter<\/a>.<\/p>\n PT Sans<\/a> blev udviklet til den russiske f\u00f8derations offentlige typer og inkluderer som s\u00e5dan b\u00e5de latinske og kyrilliske tegn. Der er ogs\u00e5 flere andre skrifttyper i PT-familien, inklusive nogle serif-indstillinger.<\/p>\n Merriweathers<\/a> navn fremkalder ideen om et behageligt design, og det er pr\u00e6cis, hvad dets designere havde til hensigt. Selvom det ikke er helt s\u00e5 popul\u00e6rt, er Merriweather Sans<\/a> et s\u00f8sterprojekt, der passer us\u00e6dvanligt godt med det.<\/p>\n Med tallene er de ti ovenst\u00e5ende skrifttyper de mest popul\u00e6re Google-skrifttyper. Men kun at vise de mest popul\u00e6re muligheder er en bj\u00f8rnetjeneste for gode kommende skrifttyper, der ikke har f\u00e5et eksponeringen til at dukke op i analyserne.<\/p>\n Her er nogle af vores favoritter, der ikke dukkede op i toppen af \u200b\u200banalysen.<\/p>\n Noto<\/a> er en Google-kommissioneret skrifttype, der kommer i b\u00e5de serif og sans-serif versioner. Den modtager regelm\u00e6ssige opdateringer, og der er nu langt over 100 Noto-skrifttyper, og kommer hele tiden flere!<\/p>\n Notos m\u00e5l er at d\u00e6kke alle alfabeter og tegn fra forskellige sprog, mens dets distinkte design er harmonisk p\u00e5 tv\u00e6rs af hundredvis af forskellige skrifttypefamilier. Disse derivater omfatter de popul\u00e6re Noto Sans KR<\/a> og Noto Sans JP<\/a>.<\/p>\n Nunito Sans<\/a> er en sans-serif-mulighed, der hurtigt vokser i popularitet. Dens brug blev tredoblet mellem 2018 og 2019, og den bliver kun mere popul\u00e6r hvert \u00e5r.<\/p>\n Concert One<\/a> er en afrundet grotesk skrifttype, der g\u00f8r en fantastisk mulighed for overskrifter. Dets utraditionelle design vil helt sikkert tiltr\u00e6kke \u00f8jne.<\/p>\n Prompt<\/a> er et sans-serif-tilbud fra det thailandske kommunikationsdesign firma Cadson Demak. Den er loopless (den thailandske \u00e6kvivalent til sans-serif) og inkluderer b\u00e5de thailandske og latinske tegn.<\/p>\n Work Sans<\/a> er en sans-serif skrifttype, der er optimeret til brug p\u00e5 sk\u00e6rme. Designerne anbefaler at bruge mellemv\u00e6gtstyperne til alt fra 14 px-48 px.<\/p>\n Hvis du synes, at det m\u00e5 v\u00e6re sv\u00e6rt at v\u00e6lge en skrifttype fra Google Fonts, s\u00e5 bare vent indtil du skal fors\u00f8ge at s\u00e6tte dem sammen med din webside! Heldigvis er dette ikke et problem du selv skal l\u00f8se, medmindre du er frisk p\u00e5 det. Der er et par m\u00e5der, der kan hj\u00e6lpe dig med at sammens\u00e6tte de bedste Google Fonts-kombinationer.<\/p>\n For det f\u00f8rste vil Google Fonts hjemmeside selv foresl\u00e5 popul\u00e6re sammens\u00e6tninger, hvis du ruller ned p\u00e5 siden:<\/p>\n Desuden kan du ogs\u00e5 bruge et websted som Font Pair<\/a> til at se flere forslag.<\/p>\n N\u00e5r du har fundet de optimale skrifttyper fra Google Fonts, er der nogle gode fremgangsm\u00e5der ift., hvordan Google Fonts bruges i WordPress.<\/p>\n Nogle af disse skrifttyper – som Montserrat og Raleway – kommer i 18 forskellige skrifttypev\u00e6gte. Selvom det er godt at have mange muligheder, s\u00e5 vil du ikke indl\u00e6se alle de 18 valgte til din WordPress-webside, da dette vil bremse indl\u00e6sningstiden<\/a>.<\/p>\n Dette er meget vigtigt at huske p\u00e5!<\/p>\n En god tommelfingerregel for\u00a0de fleste skrifttyper er, at bruge maks. 3 skriftv\u00e6gte:<\/p>\n Mange WordPress-websteder, vi ser i dag, springer endda kursiv over og g\u00e5r bare med to forskellige skrifttyper v\u00e6gte.<\/p>\n Hvis du selv indlejrer Google Fonts, kan du v\u00e6lge pr\u00e6cis, hvilke v\u00e6gte der skal inkluderes. Bes\u00f8g f\u00f8rst en skrifttypeside og klik derefter p\u00e5 V\u00e6lg denne typografi<\/strong> ud for dem, du \u00f8nsker.<\/p>\n De fleste WordPress-temaer i dag, tilbyder nemme muligheder for at v\u00e6lge, hvilke Google-skrifttyper og v\u00e6gte du vil bruge. Men ikke alle temaudviklere er fokuseret p\u00e5 ydeevnen. Derfor kan det i nogle tilf\u00e6lde v\u00e6re bedre at deaktivere Google Fonts i dit tema og tilf\u00f8je dem selv.<\/a><\/p>\n Variable skrifttyper<\/a> er ogs\u00e5 begyndt at blive popul\u00e6re og underst\u00f8ttes 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\u00e6lge imellem, og du kan endda indsn\u00e6vre din s\u00f8gning til dem specifikt. Som et alternativ til at hoste skrifttyper fra Googles server, kan du ogs\u00e5 v\u00e6re v\u00e6rt for skrifttyper lokalt, hvilket kan give nogle\u00a0pr\u00e6stationsfordele.<\/a>\u00a0Husk p\u00e5, at de fleste Google-skrifttyper sandsynligvis allerede er cache-lagret i folks browsere. Derfor anbefaler vi, at du lave dine egne pr\u00e6stationstest.<\/p>\n Hvis du bruger en premium skrifttype som ikke er fra Google Fonts, f.eks. “Brandon”-skrifttype, som vi bruger p\u00e5 vores Kinsta-webside, s\u00e5 er den bedste l\u00f8sning at den hostes lokalt (og betjenes fra din CDN). Du kan l\u00e6se mere om dette emne i vores indl\u00e6g om, hvordan man hoster skrifttyper lokalt.<\/a><\/p>\n Skrifttyper er ligesom WordPress-plugins og temaer \u2013 med tiden kommer der opdateringer og forbedringer, for at g\u00f8re dem endnu bedre. Og selvom opdateringerne m\u00e5ske ikke er liges\u00e5 v\u00e6sentlige som for WordPress-plugins, s\u00e5 kan det stadig v\u00e6re en fordel at v\u00e6lge en skrifttype, der modtager regelm\u00e6ssige opdateringer. Noto fra Google er en skriftfamilie, der har modtaget regelm\u00e6ssige opdateringer<\/a> siden 2014.<\/p>\n Fordi de fleste skrifttyper p\u00e5 denne liste er popul\u00e6re, er de et godt bud p\u00e5 skrifttyper, der vil modtage regelm\u00e6ssige opdateringer og forbedringer. Hvis du derimod v\u00e6lger en skrifttype som ikke er fra listen, g\u00f8r du klogt i at sikre dig, at den skrifttype du v\u00e6lger, er popul\u00e6r nok til at der kommer opdateringer til den.<\/p>\n If\u00f8lge World Health Organization<\/a>, if\u00f8lge data indsamlet i 2015, lever ansl\u00e5et 253 millioner mennesker med synsneds\u00e6ttelse<\/a>: 36 millioner er blinde, og 217 millioner har moderat til sv\u00e6r synsneds\u00e6ttelse. Derudover er antallet af personer med en eller anden form for v\u00e6rdiforringelse steget til 2,2 milliarder.<\/p>\n N\u00e5r du anvender Google Fonts, f\u00e5r du kontrol over, hvordan det ser ud med hensyn til CSS, s\u00e5som farve og st\u00f8rrelse. Glem derfor ikke at f\u00f8lge Web Content Accessibility Guidelines (WCAG) 2.0.<\/a> Dette sikrer, at dit indhold er let tilg\u00e6ngeligt for alle.<\/p>\n Overholdelse af disse anbefalinger vil g\u00f8re dit indhold mere tilg\u00e6ngeligt for et bredere udvalg af mennesker med handicap, herunder personer p\u00e5virket af blindhed og nedsat syn, d\u00f8vhed og h\u00f8retab, l\u00e6ringsforstyrrelser, kognitive begr\u00e6nsninger, bev\u00e6gelsesbegr\u00e6nsninger, taleindskr\u00e6nkninger, lysf\u00f8lsomhed og kombinationer af disse. – Web Content Accessibility Guidelines (WCAG) 2.0<\/em><\/p>\n En meget vigtig anbefaling er farvekontrast. I et \u00e6ldre design p\u00e5 Kinstas webside, var vores skrifttype lidt for lys, og de bes\u00f8gende gav udtryk for, at det var sv\u00e6rt at l\u00e6se. Det sidste du vil g\u00f8re er, at publicere fantastisk indhold, bare for at det skal blive en belastning for folks \u00f8jne!<\/p>\n Du kan bruge et v\u00e6rkt\u00f8j som Color Contrast Checker<\/a> fra WebAIM for at se, om de skrifttyper du har, stemmer overens med de officielle anbefalinger. Nedenfor kan du se, at farverne p\u00e5 vores blogindl\u00e6g nu best\u00e5r testen. \ud83d\udc4d<\/p>\n Med en eller to skrifttyper valgt ud, er det sidste trin at tilf\u00f8je den til din hjemmeside. Takket v\u00e6re Google Fonts er denne opgave endnu nemmere end normalt.<\/p>\n Antag, at du \u00f8nsker at f\u00e5 en skrifttype ind p\u00e5 dit websted. I s\u00e5 fald har du tre muligheder: at installere et plugin s\u00e5som Easy Google Fonts<\/a> eller Google Fonts Typography<\/a>, bruge Google Fonts API til at uploade skrifttypen til dit websted eller manuelt downloade det og hoste det p\u00e5 dit websted.<\/p>\nHvorfor bruge Google Fonts?<\/h2>\n
![\"Google](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/google-fonts-homepage.jpg\")
![\"Open](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/google-fonts-license-example.jpg\")
Hvad skal du kigge efter i en Google font<\/h2>\n
\n
De 10 bedste Google-skrifttyper (If\u00f8lge folket)<\/h2>\n
1. Roboto<\/h3>\n
![\"Roboto\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-web-font-roboto.png\")
2. Open Sans<\/h3>\n
![\"Open](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-fonts-open-sans.png\")
3. Lato<\/h3>\n
![\"Lato\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-lato.png\")
4. Montserrat<\/h3>\n
![\"Montserrat\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-montserrat.png\")
5. Oswald<\/h3>\n
![\"Oswald\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-oswald.png\")
6. Source Sans Pro<\/h3>\n
![\"Source](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-source-sans-pro.png\")
7. Slabo 27px\/13px<\/h3>\n
![\"Slabo\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-slabo.png\")
8. Raleway<\/h3>\n
![\"Raleway\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-raleway.png\")
9. PT Sans<\/h3>\n
![\"PT](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-pt-sans.png\")
10. Merriweather<\/h3>\n
![\"Merriweather.\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/merriweather-font.jpg\")
Bonusskrifttyper + kommende<\/h2>\n
11. Noto Sans \/ Serif<\/h3>\n
![\"Noto](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-noto-sans.png\")
12. Nunito Sans<\/h3>\n
![\"Nunito](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-nunito-sans.png\")
13. Concert One<\/h3>\n
![\"Concert](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-concert-one.png\")
14. Prompt<\/h3>\n
![\"Prompt.\"](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-prompt.png\")
15. Work Sans<\/h3>\n
![\"Work](\"https:\/\/kinsta.com\/dk\/wp-content\/uploads\/sites\/12\/2018\/09\/google-font-work-sans.png\")
S\u00e5dan opretter du de bedste Google-skrifttyper-kombinationer<\/h2>\n
![\"Her](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/google-fonts-pairs-1024x352.jpg\")
<\/a>Bedste fremgangsm\u00e5der til brug af google fonts i WordPress<\/h2>\n
Begr\u00e6ns antallet af skrifttyper, du bruger<\/h3>\n
\n
![\"S\u00e5dan](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/google-fonts-select-font.jpg\")
\n![\"\"Setting\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/05\/google-fonts-variable-font-search.jpg\")
<\/p>\nOvervej hosting af Google Fonts lokalt<\/h3>\n
V\u00e6lg en skrifttype, der bliver opdateret<\/h3>\n
Glem ikke tilg\u00e6ngelighed<\/h3>\n
![\"Color](\"https:\/\/kinsta.com\/wp-content\/uploads\/2018\/09\/color-contrast-checker.png\")
S\u00e5dan tilf\u00f8jer du Google-skrifttyper til WordPress<\/h2>\n