Webdesign og hastighedsoptimering hænger sammen. Godt webdesign og god hastighed er ikke modsætninger. En flot side, der tager fem sekunder på mobil, taber alligevel. Målet er designvalg, der støtter Core Web Vitals — ikke “minimalisme for enhver pris”, men bevidste kompromiser.

Designvalg der koster LCP og INP

  • Hero-sliders med autoplay og store billeder
  • Webfonte i mange vægte + ikon-fonte “fordi det er nemt”
  • Page builder-sektioner stablet uden behov (stor DOM, meget CSS/JS)
  • Chat, popups og sticky bars over fold uden pladsreservering (CLS)
  • Baggrundsvideoer og parallax der kører på alle enheder

Hver effekt er et valg. Spørg: hjælper den konverteringen mere, end den koster i load og respons?

Fundament: hosting og tema

Hosting sætter loftet for TTFB. Temaet sætter loftet for DOM og CSS. Vælg et let, velvedligeholdt tema — eller et block theme du faktisk kan styre — frem for et “alt-i-én”-multipurpose-tema med 40 demoer, du aldrig bruger.

Page builders — brug med disciplin

Builders som Elementor, Divi, Bricks, Oxygen og Gutenberg/blokke kan alle være “hurtige nok”, hvis du bygger stramt. De bliver langsomme, når hver sektion henter egne widgets, animationer og globale styles.

  • Færre sektioner over fold; ét klart LCP-element (billede eller overskrift)
  • Undgå at loade builder-assets på sider, der ikke bruger dem
  • Test mobil efter hver større layoutændring — ikke kun desktop-preview
  • Gutenberg/blokke kan være lettere, men “tunge blok-plugins” findes også her

Billeder og media i designet

Designeren vælger ofte 3000 px-fotos “for skarphed”. Browseren viser måske 600 px. Resize, komprimér og brug moderne formater — se store billeder og lazy load. Lazy-load aldrig det primære LCP-billede.

Typografi uden at bremse

Begræns antal familier og vægte. Self-host eller optimér Google Fonts — se Optimér Google Fonts. `font-display: swap` (eller tilsvarende) undgår usynlig tekst; undgå layout-hop med fornuftige fallbacks.

Checklist før launch

  1. Mobil LCP under kontrol på den vigtigste landingsside
  2. Ingen unødvendig third-party over fold
  3. Billeder i rigtig størrelse + dimensioner (mod CLS)
  4. Page builder-widgets: kun det brugte
  5. PSI field/lab + en reel klik-test (INP) på knapper og menu

Kort sagt

Design for mennesker og for netværk. Færre tunge effekter, rigtige billeder, let tema/builder-brug. En hurtig side er også godt design. Brug et helbredstjek, eller få en audit, hvis layoutet er flot — men felt-data er røde.