Så här fixar du fonten till bloggen med Google Fonts

När jag skulle uppdatera min blogg med en ny font så tog det ett tag innan jag “förstod” hur det fungerade och hur jag skulle kunna gå tillväga. Fonten är viktig för läsandet, och om jag kommer ihåg rätt finns det en hel del forskning som backar upp faktumet att många läsare lämnar webbplatser för att fonten är för jobbig att läsa. Jag ska dock inte fördjupa mig mer i valet och kvalet mellan serif-fonter eller sans-serif, det lämnar jag i denna post till andra att göra. Jag tänkte däremot förklara hur jag gjorde för att underlätta för er andra bloggare eller administratörer av webbplatser för hur ni lätt byter ut fonten med hjälp av Google Fonts.

Ta dig till Google Fonts webbplats och välj och vraka bland de fonter som finns tillgängliga. De hittills mest vedertagna tipsen är att använda sans-serif fonter till rubriker och använda serif-fonter till bodytexter. I menyn till vänster kan du filtrera dig fram. Du kan välja flera fonter på en och samma gång att inkludera i script-anropet till Google som vi senare ska lägga till i sidhuvudet på webbplatsen. Du väljer fonter genom att klicka på “Add to collection”.

När du valt ut de fonter du vill ha så finns de samlade i nederdelen sidan, klicka dig fram till den sista fliken som heter “Use”. Där får du de koder du behöver samt instruktioner på hur du ska använda fonten. Du behöver huvudsakligen göra två saker: 1) Lägga till ett script-anrop för fonten mot Google Fonts webbplats, och 2) Ändra fonten till den nya i din CSS-mall. I “Use” fliken klipper du ut koden under punkt 3 (se bilden), den ska klistras in i ditt sidhuvud innanför head-taggen. För enkelhetens skulle kan du lägga den precis över eller under en liknande kod-snutt som hänvisar till din CSS-fil.

Därefter går du till din CSS-fil till webbplatsen och redigerar den del som styr ditt typsnitt. Du ser tips från Google i punkt 4 (se bilden) hur du ändrar till din nya font och markerar om det är “serif” eller “sans-serif” du ska använda. När du sparat din CSS så kan det ta ett tag innan det faktiskt uppdateras på webbplatsen då CSS-filen oftast är cachad av din läsare och eventuellt av koden din webbplats är byggd på.

Med Google Fonts så är det extremt enkelt att byta font, följ stegen ovan bara om du vill byta igenom längre fram. Det negativa är att du är begränsad till de fonter som finns på Google Fonts. Om du googlar runt så kommer du säkert hitta andra snygga fonter men du kan inte själva ladda ned och ladda upp dessa till Google Fonts om du inte har tillåtelse av de som skapat och äger fonten. Det som är positivt är just möjligheten att vem som helst kan lägga till flera nya fonter i Google Fonts så länge de har rättigheterna till fonten, vilket gör att du bör ta dig en titt lite då och då efter nya fonter.

Vad tycker du?

Denna webbplats använder Akismet för att minska skräppost. Lär dig hur din kommentardata bearbetas.