WAY Communication × Stolt Marketing

Ombyggd startsida — teknisk rapport.

Startsidan på waycommunication.se är ombyggd med exakt samma grafiska profil — logga, Krona One, Montserrat, färger och bilder. Designen är oförändrad; allt som skiljer sitter i den tekniska uppbyggnaden. Rapporten redovisar de uppmätta resultaten i Google PageSpeed (Lighthouse, mobil och desktop), Core Web Vitals före/efter, och de konkreta åtgärder som ligger bakom varför den ombyggda sidan når 100 rakt igenom.

Live: way-communication.pages.dev

01 Google PageSpeed (Lighthouse, mobil)

Resultat: 100 i alla kategorier.

Nuvarande sajt ligger på röda och gula värden på mobil. Den ombyggda startsidan får full pott i samtliga kategorier — samma resultat på desktop. Siffran "före" är uppmätt på nuvarande waycommunication.se.

Prestanda

Före: 45+55

Tillgänglighet

Före: 87+13

Bästa metoder

Före: 54+46

SEO

Före: 92+8

Agenttillgänglighet

Före: 0/2Godkänd ✓

02 Core Web Vitals (mobil)

Mätvärden före och efter.

Det här är de fältnära mätvärden Google viktar i ranking. Nuvarande sajt tar över 40 sekunder på att rita upp huvudinnehållet (LCP) på mobil; den ombyggda sidan ritar upp det på under två sekunder.

LCP

42,2 s1,7 s

~25× snabbare

First Contentful Paint

2,7 s1,0 s

2,7× snabbare

Total Blocking Time

470 ms0 ms

Helt eliminerat

Layoutförskjutning (CLS)

0,1160

Inget hopp

Speed Index

18,7 s1,3 s

~14× snabbare

03 Åtgärderna bakom siffrorna

Vad som tar den till 100.

Varje kort är en konkret teknisk åtgärd och vilket mätvärde den påverkar. Tillsammans är det de här som flyttar sidan från 45 till 100 — inte ett snabbfix, utan hur sidan är byggd från grunden.

Ingen serverexekvering per besök

Färdig HTML serveras direkt från Cloudflares edge. Ingen PHP och ingen databasfråga i request-vägen — vilket tar bort serverväntan som drar ner LCP och Speed Index på nuvarande sajt.

→ LCP · Speed Index · TTFB

Inga renderingsblockerande teman/plugins

Nuvarande sajt laddar tema- och plugin-JS som blockerar huvudtråden (TBT 470 ms). Den ombyggda sidan kör minimal egen JS som inte blockerar uppritningen.

→ Total Blocking Time 0 ms

Självhostade, subsettade fonter

Krona One och Montserrat laddas lokalt som woff2 med font-display: swap och en storleksjusterad fallback. Texten ritas direkt, utan extern fontserver och utan att typsnittsbytet flyttar layouten.

→ FCP · CLS

Reserverad plats för all media

Bilder och element har explicita mått, så inget hoppar när sidan laddar. Layoutförskjutningen går från 0,116 till 0.

→ CLS 0

Optimerad media

Bilder konverterade till WebP, animerade ikoner från tunga GIF:er till alpha-WebM. Mindre att ladda gör att LCP-elementet ritas nästan direkt.

→ LCP · Prestanda

Semantisk HTML + komplett meta

Korrekt rubrikhierarki, alt-texter, kontrast och fokusordning ger full tillgänglighet; title, meta, canonical och sitemap ger full SEO — utan plugin.

→ Tillgänglighet 100 · SEO 100

Best practices by default

HTTPS, inga konsolfel, inga föråldrade bibliotek och korrekta bildformat. Det är sådant som annars dras ner av plugin-arv på en WordPress-sajt.

→ Bästa metoder 100

AI-läsbar struktur (llms.txt)

En llms.txt och ren semantisk HTML gör sidan läsbar och citerbar för AI-botar (ChatGPT, Perplexity, Google AI). Det är vad agenttillgänglighetstestet mäter.

→ Agenttillgänglighet godkänd

Statisk build, deploy på edge

Sidan byggs en gång till statiska filer och distribueras globalt. Resultatet är likadant för varenda besökare och varje geografi — ingen kallstart, ingen serverlast vid trafiktoppar.

→ Stabil prestanda i fält

04 Teknisk stack

Vad den är byggd på.

Komponenterna i bygget. En statisk frontend där animationen är en del av sidan, inte ett lager ovanpå ett tema.

Vite + vanilla JS

Statisk build. Sidan byggs till färdig HTML/JS — ingen PHP, ingen databas i request-vägen. Exakt den markup designen kräver, inget tema att böja.

