First Contentful Paint (FCP)

First Contentful Paint, vanligtvis förkortat FCP, är en webbprestandamått som mäter tiden från det att en sida börjar laddas till det ögonblick då webbläsaren renderar det första synliga innehållet, såsom text, en bild eller en bakgrundsfärg, på skärmen. Det mäts i sekunder eller millisekunder och återspeglar användarens första visuella bekräftelse på att en sida faktiskt laddas, i motsats till att stirra på en tom vit skärm och undra om något alls händer, vilket är anledningen till att det klassificeras som en av de viktigaste mätvärdena för laddningsupplevelse som spåras i verktyg som Google Lighthouse och Chrome User Experience Report. FCP skiljer sig från Time to First Byte, som bara mäter serverns svarstid innan rendering börjar, eftersom ett snabbt serversvar fortfarande kan följas av ett långsamt FCP om renderingsblockerande skript eller stilmallar försenar webbläsaren från att måla något på skärmen.

FCP är viktigt eftersom den upplevda hastigheten starkt påverkar om en besökare stannar kvar på en sida eller lämnar den innan den har laddats helt. Forskning från Google och andra oberoende prestandastudier har upprepade gånger visat att när sidans laddningstid ökar ökar sannolikheten för avvisningar kraftigt, med fördröjningar på bara en till tre sekunder som mätbart ökar sannolikheten för att en besökare lämnar sidan innan något innehåll alls visas på skärmen. Eftersom FCP fångar det ögonblick då en användare först ser tecken på framsteg, formar det direkt tidiga intryck av ett varumärkes tillförlitlighet och tekniska kvalitet, särskilt för förstagångsbesökare som kommer från en betald annons eller ett sökresultat som inte har någon tidigare lojalitet eller bekantskap som håller dem tålmodiga genom en långsam initial laddning och som helt enkelt kommer att prova en konkurrents länk istället.

FCP mäts med både laboratoriebaserade verktyg, som Google Lighthouse eller WebPageTest, som simulerar en sidbelastning under kontrollerade nätverks- och enhetsförhållanden på ett repeterbart sätt, och fältbaserade verktyg, som Chrome User Experience Report som nås via Google Search Console eller PageSpeed ​​Insights, som aggregerar verkliga FCP-data som samlats in från faktiska Chrome-användare som besöker sidan under genuint varierande nätverksförhållanden. Google klassificerar generellt en FCP under 1.8 sekunder som bra, mellan 1.8 och 3 sekunder som behöver förbättras och över 3 sekunder som dålig, även om dessa tröskelvärden fungerar som riktlinjer snarare än absoluta krav, eftersom acceptabel prestanda också i hög grad beror på de typiska enhets- och nätverksförhållandena för en webbplats faktiska, verkliga publik på dess specifika marknader.

En vanlig missuppfattning är att FCP ensamt indikerar att en sida är fullt användbar, när det i själva verket bara bekräftar att visst innehåll har dykt upp, inte att sidan är interaktiv eller att dess huvudsakliga, meningsfulla innehåll, såsom en produktbild eller rubrik, faktiskt har renderats ännu; relaterade mätvärden som Största innehållsrika färg och Tid till interaktivitet fångar istället upp dessa senare, mer meningsfulla milstolpar. Ett annat vanligt misstag är att optimera FCP genom tekniker som förbättrar den labbet uppmätta poängen utan att förbättra upplevelsen för riktiga användare, till exempel genom att rendera en lätt platshållare eller skelettskärm omedelbart medan det faktiska meningsfulla innehållet fortfarande laddas långsamt efteråt, vilket kan ge ett missvisande bra FCP-poäng tillsammans med en genuint frustrerande verklighetsupplevelse för besökaren.

Inom CRO- och UX-konsulttjänster utvärderas FCP och relaterade Core Web Vitals vanligtvis tidigt i alla tekniska revisioner, eftersom långsamt laddande sidor sänker alla konverteringsmått nedströms oavsett hur väl en sida är utformad i övrigt, och eftersom sidupplevelsesignaler, inklusive laddningsprestanda, sedan 2021 har beaktats i Googles sökrankningsalgoritm, vilket kopplar prestandaarbete direkt till både konverteringsfrekvens och organisk synlighet samtidigt. Vanliga åtgärdsstrategier inkluderar att optimera och komprimera bilder, minska renderingsblockerande JavaScript och CSS på den kritiska renderingsvägen, utnyttja webbläsarcachning och använda ett innehållsleveransnätverk, vilka alla vanligtvis rekommenderas tillsammans med, snarare än istället för, djupare design- och innehållsfokuserat CRO-arbete som sker parallellt på samma sidor. Eftersom prestandaregressioner ofta smyger sig in gradvis när nya skript och tredjepartstaggar läggs till över tid, behövs vanligtvis kontinuerlig övervakning snarare än en enda engångsåtgärd för att hålla FCP inom ett acceptabelt intervall.