Visste du att din webbläsare automatiskt laddar ner och använder teckensnitt som inte är installerade på ditt system? Webfonter hjälper de sidor du bläddrar varje dag ser bättre ut. Här är vad de är och hur de fungerar.
Skrivbordsfonter vs. Webfonter
Vi använder alla teckensnitt varje dag. Några av dem Kom med ditt operativsystem , vissa kommer från applikationer som Adobe Creative Suite eller Microsoft Office, och vissa är de som du hämtar eller köper och Installera dig själv . När de är installerade kan du använda dessa teckensnitt i Word-processorer, bildredigeringsprogram och mer. Dessa är skrivbordsfonter, och de är lagrade lokalt.
En annan typ av teckensnitt har blivit viktigare eftersom vår beräkningsupplevelse har flyttat online. Det här är webbfonter-typografi som är lagrade på molnet (och sedan cachas i din webbläsare) och används för att generera texten som visas på webbplatser.
En kort historia av webbfonter
I de tidiga dagarna av Internet var typografi på webbsidor begränsad till vilka teckensnitt som installerades på ditt system. Om ett teckensnitt inte var installerat, skulle webbsidan ladda en standard "fallback" -font som var mer sannolikt att vara tillgänglig. På grund av detta valde webbdesigners ofta standardsystemfonter för sina webbplatser.
Bland dessa var Microsofts Kärnfonter för webben , en uppsättning typsnitt gjorda fritt tillgängliga för webbdesign. Detta paket ingår allmänt använda systemfonter som Times New Roman, Arial, Komiska sans och Trebuchet. Alternativt kan designers använda fontfamiljer som Serif, Sans-Serif och monospace för att ange den allmänna stilen på ett teckensnitt även om en viss var inte tillgänglig.
Detta ändrades 2010 när Google lanserade Google-teckensnitt , ett stort open-source-förråd för fria teckensnitt som kan användas var som helst på webben. Sedan dess har andra konkurrenter, som Adobes TypeKit och Web-Hosted Font Plugins, uppstått. Miljoner webbplatser från hela världen körs på webbfonter, inklusive Googles produktivitetsvit .
Hur webbfonter fungerar
Den största webbfonter, Google-teckensnitt, är ett expansivt webbbibliotek på över tusen teckensnitt. Du kan använda dem på din webbplats genom att dra dem via CSS, och mobilutvecklare kan komma åt dessa teckensnitt när du skapar Android-appar.
När en webbsida använder Google-teckensnitt, drar det ett teckensnitt från Googles databas och visar sedan texten i den teckensnittet till dig i din webbläsare. Dessa teckensnitt är värd på Googles server och laddas nästan omedelbart. Övriga molnfontjänster fungerar mycket på samma sätt.
Ett annat alternativ använder självhärdade, inbäddade teckensnitt på webben istället. Detta görs genom Web Open Font Format (WOFF) -A komprimerad teckensnitt som utvecklats av Mozilla som är kompatibel med de flesta moderna webbläsare. WOFF är användbart om du vill bädda in ett anpassat teckensnitt som inte är tillgängligt på en webbtjänst.
Få webbfonter
Google Fonts-förvaret och alla teckensnitt under det är helt fritt att använda och tillgängligt för alla. Det använder bara teckensnitt under en öppen licens, och många av dessa teckensnitt har blivit häftklamrar av webbdesign, som Roboto, Lato och Montserrat. Google är värd för en webbplats Det listar alla dess tillgängliga teckensnitt och låter dig prova dem och jämföra dem med varandra. Google erbjuder också en databas med gratis vektorikoner.
Eftersom dessa teckensnitt är tillgängliga, kan du ladda ner de ursprungliga teckensnittsfilerna För användning på skrivbordet också. Många webbplatser är värd för Google Fonts-repositories, inklusive Googles egen github . Du kan använda dessa teckensnitt i projekt, dela dem fritt med andra, och ladda ner dem från andra platser på Internet gratis.
Många webbplatsbyggare och innehållschefer som WordPress och Squarespace kommer med stöd för webbfonter ut ur lådan. Om du använder en anpassad webbplats måste du ladda upp teckensnittsfilen till din server och använda CSS-koden för att peka på den teckensnitt som du vill använda.
Om du vill lära dig mer om att använda webbfonter för din webbplats, kolla in det här CSS Web Font Guide från w3schools.
RELATERAD: Så här installerar du och hanterar teckensnitt i Windows 10s Inställningar App
