Kort antwoord: bij de meeste Shopify-winkels zijn apps en afbeeldingen, in die volgorde, het snelheidsprobleem. De oplossing ligt in het verwijderen en comprimeren in plaats van slimme technieken. Negeer de snelheidsscore van de beheerder; meet Largest Contentful Paint, Interaction to Next Paint en Cumulative Layout Shift van echte bezoekers, want dat is wat Google gebruikt en wat correleert met conversie.

Meet de juiste drie cijfers

De beheeromgeving van Shopify toont een snelheidsbeoordeling. Dit is een Lighthouse lab score — een gesimuleerde belasting op een gesimuleerd apparaat — en deze verandert om redenen die niets te maken hebben met je bezoekers. Handig om je winkel met zichzelf van vorige maand te vergelijken; niet wat Google gebruikt.

Google gebruikt veldgegevens: wat er daadwerkelijk gebeurde met echte mensen op echte verbindingen.

Metriek Meet Voldoet Gebruikelijke Shopify-boosdoener
LCP Wanneer de hoofdafbeelding of kop wordt weergegeven < 2.5s Hero-afbeelding lui geladen, ongecomprimeerd, of achter een slider
INP Hoe snel de pagina reageert op een tik < 200ms App JavaScript dat op de hoofdthread wordt uitgevoerd
CLS Hoeveel de lay-out verspringt < 0.1 Afbeeldingen zonder afmetingen, banners die laat worden geïnjecteerd, lettertypen die wisselen

Het Core Web Vitals-rapport van Search Console toont deze gegevens van je eigen bezoekers. PageSpeed Insights toont zowel veld- als labgegevens voor een URL — lees eerst het veldgedeelte en beschouw het labgedeelte als een diagnose van waarom.

Apps zijn meestal de grootste enkele regel

Elke app die een script injecteert, voegt bytes toe om te downloaden, te parsen en uit te voeren, en dat gebeurt op elke pagina, of die pagina de app nu gebruikt of niet. Twaalf apps zijn niet twaalf kleine kosten; het zijn er twaalf die concurreren om dezelfde hoofdthread.

Voer een grondige audit uit:

  1. Maak een lijst van elke geïnstalleerde app en noteer wat elke app je oplevert. Alles waarvoor je geen antwoord hebt, is een kandidaat.
  2. Verwijder de kandidaten.
  3. Controleer vervolgens het thema op restanten. Dit is de stap die mensen overslaan. Het verwijderen van een app verwijdert niet altijd de script-tag die het aan theme.liquid heeft toegevoegd, dus je kunt nog steeds de laadtijd van een app betalen die je niet meer hebt. Zoek in het thema naar de naam van de app en het CDN-domein.
  4. Meet opnieuw na elke verwijdering, niet aan het einde, zodat je weet welke belangrijk was.

De Googlebot-simulator toont de ruwe HTML die een crawler ontvangt, wat een snelle manier is om te zien hoeveel van je pagina uit scripts van derden bestaat voordat er iets wordt weergegeven.

Afbeeldingen: comprimeren, formaat aanpassen en stop met lazy-loading van de hero

Afbeeldingen zijn meestal de grootste bytes op een Shopify-pagina en het gemakkelijkst te halveren.

De CDN van Shopify doet al meer dan de meeste handelaren beseffen. Het levert automatisch WebP aan browsers die dit accepteren en past de grootte aan op verzoek via URL-parameters. Wat het niet kan doen, is een origineel van 4 MB ongedaan maken — het levert een kleiner formaat, niet een kleinere foto. Comprimeer vóór het uploaden.

Pas de grootte van het verzoek aan op de plek. Een afbeelding van 2.400px die in een kolom van 600px wordt weergegeven, verspilt driekwart van zijn bytes. De afbeeldings-URL's van Shopify accepteren ?width= — gebruik dit, en zorg voor een srcset zodat telefoons geen desktopafbeeldingen downloaden.

