Att lokalt lagra typsnitt innebär att man serverar de typsnittsfiler som används på din webbplats från ditt eget hostingkonto, server eller via din egen CDN istället för att förlita sig på en tredjepartstjänst. När det görs korrekt kan detta minska DNS-uppslag, TLS-handshakes och förseningar från externa förfrågningar, vilket resulterar i kortare laddningstider för din webbplats; framförallt ger det mätbara fördelar för Core Web Vitals, användarupplevelsen och SEO-prestanda. För att uppnå bästa resultat bör du använda endast nödvändiga typsnittstyper, föredra WOFF2-formatet, förladda kritiska typsnitt och definiera font-display: swap i CSS.
Många webbplatser använder utan att tänka på det externa typsnittslänkar från Google Fonts, Adobe Fonts eller teman under designfasen. Även om detta kan verka praktiskt vid första anblick, lägger det till ytterligare steg för varje besökares webbläsare, inklusive domänupplösning, anslutning och filnedladdning. Små fördröjningar på 100-300 ms i mobila nätverk kan, när de kombineras med flera typsnittsfamiljer och olika vikter, avsevärt fördröja den totala sidladdningen. Därför är den lokala lagringen av typsnitt inte bara en teknisk detalj; det är en strategi för snabbare, mer kontrollerad och mer hållbar webbprestanda.
I den här guiden kommer vi steg för steg att gå igenom vad det innebär att lokalt lagra typsnitt, när det är fördelaktigt, hur man implementerar det på WordPress eller anpassade mjukvarusajter och vilka misstag du bör undvika enligt SEO-standarder för 2026. Dessutom finner du praktiska förslag på hur du kan planera typsnittoptimering medan du använder en snabb och säker hostinginfrastruktur på Hostragons. Ditt val av hosting är grundläggande för prestandan, medan typsnittoptimering är en finjustering av denna grund. Du kan överväga Hostragons webbhostingpaket för relaterade infrastrukturalternativ.
Vad Är Lokala Typsnitt?
Lokala typsnitt innebär att lagra typsnittsfiler i filsystemet på din webbplats och servera dem till besökare därifrån. Istället för att hämta typsnitt som Inter, Roboto eller Montserrat från Google Fonts laddar du ner de relevanta WOFF2-filerna och laddar upp dem i din webbplats /fonts eller /assets/fonts-mapp. Sedan definierar du sökvägen till dessa filer i din CSS med @font-face-regeln. När sidan laddas hämtar webbläsaren typsnittet direkt från ditt domännamn istället för att gå till externa typsnittstjänster.
Denna metod är särskilt viktig ur perspektivet av prestanda, integritet och kontroll. Du bestämmer vilket format typsnittsfilerna ska serveras i, hur länge de ska cachas, vilka vikter som ska laddas och på vilka sidor de ska användas. Om din webbplats bara använder vikterna 400 och 700, behöver du inte lagra onödiga filer som 300, 500, 600 och 800. På så sätt minskar den totala filstorleken och CSS-komplexiteten.
I praktiken finns det tre huvudsakliga komponenter i en självhostad typsnittslösning: optimerade typsnittsfiler, korrekt CSS-definition och effektiv servercaching. Om någon av dessa saknas kan den förväntade hastighetsökningen bli begränsad. Om du exempelvis använder en gammal TTF-fil istället för WOFF2 kommer filstorleken att öka. Om cache-headers är felaktiga kan besökaren behöva ladda ner samma typsnitt på varje sida. Om förladdning används felaktigt kan webbläsaren prioritera onödigt.
Varför Är Typsnittoptimering Viktigt för SEO?
Google bedömer användarupplevelsen med direkta och indirekta signaler i sina rankningssystem. Webbplatsens hastighet, mobilanvändbarhet, interaktionsfördröjningar och visuell stabilitet är centrala faktorer i denna bedömning. Typsnitt kan påverka Largest Contentful Paint, Cumulative Layout Shift och upplevd laddningstid. Om texten i rubriken eller på första skärmen renderas med ett speciellt typsnitt kan en fördröjning i typsnittsfilerna påverka LCP-värdet negativt.
I SEO-strategin för 2026 är teknisk tillgänglighet lika viktig som innehållskvalitet. Googlebot måste kunna få tillgång till dina resursfiler när den genomsöker din sida, och användare ska kunna se sidan snabbt och stabilt. Fördröjningar hos externa typsnittleverantörer, landspecifika åtkomstproblem eller DNS-problem som uppstår från tid till annan ligger utanför din kontroll. Att lokalt lagra typsnitt minskar denna osäkerhet.
Låt oss ge ett användarcentrerat exempel: På en företagswebbplats med en total sidstorlek på 1,8 MB kan fyra olika Google Fonts-familjer, åtta vikter och två varianter leda till att enbart typsnittsförfrågningarna når 450-700 KB. Även om vissa av dessa filer inte används på första skärmen kan webbläsaren begära dem på grund av CSS. När samma design omarbetas med två typsnittsfamiljer, tre vikter och ett WOFF2-subset kan typsnittstorleken minskas till 90-180 KB. Denna skillnad kan särskilt kännas av användare med 4G-anslutningar och på enheter med låg kapacitet.
Jämförelse mellan Externa Typsnittstjänster och Lokala Typsnitt
Det finns ingen universell lösning för varje webbplats. I vissa projekt kan externa typsnittstjänster vara tillräckliga, medan lokala lagringslösningar kan ge bättre resultat. Tabellen nedan ger en snabb översikt över de grundläggande skillnaderna att beakta när du fattar beslut.
| Kriterium | Externa Typsnittstjänster | Lokala Typsnitt |
|---|---|---|
| Kostnad för första anslutning | Extra DNS, TCP/TLS och tredjepartsförfrågningar kan tillkomma. | Typsnitten levereras från samma domän eller din egen CDN. |
| Kontroll | Begränsad kontroll över filversioner, headers och tjänstens beteende. | Format, cache, förladdning och antal filer kan helt hanteras. |
| Integritet | Besökarens webbläsare kan skicka förfrågningar till tredjeparts typsnittsdomaän. | Typsnittförfrågningar förblir inom din egen infrastruktur. |
| Enkel implementering | Snabb installation genom kopiera och klistra in. | Fildownload, CSS-definition och tester krävs. |
| Prestandapotential | Kan vara acceptabelt för små webbplatser. | Med rätt konfiguration är det mer förutsägbart och snabbare. |
Sammanfattningsvis, om du vill ha mer kontroll och prestanda är lokal lagring av typsnitt ett starkare alternativ. Men denna metod bör inte förenklas till att "ladda ner typsnitt och ladda upp dem på servern". Fel filformat, onödiga vikter eller felaktig CSS kan istället försämra prestandan.
Effekten av Lokala Typsnitt på Webbplatsens Hastighet
Typsnittsfiler kan ofta verka små; men i kedjan av sidladdning kan de bli kritiska resurser. Webbläsaren hämtar först HTML, följt av CSS-filer och identifierar typsnitten som definieras i CSS. Om dina rubriker, menyer eller brödtext är beroende av speciella typsnitt kan webbläsaren behöva vänta på typsnittsfilerna innan texten visas. I sådana fall kan användaren se vita områden, osynlig text eller plötsliga typsnittsförändringar.
För att förstå prestandapåverkan är tre mätvärden viktiga. För det första LCP, det vill säga när användaren ser det största innehållsobjektet på skärmen. För det andra CLS, som innebär förskjutningar i textens bredd och höjd på grund av typsnittsförändringar. För det tredje INP, vilket handlar om interaktionsrespons; även om typsnitt inte är den primära orsaken till INP-metriken kan tung CSS och onödiga resurser belasta huvudtråden och skapa en indirekt påverkan.
En väloptimerad typsnittsstrategi har följande mål: typsnittet som används på första skärmen ska vara under 100 KB, onödiga varianter ska inte laddas, typsnittsfiler ska serveras med långvarig cache och kritiska typsnitt ska förladdas när det behövs. Om samma typsnittsfamilj med vikterna 400 och 700 räcker för rubriker, priser och CTA-text på en e-handelsproduktsida är det slöseri att ladda upp nio olika vikter. För att stärka hastigheten på din e-handelsinfrastruktur kan du även kolla in Lösningar för högpresterande hosting sidan.
Rätt Typsnittformat för Självhostade Typsnitt
Varför är WOFF2 det bästa valet?
WOFF2 är det mest effektiva typsnittformatet för moderna webbplatser i de flesta scenarier. WOFF2 erbjuder bra komprimeringsförhållanden och stöds av majoriteten av aktuella webbläsare. Även om TTF eller OTF-filer är lämpliga för design och skrivbordanvändning, är de ofta onödigt stora ur prestandasynpunkt. Äldre format som EOT är nu bara meningsfulla för mycket gamla webbläsare.
Till exempel kan TTF-versionen av samma typsnitt vara 300 KB, medan WOFF2-versionen kan ligga mellan 80-120 KB. När du använder flera vikter multipliceras denna skillnad. Därför bör du när du lagrar typsnitt lokalt använda WOFF2-filer som är optimerade för webben istället för att ladda upp filerna i sin ursprungliga storlek.
Bör du använda variable fonts?
Variable fonts kan rymma flera vikter eller stilvarianter i en enda fil. Om din design använder många vikter mellan 300 och 800 kan variable fonts vara meningsfulla. Men om du endast använder 400 och 700 kan två separata statiska WOFF2-filer ibland ge en mindre total storlek. När du fattar beslut bör du testa filstorleken, antalet använda varianter och webbläsarstöd.
En erfaren prestandaansats är följande: Först lista de typsnittsvikter som verkligen används i ditt designsystem. Jämför sedan den totala KB-värdet för statiska och variabla alternativ. Välj det som är mindre, enklare och mer stabilt. Mätresultat bör vara en del av designprocessen, precis som estetiska beslut.
Hur Man Lokalt Lagrar Typsnitt?
Nedan följer steg som kan anpassas för WordPress, anpassade PHP-applikationer, Laravel, Node.js-baserade projekt och statiska webbplatser. Logiken är densamma: ta bort onödiga typsnitt, optimera nödvändiga filer, servera dem från din egen server och testa resultatet.
1. Granska din nuvarande typsnittsanvändning
Det första steget är att ta reda på vilka typsnitt din webbplats använder och varifrån de hämtas. Använd "font"-filtret i Chrome DevTools Network-fliken för att lista alla typsnittsförfrågningar. Du kan även kontrollera render-blocking-resurser och tredjepartsförfrågningar i rapporter från PageSpeed Insights, WebPageTest eller Lighthouse. Sök efter svar på följande frågor: Hur många typsnittsfamiljer används? Hur många vikter laddas? Vilken domän kommer typsnitten från? Hur många av dem är verkligen nödvändiga på första skärmen?
Många webbplatser har teman, sidbyggare och plugins som var och en hämtar typsnitt separat. Till exempel kan temat hämta Roboto medan sidbyggaren hämtar Montserrat och formulärpluginet hämtar Open Sans. Även om detta kanske inte märks visuellt, medför det en prestandakostnad. Genom att fastställa ett enda designsystem kan du ofta minska antalet typsnittsfamiljer och därmed uppnå stora vinster.
2. Ladda ner och förenkla de nödvändiga typsnittsfilerna
Kontrollera licensvillkoren för det valda typsnittet. Öppen källkod typsnitt tillåter vanligtvis lokal lagring; men kommersiella typsnitt kan ha regler som begränsar filhosting, domängränser eller sidvisningslicenser. När licensen är godkänd, ladda ner endast de vikter och stilar du behöver. Latin Extended-teckensupport är viktig för svenska; se till att tecken som "å, ä, ö" inte saknas.
För ytterligare optimering kan du skapa subsets. En subset handlar om att ta bort teckengrupp som inte används från typsnittsfiler. För en webbplats som publicerar på både svenska och engelska är Latin och Latin Extended vanligtvis tillräckligt. Om du inte använder kyrilliska, arabiska eller grekiska tecken kan dessa grupper tas bort för att minska storleken. Men på flerspråkiga webbplatser kan för tidig subset-felaktighet leda till att texten ser trasig ut. När du planerar domännamn och språkstrategier för flerspråkiga projekt kan du överväga Guide till domänval och flerspråkiga sidor innehållet.
3. Ladda upp typsnitten i rätt mapp
Lag lagra typsnittsfiler i en organiserad mappstruktur. Du kan använda läsbara filnamn som /assets/fonts/inter/inter-400.woff2 och /assets/fonts/inter/inter-700.woff2. Att lägga till versionsinformation i filnamnet förenklar cachehantering: inter-400-v2.woff2. På så sätt undviker du problem med gamla cache när du uppdaterar typsnittet.
Du kan använda filhanteraren i ditt hostingpanel, FTP eller Git-baserad distribution. Filbehörigheter bör vanligtvis vara 644 och mappbehörigheter 755. Typsnittsfiler måste vara offentligt läsbara; annars får webbläsaren ett 403-fel och faller tillbaka på systemtypsnittet. Kontrollera även MIME-typkonfigurationen på serversidan. Den korrekta innehållstypen för WOFF2 bör vara font/woff2.
4. Definiera @font-face i CSS
Den centrala delen av att lokalt lagra typsnitt är @font-face-regeln. En enkel definition ser ut som följer: @font-face { font-family: Inter; src: url('/assets/fonts/inter/inter-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }. För den fetstilta versionen av samma typsnitt lägger du till en separat definition med font-weight: 700.
En av de mest kritiska raderna här är font-display: swap. Detta värde tillåter webbläsaren att visa texten med systemtypsnittet tills det speciella typsnittet har laddats. Detta minskar problemet med osynlig text. Men när swap används kan det uppstå en liten förskjutning under typsnittsförändringen. För att minska detta bör du välja ditt systemfallback typsnitt så att det liknar det speciella typsnittet. Till exempel kan Arial eller system-ui vara rimliga alternativ för Inter i de flesta fall.
5. Förladda kritiska typsnitt
Förladdning är ett starkt meddelande till webbläsaren att en viss resurs ska laddas tidigt. Att förladda huvudtypsnittsfilen som används för rubriker och brödtext på första skärmen kan förbättra LCP. Men det är en misstag att förladda varje typsnitt. Webbläsaren kan då fördela bandbredden på onödiga resurser och försena bilder eller kritisk CSS.
Som en allmän regel, förladda endast 1 eller högst 2 typsnittsfiler som används säkert på första skärmen. Om huvudtypsnittet för kroppen är 400 och typsnittet för rubriken är 700 och de syns på första skärmen kan dessa två filer vara kandidater. Om det kursiva typsnittet inte används på första skärmen, förladda det inte. Efter förladdning, kontrollera i Network-fliken att typsnittet verkligen laddades tidigt och att det inte fanns några dubbla nedladdningar.
6. Konfigurera cache och komprimeringsinställningar
Typsnittsfiler är statiska tillgångar som vanligtvis inte ändras ofta. Därför bör de serveras med långvariga webbläsarcacheinställningar. Cache-Control-headern med public, max-age=31536000, immutable är ett vanligt val. När du använder versionsinformation i filnamnet gör det en års cache säker; eftersom du ändrar filnamnet när en uppdatering behövs.
WOFF2 är redan ett komprimerat format; därför förväntas inga stora vinster från Brotli eller Gzip. Ändå är serverns prestanda för att servera statiska filer viktig. Om du använder infrastrukturfördelar som LiteSpeed, NVMe-disk och korrekt cachekonfiguration på Hostragons kan typsnittsfilerna svara mycket snabbare. Att SSL installeras korrekt på servern är också viktigt för HTTP/2 och HTTP/3-prestanda; guide för installation av SSL-certifikat och HTTPS kan vara användbar här.
Lokal Typsnittslagring på WordPress Webbplatser
I WordPress varierar typsnittoptimeringen beroende på tema, plugin och sidbyggare. Kontrollera först om ditt tema kan stänga av Google Fonts-förfrågningar. Många moderna teman erbjuder alternativ för att stänga av Google Fonts i typografiska inställningar. Elementor, Gutenberg-blockplugins eller slider-plugins kan också ha sina egna typsnittsinställningar. Gå igenom alla komponenter för att förhindra att samma typsnitt laddas flera gånger från olika källor.
Den tekniskt renaste metoden är att lagra typsnittsfiler i ett child theme och lägga till CSS-definitionerna i din temas stilfil. Du kan också använda plugins för lokal typsnittslagring; men att öka antalet plugins onödigt kan strida mot prestandamålet. Om du väljer att använda ett plugin, kontrollera senaste uppdateringsdatum, PHP-kompatibilitet och dess kompatibilitet med din cache-plugin.
Innan du gör ändringar på din WordPress-webbplats, se till att du har en säkerhetskopia. När du tar bort typsnittsförfrågningar kan du oavsiktligt förstöra ikontypsnitt eller stil för administrationspanelen. Särskilt på WooCommerce-webbplatser är det viktigt att testa kundvagnens, kassan och kontosidorna. Om du letar efter en prestandaorienterad infrastruktur för din företags-WP-webbplats kan du överväga WordPress hostingpaket i ditt innehåll.
Kollista för Teknisk SEO och Core Web Vitals

Efter att ha optimerat typsnitt är det inte tillräckligt att bara kontrollera om "webbplatsen laddar". Du måste mäta, jämföra tidigare och eftervärden och utföra tester som ligger nära den verkliga användarupplevelsen. Följande kontrollista ger en praktisk start.
- Verifiera i Network-fliken att externa typsnittförfrågningar som Google Fonts, fonts.gstatic eller liknande har tagits bort.
- Försök att hålla det totala antalet typsnittsfiler mellan 2 och 4 om möjligt.
- Kontrollera att du använder WOFF2-format och att filstorlekarna är rimliga.
- Testa font-display: swap eller optional-värdet i lämpliga scenarier.
- Gör inte onödig förladdning av typsnitt förutom det mest kritiska typsnittet som används på första skärmen.
- Verifiera att Cache-Control-headerna är lämpliga för långvarig caching.
- Testa att svenska tecken visas korrekt i alla webbläsare.
- Jämför resultat från mobil PageSpeed Insights, Lighthouse och WebPageTest med mätningar före ändringen.
Förlita dig inte på ett enda testresultat. Nätverksförhållanden, serverbelastning och testlokalisering påverkar resultaten. Att göra minst tre tester och titta på den genomsnittliga trenden ger en mer pålitlig bild. Om LCP sjunker från 2,8 sekunder till 2,3 sekunder innebär det en betydande förbättring. Om CLS ökar efter typsnittoptimering, granska valet av fallback typsnitt och typsnittsmätningar igen.
Vanliga Misstag
Att använda för många typsnittsfamiljer
Det vanligaste misstaget är att skapa onödig mångfald i designen. När ett typsnitt används för rubriker, ett annat för brödtext, ett tredje för knappar och ett fjärde för citat ökar prestandakostnaden. De flesta professionella webbplatser kan skapa en stark visuell identitet med en eller två typsnittsfamiljer. Konsistens i typografi är viktig för både hastighet och varumärkesuppfattning.
Att välja fel fallback typsnitt
Det systemtypsnitt som visas innan det speciella typsnittet har laddats kan orsaka textförskjutningar om det har mycket olika dimensioner. Detta kan öka CLS-värdet. Var noga med att välja fallback typsnitt som liknar x-height, bokstavsbredd och radavstånd. Testa alternativ som system-ui, Arial, Helvetica, Georgia beroende på din design.
Att förladda allt
Förladdning är ett kraftfullt men skadligt verktyg om det används felaktigt. Att förladda alla typsnittsvikter kan förstöra webbläsarens prioritetsordning. Detta kan förvärra LCP istället för att förbättra det, särskilt på sidor med hjältbilder. Gör förladdningsbeslut baserat på verklig användning och testresultat för första skärmen.
Att bortse från licensvillkor
Inte varje typsnitt är gratis eller obegränsat. Kommersiella typsnitt kan ha olika licensvillkor för webb. Att publicera ett typsnitt som inte tillåter lokal lagring kan medföra juridiska risker. Arkivera alltid licenstexten innan du publicerar typsnitt och håll den i dokumentationen för projektet.
Säkerhet, Integritet och Infrastrukturens Betydelse
Att lokalt lagra typsnitt handlar inte bara om hastighet; det ger även fördelar för integritet och säkerhet. När externa typsnittstjänster används kan besökarens webbläsare skicka förfrågningar till tredjepartsdomäner. I vissa branscher bör detta beaktas i förhållande till KVKK och databehandlingsprocesser. Eftersom typsnittförfrågningar vid lokal lagring sker via ditt eget domännamn blir datatrafiken mer förutsägbar.
På infrastrukturens sida är HTTPS obligatoriskt. Om typsnittsfiler hämtas över HTTP kan det uppstå problem med blandat innehåll eller blockeringar från webbläsaren. Din domäns DNS-konfiguration, SSL-certifikat och hostingprestanda spelar en grundläggande roll här. Om du startar ett nytt projekt kan du kolla in Domänsökning och registrering för domänval, SSL-certifikat för säker publicering och Hostragons hostinglösningar för stark hosting.
Om du också använder en CDN, kontrollera CORS-inställningarna för typsnittsfilerna. Om typsnitt serveras från en annan subdomän kan Access-Control-Allow-Origin-headern vara nödvändig. Annars kanske webbläsaren inte kan ladda ner och använda typsnittsfilerna. Att servera från samma domän är enklare och smidigare för de flesta små och medelstora webbplatser.
Hur Mäter Man Prestandavinster?
Beviset på en framgångsrik optimering är mätning. Registrera först det nuvarande tillståndet: totala antalet typsnittsförfrågningar, total typsnittstorlek, LCP, CLS och total laddningstid. Genomför sedan lokalt lagring och testa samma sidor med samma verktyg. Mät olika mallar som startsidan, blogginlägget, kategorisidan och eventuella produktsidor separat.
I ett exempel kan en blogg med inledningsvis 6 typsnittsförfrågningar och 420 KB typsnittsdata efter optimering minska till 2 typsnittsförfrågningar och 96 KB typsnittsdata. Mobil Lighthouse-prestandapoängen kan öka från 72 till 86; LCP kan minska från 3,1 sekunder till 2,4 sekunder. Dessa siffror är dock inte garanterade, eftersom bilder, JavaScript och serverns svarstid också påverkar. Men typsnittoptimering är ofta en av de snabbaste och mest lättmätta förbättringarna.
För verkliga användardata ger Chrome User Experience Report, Search Console Core Web Vitals-rapporten eller RUM-verktyg mer värdefulla insikter. Laboratorietester är bra för att identifiera problem; verkliga användardata visar dock effekten av optimeringen i praktiken. Om din webbplats har hög trafik är det säkrare att implementera förändringar först i en staging-miljö och sedan under lågtrafikperioder.
Genomförbar Mini-plan: Typsnittoptimering på 60 minuter
Om din tid är begränsad kan du snabbt komma igång med följande plan. Under de första 10 minuterna, använd DevTools för att lista nuvarande typsnittsförfrågningar och ta en skärmdump. Under nästa 10 minuter, identifiera de typsnittsfamiljer och vikter som faktiskt används i designen. Inom 15 minuter, ladda ner de nödvändiga WOFF2-filerna, kontrollera svenska tecken och ladda dem till /assets/fonts-mappen.
Därefter, under 15 minuter, lägg till CSS @font-face-definitioner, använd font-display: swap och ta bort gamla externa typsnittsreferenser. Under de sista 10 minuterna, gör mobiltester, verifiera att det inte finns några kvarvarande externa typsnittsförfrågningar i Network-fliken och kontrollera sidan i olika webbläsare. Avancerade optimeringar som cache-headers, förladdning och subsets kan du ta hand om senare.
Denna plan ger snabba resultat, särskilt för små företagswebbplatser, bloggar och företags presentationssidor. För stora e-handels- eller SaaS-projekt är det dock mer korrekt att ta itu med typsnittoptimering i samband med designsystem, komponentbibliotek och distributionsprocesser.
Slutsats
Att lokalt lagra typsnitt är en effektiv metod som, när den görs korrekt, förbättrar webbplatsens hastighet, användarupplevelse och teknisk SEO-kvalitet. De viktigaste punkterna är att använda WOFF2, ta bort onödiga typsnittsvikter, definiera font-display, noggrant förladda kritiska typsnitt och servera filer med starka cache-inställningar. Denna process löser inte alla prestandaproblem, men kan ge snabba, pålitliga och mätbara vinster.
Ju starkare din hostinginfrastruktur är, desto mer nytta får du av optimeringarna. Om du vill göra din webbplats snabbare och säkrare kan du kolla in Hostragons lösningar för hosting, domäner och SSL; och implementera typsnittoptimering som en del av din övergripande prestandaplan. Mät först, förbättra sedan och verifiera resultaten med användarupplevelsen utan försäljningspress.
Vanliga Frågor
Är lokala typsnitt alltid snabbare än Google Fonts?
Inte alltid. Med rätt cache, WOFF2, få filer och bra serverrespons är det vanligtvis mer förutsägbart och snabbare. Men felaktigt konfigurerade lokala typsnitt kan vara långsammare än optimerad extern användning.
Vilket typsnittformat bör jag använda för självhostade typsnitt?
WOFF2 är oftast det bästa valet för moderna webbplatser. Det erbjuder mindre filstorlekar och bred webbläsarstöd. TTF- eller OTF-filer är ofta onödigt stora för webbprestanda.
Hur många typsnittsvikter är idealiska?
För de flesta webbplatser räcker vikterna 400 och 700. I vissa designer kan 500 eller 600 läggas till; men varje ny vikt innebär extra fil- och laddningskostnader. Onödiga vikter bör tas bort.
Är font-display: swap obligatoriskt?
Det är inte obligatoriskt, men rekommenderas i de flesta scenarier. Det säkerställer att texten visas tills det speciella typsnittet har laddats och minskar problemet med osynlig text. För att undvika CLS bör ett lämpligt fallback typsnitt väljas.
Behöver jag en plugin för att lokalt lagra typsnitt i WordPress?
Nej, det är inte nödvändigt. Att ladda upp typsnittsfiler i ett child theme och definiera dem i CSS är en av de renaste metoderna. Men om dina tekniska kunskaper är begränsade kan du även använda en pålitlig och uppdaterad plugin.