Core Web Vitals: Hvorfor JAMstack er løsningen

Core Web Vitals er tre nye metrics som er inkluderet i den nye Google Page Performance algoritme, der lancerede i Juni 2021. Disse nye faktorer påvirker hvordan Google producerer placeringer i søgeresultater. Så det er helt afgørende for din SEO indsats at være tydelig med sidde nøgletal.

Tips and inspiration

6 min read

Core Web Vitals: Why JAMstack could hold the key

Cobiros Content Team

I denne artikel forklarer vi hvad metrics er, hvordan du kan måle din score og hvorfor JAMstack hjemmesider er velegnet til at opfylde og overgå de nye standarder.

Google’s nye Page Experience algoritme

Googles ultimative mål er at tjene mennesker og en af måderne at gøre det på, er at se hvor god brugeroplevelsen af din hjemmeside er. Hjemmesider som opfylder brugernes ønsker på den mest effektive mål, scorer langt højere end dem som ikke gør.

Med en gradvis lancering fra Juni 2021, begynder Google med at kombinere nogle af sine eksisterende søgemeldinger med sine nye Core Web Vitals, der samles for at danne en Page Experience algoritme. Den nye opdatering forventes at være færdig i slutningen af August. 

Eksisterende søgemuligheder inkluderer ting som kompatibilitet med mobilenheder, browsing og en sikker forbindelse, som du kan læse om i vores artikel om page experience. I denne artikel fokuserer vi på de nye Core Web Vitals.

Core Web Vitals

Opdelt i tre specifikke målinger, er Core Web Vitals et sæt af faktorer som Google synes er vigtige for brugernes generelle oplevelse. 

De går dybere end nogensinde før og måler forskellige ting som loade-tid, interaktivitet og stabilitet - som altsammen har en betydelig indvirkning på den måde en bruger opfatter og interagerer med en hjemmeside.

1. Largest Contentful Paint (LCP)

Dette er en måling af tiden det tager for at indlæse den største del af indholdet på din hjemmeside. 

Google tager billedet eller den største tekstblok på hjemmesiden som reference og beregner behandlingstiden (den er fuldt indlæst og synlig) i forhold til, hvornår siden begyndte at indlæse. Desto længere brugerne skal vente, desto værre en brugeroplevelse har de. 

Sigt efter: En loade-tid på under 2.5 sekund.

2. First Input Delay (FID)

Dette er en måling af tiden det tager på din hjemmeside at bliver interaktivt og responsivt. 

Google beregner den tid der går, fra en bruger interagerer med din side for første gang, indtil det øjeblik hvor browseren kan reagere på den interaktion.

Sigt efter: en input forsinkelse på mindre end 100 millisekunder.

3. Cumulative Layout Shift (CLS)

Dette er en måling af hvor ofte uforudsete bevægelser sker på siden.

Elementer, som tredjeparts reklamer eller billeder uden dimensioner som ændrer sig som brugeren er på siden, kan bidrage til en dårlig brugeroplevelse. Google analyserer den plads et element fylder og hvor meget det bevæger sig på en skærm for at bestemme en CLS score.

Sigt efter: en score på under 0.1.

Sådan måler du din hjemmesides Core Web Vitals

Da Core Web Vitals optager den største del af din Page Experience (brugeroplevelse) score, er det vigtigt at gennemgå din hjemmeside og følge trinene for at optimere inden opdateringen.

Der er flere værktøjer til dette, men Googles PageSpeed Insights er et godt sted at starte.

For at komme i gang skal du indtaste hele webadressen på en af dine sider. Klik på “analyse” så du kan se din score. Bemærk, at du øverst på siden kan skifte fra mobilversionen til desktop versionen. 

Den samlede score for din hjemmeside er ud af 100. Er den under 50 (rød) betragtes den som dårlig, mellem 50 og 89 (orange) skal den forbedres og er den mellem 90 og 100 (grøn) er den god.

Hvert område er opdelt med specifikke anbefalinger til de trin der skal følges for at opnå en bedre score.

Forbedre din Core Web Vitals score med en JAMstack hjemmeside

Implementering af de nødvendige forbedringer af din hjemmeside kan være kompleks og tidskrævende, men overgangen til JAMstack tilgangen kan gøre processen meget lettere. 

Lad os se nærmere på, hvad JAMstack er og hvordan denne teknologi kan overvinde de udfordringer som giver en lav Core Web Vitals score.

Hvad er JAMstack?

JAMstack er en moderne tilgang til bygningen af hjemmesider. Det er hverken et programmeringssprog eller et værktøj, men et arktitektur som leverer hurtige og brugervenlige hjemmesider.

Det er et akronym som står for JavaScript, Application Programming Interfaces (APIs), og Markup. Hvert komponent er opdelt så de er nemmere at arbejde med. Dette er kendt for at være ‘afkobling’. Dog interagerer de med hinanden for at levere det endelige resultat (‘Stack’ delen).

CDN’er

