SVG til WebP-konverter
Gjør om en vektorfil til WebP i nøyaktig den pikselbredden oppsettet ditt trenger. Nyttig når et publiseringssystem avviser SVG-opplastinger, en forhåndsvisning på sosiale medier krever et punktgrafikkbilde, eller en illustrasjon har så mange baner at nettleseren bruker lang tid på å tegne den.
Bildekonverterer
eller slipp JPG, JPEG, JPE …-filer her ·
Maks 95 MB per fil· Opptil 20 filer· Slettes etter 30 minutter
Filene behandles på serverne våre og slettes etter 30 minutter.
85 holder bilder visuelt identiske med originalen. Senk den bare når du trenger en mindre fil.
JPG, BMP og EPS har ikke gjennomsiktighet. Gjennomsiktige piksler fylles med denne fargen.
Heksadesimal farge som brukes bak gjennomsiktige piksler, f.eks. #FFFFFF.
Dette formatet rommer ett enkelt bilde. Velg GIF eller WebP som utdata hvis du vil beholde animasjonen.
Et ikon med flere størrelser inneholder flere oppløsninger i én fil; nettlesere og operativsystemer velger den de trenger.
Behold de opprinnelige dimensjonene, eller oppgi én side så beholdes sideforholdet.
Piksler for siden du valgte ovenfor.
Prosent av de opprinnelige dimensjonene.
sRGB passer for skjerm og nett. Behold originalen for trykkarbeidsflyter; gråtoner forkaster fargen.
Bare metadata, 0 beholder opprinnelig verdi. Skrivere og noen portaler leser dette tallet; det endrer ikke pikseldimensjonene.
Slik bruker du dette verktøyet
- 1
Last opp SVG-filen
Legg til opptil 20 .svg-filer eksportert fra Figma, Illustrator, Inkscape eller et diagrambibliotek, hver på maks 95 MB.
- 2
Angi bredden på resultatet
Endre størrelse på det ferdige bildet starter på en bredde på 1200 px; sett den til det dobbelte av bredden bildet skal ha på siden. Kvalitet er 90, eller huk av for Uten tap under Avanserte innstillinger for flate logoer og ikoner.
- 3
Konverter til WebP
Trykk på Konverter til WebP og last ned filene eller én ZIP. Gjennomsiktige områder forblir gjennomsiktige.
Hvordan konverterer jeg SVG til WebP i en bestemt størrelse?
Last opp SVG-en, sett Endre størrelse på det ferdige bildet til bredden i piksler du trenger (1200 px som standard), og trykk på Konverter til WebP. Vektoren tegnes på nytt i den bredden, så ingenting oppskaleres eller blir uskarpt.
Når en SVG bør gjøres om til WebP
SVG ble en W3C-anbefaling i 2001 og er riktig format for de fleste logoer og ikoner: noen få kilobyte tekst som er skarp på alle zoomnivåer. Problemene starter når filen forlater din egen kode. WordPress og mange nettbutikkbyggere avviser SVG-opplastinger, lenkeforhåndsvisninger på Facebook, LinkedIn og X hentes som bitmaps, og designverktøy eksporterer illustrasjoner med innebygde rastereffekter som gjør en vektorfil til flere megabyte med kode.
WebP, som Google ga ut i 2010 og som Safari endelig støttet fra versjon 14 i 2020, er bitmap-formatet laget for denne jobben: mindre enn PNG med samme utseende, og med en ekte alfakanal. Når SVG-en gjengis rett til WebP i endelig størrelse, slipper du den vanlige omveien via en stor PNG-eksport. Trenger du motsatt vei, forklarer siden vår om WebP til SVG hvorfor den retningen krever sporing og ikke konvertering.
SVG til WebP: størrelser for vanlige plasser på nettsider
1200 × 630 px
Open Graph-lenkeforhåndsvisning
Bildet som vises når siden deles
1920 × 1080 px
Hero-illustrasjon i full bredde
Dekker de fleste skrivebordsskjermer ved 1×
1600 × 900 px
Bilde i bloggkolonne ved 2×
For en innholdskolonne på 800 px
400 × 100 px
Topplogo ved 2×
For en logoplass på 200 × 50 px
SVG
Scalable Vector Graphics
SVG er et XML-basert vektorformat standardisert av W3C i 2001. I stedet for piksler beskriver det former, baner og tekst, så det forblir skarpt i alle størrelser og er vanligvis bitteliten for logoer og ikoner. Det støtter gjennomsiktighet, CSS-stiler, skripting og animasjon, og alle nettlesere gjengir det direkte. SVG egner seg ikke for fotografier, og komplekse illustrasjoner kan bli trege å gjengi. Illustrator, Inkscape, Figma og nettlesere kan åpne og redigere det.
- Komprimering
- –
- Gjennomsiktighet
- Ja
- Animasjon
- Ja
- Introdusert
- 2001 · W3C
WEBP
WebP-bilde
WebP er et bildeformat Google lanserte i 2010 for å få nettsider til å laste raskere. Det støtter både tapsbasert og tapsfri komprimering, alfagjennomsiktighet og animasjon i ett format. Tapsbaserte WebP-filer er vanligvis 25–35 % mindre enn JPEG med tilsvarende visuell kvalitet, og tapsfri WebP er som regel mindre enn PNG. Alle dagens nettlesere støtter det, men noe eldre skrivebordsprogramvare, trykketjenester og opplastingsskjemaer avviser det fortsatt. Windows, macOS og de fleste moderne bilderedigeringsprogrammer kan åpne WebP-filer.
- Komprimering
- Med tap eller tapsfri
- Gjennomsiktighet
- Ja
- Animasjon
- Ja
- Introdusert
- 2010 · Google
Folk konverterer SVG til WebP for å få et lett bitmap-bilde med fast størrelse til steder som ikke tar imot vektorfiler eller tegner dem tregt, for eksempel et CMS, en forhåndsvisning i sosiale medier eller en travel landingsside; WebP til SVG er en sporingsjobb, ikke et formatbytte.
Slik rasteriseres SVG-filen, og hva du bør sjekke
Konverteren leser SVG-ens egen width, height og viewBox, og tegner deretter hver bane i bredden du har satt; høyden følger sideforholdet. Fordi tegningen skjer i endelig størrelse, kantutjevnes tynne streker og liten tekst én gang, i riktig skala. Å oppskalere en liten PNG etterpå blir aldri like rent.
Fonter er den vanlige overraskelsen. Hvis SVG-en navngir en skrifttype som ikke er innebygd eller konvertert til konturer, brukes en reserveskrift og linjelengdene endres. Konverter teksten til konturer i designverktøyet før eksport. Eksterne bilder lenket med URL inne i SVG-en hentes ikke, så bygg dem inn eller flat ut grafikken først.
SVG til WebP-konverter: gjør og unngå
| Gjør | Ikke gjør |
|---|---|
| Gjengi i 2× den viste CSS-bredden | Konvertere enkle innebygde ikoner som er mindre som SVG |
| Bruk Uten tap for flate logoer med få farger | Gjengi i 4000 px for en plass på 600 px |
| Behold SVG-originalen for fremtidige størrelser | Sende WebP i e-postnyhetsbrev |
| Bruk WebP med width- og height-attributter for å unngå layoutforskyvning | Forvente levende tekst: WebP er piksler, ikke markerbar tekst |
Spørsmål om SVG til WebP
Hvilken pikselbredde bør jeg bruke når jeg konverterer SVG til WebP?
Ta bredden bildet vises med i CSS-piksler og doble den, slik at bildet holder seg skarpt på mobil- og bærbare skjermer med høy tetthet. En illustrasjon som vises i en 800 px bred kolonne, bør gjengis med 1600 px. 3× lønner seg sjelden på nett, fordi filen vokser mens den synlige gevinsten er liten.
Er WebP bedre enn SVG for en nettside?
Ikke for enkle logoer, ikoner og diagrammer: en ren SVG er liten og skarp i alle størrelser, så behold den. WebP er best for komplekse illustrasjoner med gradienter, filtre eller tusenvis av baner, og for steder som bare godtar bitmaps, som forhåndsvisninger i sosiale medier eller et CMS uten SVG-støtte.
Beholder WebP-filen den gjennomsiktige bakgrunnen fra SVG-filen?
Ja. WebP har en full alfakanal både i tapsbasert og tapsfri modus, så områder uten fyll i SVG-en forblir gjennomsiktige. Kantene på former er kantutjevnet mot gjennomsiktighet, noe som ser riktig ut på alle bakgrunnsfarger.
Tapsbasert eller tapsfri WebP for vektorgrafikk?
Uten tap passer for flate logoer, ikoner og diagrammer med noen få ensfargede flater; de komprimeres svært godt og beholder helt rene kanter. Med tap på kvalitet 85 til 90 passer for illustrasjoner med gradienter, skygger eller teksturer, der filer uten tap blir tunge. Prøv begge på én fil og behold det minste resultatet som ser rent ut.
Hvorfor kan jeg ikke laste opp SVG til WordPress?
WordPress tillater ikke SVG som opplastingstype fordi en SVG kan inneholde skript. WordPress har godtatt WebP siden versjon 5.8, utgitt i 2021, så ved å konvertere får du en fil mediebiblioteket tar imot uten en sikkerhetsplugin. Nettsteder som trenger ekte vektorer, kan fortsatt legge til SVG-støtte via en plugin som rensker filene.
Kan jeg bruke WebP-filen i et nyhetsbrev på e-post?
Unngå det. Flere e-postklienter, blant dem Outlook for Windows på skrivebordet, viser ikke WebP, og Gmail viser heller ikke SVG. Bruk heller SVG til PNG for e-post.
