Artikel

Optimer webstedets medier til hastighed og Core Web Vitals

Billeder udgør typisk omkring 40 procent af en websides samlede vægt, mere end nogen anden ressourcetype, og video lægger betydeligt mere til på mediertunge sider. At få dem rigtige er det enkeltstående tiltag med størst effekt på indlæsningshastighed, Core Web Vitals-scorer og søgeplacering. Den gode nyhed: intet af det kræver specialiseret software eller en server, og dine filer behøver aldrig at forlade din enhed.

Skrevet af Bastien Sulyan · Udgivet den 16. juni 2026

Vælg det rette format frem for alt andet

Formatvalget betyder mere end nogen kvalitetsskyder. Til fotografier på en webside er WebP det rette standardvalg: det er 25 til 35 procent mindre end JPEG ved samme visuelle kvalitet, og alle moderne browsere understøtter det. AVIF komprimerer endnu bedre, op til 50 procent bedre end JPEG, mod langsommere kodning. Brug AVIF til hero-billeder og produktfotos, du komprimerer én gang; brug WebP til alt, du behandler i batch eller har brug for hurtigt. PNG hører kun hjemme, hvor du har brug for tabsfri nøjagtighed eller en gennemsigtig baggrund. SVG er det eneste fornuftige valg til logoer, ikoner og illustrationer: det skalerer til enhver størrelse og vejer ofte et par kilobyte mod hundredvis for en rasteriseret ækvivalent.

Komprimer billeder uden synligt kvalitetstab

Begynd med at ændre størrelsen til de faktiske visningsdimensioner: et hero-billede, der vises i 1280 pixel bredde, har ikke brug for 4000 pixel data. Ændr størrelsen først, komprimer derefter. For fotografier er kvalitet 80 i WebP eller JPEG det praktiske gulv, hvorunder almindelige seere begynder at bemærke det, så sigt efter 75 til 85, og kig på resultatet ved fuld zoom, før du udgiver. Til grafik med tekst og flade flader bevarer PNG uden tab eller SVG den skarphed, som tabsgivende formater udtværer. Billedkomprimeringsværktøjet på dette site håndterer alle disse formater, kører helt i din browser og anvender de samme algoritmer som dedikerede desktopværktøjer.

Konverter video til nettet uden at uploade den

Baggrundsløkker og indlejret video er der, hvor optimering af webmedier ofte kommer til kort. En MP4 med H.264 afspilles overalt, og WebM er det royaltyfrie alternativ, som understøttes af alle moderne browsere. Videokonverteringsværktøjet på dette site koder WebM med VP8, som ligger i samme komprimeringsklasse som H.264: at skifte container alene gør altså ikke filen mindre, den reelle gevinst er en fuldstændig royaltyfri codec-kæde og native understøttelse af en alfakanal. Den praktiske tilgang er at konvertere én gang til WebM, servere den som den foretrukne kilde i et video-element og beholde MP4'en som reserve til ældre browsere. Konverteringen kører inde i din browser via FFmpeg kompileret til WebAssembly: intet uploades, og filer op til 500 MB konverteres uden kø. Til indlejret baggrundsvideo kan du også overveje videotrimmeren til at klippe døde sekunder væk før kodning: varighed er den største drivkraft bag filstørrelsen.

Indlejrede aktiver: base64 og SVG

Meget små billeder, ikoner og favicons indlejret direkte i HTML eller CSS som base64-strenge eliminerer én netværksrundtur pr. aktiv. Det giver mening for aktiver under cirka 2 KB, der optræder på hver side, såsom en logo-sprite eller en indlæsningsindikator. Større aktiver bør forblive som separate filer, fordi base64 koder 33 procent større end binæren, og browsere cacher filreferencer, men ikke indlejrede data uafhængigt. SVG-optimeringsværktøjet fjerner editor-skidt fra eksporterede SVG'er uden at røre ved det visuelle output. Billede-til-base64-værktøjet genererer den færdige data-URI, klar til at indsætte, i din browser.

Afvejning mellem en separat cachet fil, der kræver endnu en HTTP-forespørgsel, og et Base64-inline-aktiv, der er cirka 33 % større og gensendes med hver side

Lever den rigtige størrelse og indlæs den først

To leveringsdetaljer betyder lige så meget som selve filerne. Den første er responsiv størrelsestilpasning. Med en srcset-liste af bredde-deskriptorer (image-400.webp 400w, image-800.webp 800w osv.) vælger browseren den mindste fil, der stadig dækker skærmen, ved at gange CSS-bredden med device pixel ratio, inden den anmoder om noget. En telefon med et layout på 390px bredt og en 3x-skærm har brug for cirka 1170 pixels, så den henter 1200w-versionen og springer det originale desktopbillede over. Den anden detalje er prioritet. Browsere kører en preload scanner (en forudlæsningsscanner), der læser frem og begynder at hente billeder, inden den primære parser når dem; ved at tilføje fetchpriority="high" til dit største above-the-fold-billede (dvs. det billede, der er synligt uden at scrolle) fortæller du browseren, at det skal hentes først, og det er typisk det, der afgør din Largest Contentful Paint.

Søjler, der sammenligner et kameraoriginal på 4000 pixels, den størrelse på 1200 pixels, som layoutet bruger, og et miniaturebillede på 480 pixels, hvilket viser, at størrelsesændring sparer mere end kvalitetsindstillinger

Værktøjer i denne artikel

Ofte stillede spørgsmål

Påvirker billedkomprimering min søgeplacering?

Google bruger Core Web Vitals som et placeringssignal, og Largest Contentful Paint er næsten altid et billede eller en videoplakat. En side, hvis hero-billede indlæses på under et sekund, scorer bedre end en, hvor det tager tre sekunder. Komprimering og det rette format påvirker denne metrik direkte, så ja, billedoptimering har en målbar SEO-effekt. Effekten er stærkest på mobil, hvor forbindelserne er langsommere, og straffen for tunge billeder er større.

Hvorfor behandle medier lokalt i stedet for at bruge en webtjeneste?

De fleste online medieværktøjer kræver, at du uploader dine filer til en fjernserver, hvilket tager tid, forbruger båndbredde og betyder, at en kopi af din fil findes på infrastruktur, du ikke kontrollerer. Værktøjerne på dette site kører helt i din browser: dine billeder og videoer behandles på din enhed, og resultatet downloades direkte. Der er ingen konto, ingen ventetid på upload, og intet om dine filer sendes nogensinde til en server.