GSAP + ScrollTrigger

Scroll- och tidslinjedriven animation, inbyggd i sidan i stället för ett plugin ovanpå ett tema.

Lenis

Smooth scroll som synkar scrollpositionen med animationerna utan att tappa bildrutor.

Canvas / WebGL

Hero-effekter direkt på GPU:n (WAY:s pilfält) med bibehållen 100 i prestanda.

Cloudflare Pages

Edge-hosting. Färdiga filer serveras nära besökaren, ingen serverexekvering per visning.

Headless CMS

Innehåll frikopplat från frontend (Storyblok / TinaCMS / Sanity / Sveltia). Innehållet bakas in statiskt vid build, så prestandan påverkas inte av att kunden redigerar.

Mediaoptimering

Bilder till WebP, GIF till alpha-WebM, självhostade fonter — så LCP-elementet ritas nästan direkt.

llms.txt + semantisk HTML

Ren, snabb struktur som AI-botar kan läsa och citera.

wrangler / GitHub Actions

Deploy-kedjan. En commit eller en CMS-webhook bygger och publicerar den statiska versionen globalt på sekunder.

05 WordPress vs denna stack

Funktionsparitet, teknisk skillnad.

En rak jämförelse funktion för funktion. Det mesta går att lösa lika bra i båda; skillnaden ligger i prestanda, teknisk SEO, säkerhet och underhåll. Där WordPress är starkare står det utskrivet.

FunktionNuvarande (WordPress)Denna stack

CMS — kunden redigerar innehåll

Nuvarande (WordPress)Inbyggd wp-admin: WYSIWYG, mediabibliotek, roller.

Denna stackHeadless CMS med admin-UI och live-preview. Frikopplat från frontend, så en innehållsändring kan aldrig krascha sidan. Funktionsparitet.

Kunden ändrar utseende/layout

Nuvarande (WordPress)Gutenberg/Elementor: fri drag-and-drop av block, färg och typsnitt utan kod.

Denna stackKonfigurerbara block + design-tokens. Mer styrt än Elementor — designen kan inte målas sönder, men friheten är något mindre. Här är WordPress mer flexibelt.

Design & animation

Nuvarande (WordPress)Tema + plugins + CSS. Avancerade effekter går, men kostar prestanda och kräver ofta tunga plugins.

Denna stackGSAP + Lenis + custom canvas utan prestandakompromiss — animationen är en del av sidan. Mätt till 100 i prestanda.

Plugins / ekosystem

Nuvarande (WordPress)~60 000 plugins. Störst bredd av alla CMS.

Denna stackFristående tjänster för det en byråsajt behöver: formulär (Formspree), bokning (Cal.com), nyhetsbrev (Resend), analytics. För nischade specialbehov kan WordPress vara enklare.

E-handel

Nuvarande (WordPress)WooCommerce — moget och fullfjädrat.

Denna stackHeadless commerce (Shopify-storefront, Stripe) för produktförsäljning på en innehållssajt. För en stor, komplex butik är WooCommerce starkare.

SEO (on-page)

Nuvarande (WordPress)Yoast/RankMath: fält för titlar, meta, sitemap, schema. Men laddtid och Core Web Vitals dras ner av tema-overhead.

Denna stackSamma kontroll över titlar/meta/canonical/sitemap/JSON-LD. Funktionsparitet on-page.

Teknisk SEO & Core Web Vitals

Nuvarande (WordPress)Prestanda 45, LCP 42,2 s på mobil — rankingnegativa värden.

Denna stackPresterar bättre: 100 i prestanda och godkända Core Web Vitals, vilket Google viktar i ranking.

AI-synlighet

Nuvarande (WordPress)Möjligt, men kräver plugin eller manuellt arbete för llms.txt och ren struktur.

Denna stackInbyggt: llms.txt, semantisk HTML och snabb rendering gör sidan lätt för AI-botar att läsa och citera.

Hosting, säkerhet & underhåll

Nuvarande (WordPress)PHP-server + databas. Löpande uppdateringar av core/teman/plugins — vanligaste hackvektorn på webben. Backup och drift krävs.

Denna stackLägre attackyta: statiska filer på edgen — ingen server, databas eller PHP att hacka eller hålla i synk.

Sammanfattning: funktionellt är de likvärdiga för en kommunikationsbyrå, med WordPress något starkare på fri layoutredigering och nischade plugins. Den tekniska skillnaden mot nuvarande sajt ligger i mätbar prestanda, Core Web Vitals, teknisk SEO och underhåll — det är där den ombyggda sidan presterar bättre.