Med en JAMstack hjemmeside, er indholdet genereret i formen af filer fra hjemmesidens originale server, som derefter distribueres via et content delivery network (CDN) - et globalt netværk af servere.

Netværket samarbejder om at reducere afstanden som indholdet af din hjemmeside skal rejse før den når til slutbrugeren. Så hvis din bruger sidder i USA og får adgang til din hjemmeside baseret i Danmark, vil indholdet blive leveret til den nærmeste server hvorend brugeren er baseret. På denne måde forkorter CDN’er distancen indholdet af din hjemmeside skal rejse.

Læs mere om JAMstack i vores guide.

I praksis

Lad os se på tre udfordringer vedrørende dårlig brugeroplevelse og udforske hvordan JAMstack hjemmesider er bygget til at løse og overkomme dem.

Problem nr.1: Indhold tager for lang tid om at loade

Løsning: Opgradér dine web hosting evner. Med en JAMstack hjemmeside, er du ikke afhængig af et enkelt host til at levere alt din indhold. Da siderne er genereret fra den nærmeste CDN server, er der mindre distance som indholdet skal rejse. Det betyder at siderne er lynhurtige til at loade, oftest under 1 sekund.

Problem nr. 2: Billeder og andre elementer, som kun indlæses når du ruller ned af siden.

Løsning: Generer indhold på forhånd, så det ikke bremser hastigheden af din hjemmeside. Men en JAMstack hjemmeside, bliver indholdet genereret i form af filer, som derefter er opbevaret som kopier på tværs af CDN-netværket. Det betyder, at når en hjemmeside indlæses, er billeder og andre elementer umiddelbart tilgængelige og klar til at blive vist på siden.

Problem nr. 3: Dynamiske elementer påvirker hastigheden

Løsning: Flyt de dynamiske funktioner til klient-siden (brugerens computer). JAMstack hjemmesider bruger API’er til at kommunikere med JavaScript filerne for at lette dynamisk data. Så hver gang en interaktiv opgave (som at udfylde et spørgeskema) kan den således udføres så tæt som muligt på det sted hvor brugeren befinder sig, hvilket muliggør et ultra-responsivt resultat.

Disse løsninger er blot nogle eksempler, men du vil bemærke at de alle har én ting til fælles: Styrken af CDN’er og deres evne til at overkomme de traditionelle flaskehalsproblemer som forårsager dårlig hjemmeside præstation.

Sådan starter du

Forvandle din eksisterende hjemmeside til en JAMstack løsning

Har du en statisk hjemmeside men ønsker at hoste den via et CDN? Lad Cobiro håndtere alle hosting behov og forvandle den til en lynhurtig JAMstack løsning. 

Cobiros GitHub forbindelse (beta) giver en direkte forbindelse mellem din headless CMS, din statisk-side generator og CDN host. 

Når det er implementeret, bliver indholdet af din hjemmeside leveret via Cloudflares CDN, som driver 16% af internetanmodningerne til Fortune 1,000 virksomheder og betjener i gennemsnit 20 millioner HTTP anmodninger per sekund.

Fra kode til JAMstack i 6 trin:

1. Vælg din headless CMS (f. eks. Dato CMS, Contentful eller Agility)
2. Brug en hjemmesides-generator til at bygge din statiske hjemmeside
3. Distribuere din kode til et Git Repository i GitHub
4. Log ind på Cobiro platformen og vælg GitHub forbindelsen
5. Find din kode og tryk på “ombyg”
6. Din hjemmeside er nu hosted via Cloudflares CDN

Kommer snart: CDN hosting vil være tilgængelig på alle vores betalte løsninger, som starter fra 19$ pr. måned. Find ud af mere.

Byg en JAMstack hjemmeside fra bunden

Cobiros website builder er den eneste gratis website builder på markedet som bruger JAMstack tilgangen. Det kræver inden kodning, installationer eller plug-ins. 

Når den er klar til at lancere, vil din hjemmeside være hurtig og sikker fra start.

Enkelhed

Brug vores drag-and-drop interface og vælg fra et væld af elementer og designs.

CDN drevet

Boost hastigheden og præstationen af din hjemmeside ved at distribuere den via et CDN.

Marketing integration

Vælg dine foretrukne apps og få adgang til dem fra platformen.

Gratis SSL certifikat

Beskyt din kunders fortrolige oplysninger ved at bruge det bedste af det bedste inden for hjemmeside-sikkerhed.

Domæne registrering

Få et professionelt domænenavn. Vælg mellem en gratis udvidelse hos Cobiro, eller køb en.

 Prøv den vores website builder gratis!

Ludzie też czytają

Bo, Cobiro's CEO and Ghazaleh, Cobiro's new COO
Welcome Ghazaleh, our new COO!

Company news

3 min read

What is jamstack
What is JAMstack? Your complete guide

Tips and inspiration

6 min read

Illustration of a person holding a tablet with lots of ideas
How to structure the perfect website

Tips and inspiration

3 min read

Zacznij za darmo już dziś!

Zacznij za darmo już dziś!

Zaczynaj
Zacznij za darmo już dziś!