Slik fikset jeg PageSpeed 46 til 98 på WordPress
Hvis du har en WordPress-side med PageSpeed under 50, mister du sannsynligvis kunder uten å vite det. Google nedprioriterer deg i søk, mobilbrukere lukker fanen før den laster, og du betaler dyrt for annonser som lander på en treg side. Her er hvordan jeg løftet et reelt oppdrag fra rød til grønn på to dagers arbeid.
Utgangspunktet
Kunden hadde en WordPress-side på et utdatert tema, 23 aktive plugins, ingen caching, og bilder rett fra fotograf på 5-10 MB stykket. Sida var ikke nede, men den var smertelig treg, særlig på mobil.
| Måling | Før | Etter |
|---|---|---|
| PageSpeed Desktop | 46 | 98 |
| PageSpeed Mobil | 28 | 91 |
| LCP Mobil | 18,5 s | 6,8 s |
| CLS | 0,42 | 0,01 |
| Total side-vekt | 8,1 MB | 1,2 MB |
Hva jeg gjorde, i prioritert rekkefølge etter ROI:
Steg 1: Mål utgangspunktet ordentlig
Mange hopper rett til «installer WP Rocket». Ikke gjør det. Du må først vite hvor du står. Verktøy jeg bruker:
- PageSpeed Insights (pagespeed.web.dev) – kjør både mobil og desktop, ta skjermbilde av tallene
- WebPageTest.org – mer detaljert vannfall-diagram
- Query Monitor (WordPress plugin) – ser hvilke plugins som drar mest
- GTmetrix – alternativt for å krysse-sjekke
Steg 2: Bilder (den klart største gevinsten)
I dette oppdraget var bildene 80 % av problemet. Hero-bildet alene var 4,2 MB JPEG. Slik fikset jeg:
Konverter alt til WebP
WebP gir 50-90 % mindre filer enn JPEG/PNG ved samme kvalitet. Verktøy:
- Squoosh.app for manuell konvertering (drag-and-drop, lokal i nettleseren)
- cwebp CLI for batch-konvertering:
cwebp -q 75 -resize 1600 0 input.jpg -o output.webp - WebP Express (WordPress plugin) for automatisk konvertering on-the-fly
Skaler ned til faktisk visningsstørrelse
Et bilde som vises 800 px bredt trenger ikke være 4000 px. Maksbredde jeg bruker:
- Hero-bilder: 1600 px bred
- Kort-bilder: 800 px
- Thumbnails: 400 px
- Profilbilder/avatar: 320 px
Resultat på dette oppdraget
4,3 MB lettere innlasting bare fra bilde-konverteringen. PageSpeed gikk fra 46 til 78 på desktop bare av dette ett tiltaket.
curl -I [bildelenke] på dine største bilder og se Content-Length. Hvis ett bilde er over 500 KB, har du sannsynligvis funnet problemet.Steg 3: Caching
Caching gjør at WordPress ikke trenger å bygge sida på nytt for hver besøkende. Verktøy jeg bruker:
- WP Rocket – betalt (52 USD/år), enkleste oppsett, fungerer for 95 % av kunder
- LiteSpeed Cache – gratis, men krever LiteSpeed-server (sjekk med webhotellet)
- FlyingPress – nyere, ofte bedre enn WP Rocket på mobil
Browser cache via .htaccess
Lim inn i .htaccess-filen din (på Apache-hosting):
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 month"
ExpiresByType image/png "access plus 6 months"
ExpiresByType image/jpeg "access plus 6 months"
ExpiresByType image/webp "access plus 6 months"
ExpiresByType font/woff2 "access plus 1 year"
</IfModule>
Gzip-komprimering
Gzip gjør HTML/CSS/JS 70-80 % mindre over nettverket. Lim inn i .htaccess:
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/css text/javascript application/javascript
</IfModule>
Steg 4: Plugin-rensk
I dette oppdraget hadde kunden 23 plugins. Etter gjennomgang fjernet jeg 8 som ikke gjorde noe synlig nytte:
- 2 SEO-plugins som overlappet (Yoast + RankMath, valgte Yoast)
- 1 backup-plugin som ikke kjørte (kunden hadde glemt å sette opp)
- 2 analytics-plugins (kunden visste ikke at de begge sporet)
- 1 plugin for sosial deling som lastet 300 KB JavaScript
- 1 «under construction»-plugin fra lansering 2 år siden
- 1 visuell editor-plugin som ble erstattet av tema-bygger
Bruk Query Monitor for å se hvilke plugins som drar mest. Fjern alt du ikke trenger akkurat nå.
Steg 5: Lazy-load alt under fold
Bilder utenfor første skjermbilde skal ikke lastes før brukeren scroller dit. WordPress 5.5+ har innebygd lazy-loading. Sjekk at det fungerer:
Inspiser HTML-en i nettleseren. Bildene skal ha loading="lazy" på seg. Hvis ikke, har et tema eller plugin overskrevet det.
Steg 6: Kritisk CSS og JS-defer
De siste prosentene kommer fra å:
- Inline kritisk CSS (det som trengs for første visning)
- Defer alt JavaScript som ikke trengs umiddelbart (
defer-attributt) - Preload viktige fonter og hero-bildet
WP Rocket og FlyingPress gjør dette automatisk. Manuelt er det fikkelig.
Hva som IKKE er verdt tiden
Mange optimaliseringer er overhyped. Bruk ikke tid på:
- CDN hvis du har 90 % norske brukere og hosting i Norge. Marginal forskjell.
- Database-rensk for små sider (under 10 000 poster). Ingen merkbar effekt.
- Bytte tema hvis temaet er rimelig OK. Sjelden roten av problemet.
- Bytte hosting som første steg. Sjekk alt over først.
Levering og dokumentasjon
For dette oppdraget tok jeg full backup før noe ble gjort, jobbet på staging-side, og overførte til prod først da kunden hadde godkjent. Levert med PDF-rapport som dokumenterer hver endring og hvor mye den ga.
Total tid: 4,5 timer over to dager. Fastpris 3 500 kr. Resultatet kunne kunden vise frem og sette i Google Search Console for sporing.
Sammendrag
- Begynn ALLTID med å måle utgangspunktet
- Bilder er nesten alltid 60-80 % av problemet
- WebP + scaling + caching dekker 90 % av jobben
- Plugin-rensk kommer etterpå, ikke før
- Dokumenter alt for kunden så de kan vise frem forbedringen
Hvis din egen WordPress-side er treg, kjør først en PageSpeed-test og se hvor du står. Send meg resultatet, så får du en kort vurdering gratis om det er noe jeg kan hjelpe med.