De hero is de uitzondering op elke lazy-loading regel. Het is bijna altijd het LCP-element, dus het uitstellen van het laden vertraagt de ene afbeelding die Google meet. Stel het in op loading="eager" en fetchpriority="high", en gebruik lazy-loading voor alles onder de vouw. Winkels die "overal lazy loading toevoegen" en langzamer worden, hebben bijna altijd precies dit gedaan.

Stel altijd breedte en hoogte in. Zonder deze kan de browser geen ruimte reserveren, de pagina herschikt zich wanneer de afbeelding arriveert, en dat is CLS. Afbeelding SEO op Shopify behandelt de alt-tekst en bestandsnaam; dit gaat puur over de prestatiekant.

Lettertypen en de onzichtbare kosten

Aangepaste lettertypen brengen echte kosten met zich mee bij elk eerste bezoek. Drie regels dekken het grootste deel hiervan:

  • Verstuur er minder. Twee families en twee gewichten per stuk zijn voldoende. Vier families is een ontwerpbeslissing met een prestatienadeel.
  • font-display: swap. Anders is de tekst onzichtbaar terwijl het lettertype laadt — een lege pagina die gebroken aanvoelt, zelfs als deze snel is.
  • Maak vooraf verbinding met de lettertypehost. Eén regel in theme.liquid die een DNS-opzoeking en TLS-handshake op het kritieke pad bespaart.

De eigen lettertypenbibliotheek van Shopify wordt geserveerd vanaf dezelfde oorsprong als de winkel, wat de verbindingskosten volledig elimineert. Het overwegen waard als je merkspecifieke lettertype niet cruciaal is.

Wat je niet kunt oplossen, en waar je mee moet stoppen

Shopify beheert de serverresponstijd, de CDN, de checkout en de kernplatform-JavaScript. Je kunt hier niets aan aanpassen, en een aanzienlijk deel van elk Lighthouse-rapport zal zaken in die categorie bevatten.

Dit is belangrijk voor het stellen van verwachtingen: er is een ondergrens, en die is hetzelfde voor elke winkel op het platform. Een "snelheidsoptimalisatiedienst" die belooft deze te doorbreken, verkoopt iets anders. Wat echt van jou is, is alles wat gebeurt nadat de HTML is geladen — en in een app-rijke winkel is dat waar bijna al het vermijdbare verlies zich bevindt.

Een gestructureerd plan

Week 1 — meten en verwijderen. Noteer LCP, INP en CLS vanuit Search Console. Voer een audit uit van apps, verwijder de onnodige, en zoek in het thema naar achtergebleven scripts. Meet opnieuw.

Week 2 — afbeeldingen. Comprimeer en upload de hero-afbeeldingen op je homepage en belangrijkste collecties opnieuw. Voeg expliciete breedte en hoogte toe. Corrigeer het laadattribuut van de hero. Verminder sliderafbeeldingen tot wat daadwerkelijk wordt gezien.

Week 3 — lettertypen en derden. Beperk lettertypefamilies en gewichten. Voeg preconnect toe. Stel het laden van resterende scripts van derden uit die niet nodig zijn voor de eerste weergave.

Week 4 — opnieuw meten en stoppen. Veldgegevens hebben een vertraging van maximaal 28 dagen, dus beoordeel week 1 niet in week 2. Wanneer de drie cijfers slagen, stop dan: verdere optimalisatie van een geslaagde winkel is inspanning die elders meer zou opleveren.

Waar snelheid zich verhoudt tot de rest

Snelheid is een beslissende factor. Een snelle pagina die de vraag slecht beantwoordt, verliest nog steeds van een trage pagina die deze goed beantwoordt — daarom is "verbeter Core Web Vitals" zelden het item met de hoogste waarde in een winkel met 2.000 producten en geen metabeschrijvingen.

Los het op omdat bezoekers trage winkels verlaten en omdat het een echte rankingfactor is, maar plaats het eerlijk in de volgorde. De Shopify SEO-checklist zet het in volgorde ten opzichte van de rest, en de gratis audit vertelt je of snelheid echt je beperkende factor is of gewoon het meest zichtbare om aan te werken.