Convertor SVG în WebP
Transformați un fișier vectorial într-un WebP exact la lățimea în pixeli de care are nevoie pagina. Este util când un CMS nu acceptă încărcarea de SVG, când o previzualizare pentru rețele sociale cere o imagine bitmap sau când o ilustrație are atât de multe trasee încât browserul o desenează greu.
Convertor de imagini
sau trage Fișiere JPG, JPEG, JPE … aici ·
Maximum 95 MB per fișier· Până la 20 fișiere· Șterse după 30 minute
Fișierele sunt procesate pe serverele noastre și șterse după 30 minute.
85 păstrează fotografiile vizual identice cu originalul. Reduceți-o doar dacă aveți nevoie de un fișier mai mic.
JPG, BMP și EPS nu au transparență. Pixelii transparenți sunt umpluți cu această culoare.
Culoare hex folosită în spatele pixelilor transparenți, de exemplu #FFFFFF.
Acest format conține o singură imagine. Alegeți ieșire GIF sau WebP dacă doriți să păstrați animația.
O pictogramă cu mai multe dimensiuni conține mai multe rezoluții într-un singur fișier; browserele și sistemele de operare o aleg pe cea de care au nevoie.
Păstrați dimensiunile originale sau introduceți o latură, iar proporțiile se păstrează.
Pixeli pentru latura aleasă mai sus.
Procent din dimensiunile originale.
sRGB este potrivit pentru ecrane și web. Păstrați originalul pentru fluxuri de tipărire; tonurile de gri elimină culoarea.
Doar metadate, 0 păstrează valoarea originală. Imprimantele și unele portaluri citesc acest număr; nu schimbă dimensiunile în pixeli.
Cum se folosește acest instrument
- 1
Încărcați fișierul SVG
Adăugați până la 20 de fișiere .svg exportate din Figma, Illustrator, Inkscape sau dintr-o bibliotecă de grafice, de maximum 95 MB fiecare.
- 2
Setați lățimea finală
Redimensionează imaginea rezultată pornește de la o lățime de 1200 px; schimbați-o la dublul lățimii pe care o va ocupa imaginea în pagină. Calitate este 90, sau bifați Fără pierderi în Setări avansate pentru logo-uri și pictograme plate.
- 3
Convertiți în WebP
Apăsați Convertește în WebP și descărcați fișierele sau un singur ZIP. Zonele transparente rămân transparente.
Cum convertesc SVG în WebP la o anumită dimensiune?
Încărcați SVG-ul, setați Redimensionează imaginea rezultată la lățimea în pixeli de care aveți nevoie (implicit 1200 px) și apăsați Convertește în WebP. Vectorul este desenat de la zero la acea lățime, deci nimic nu este mărit și nu devine neclar.
Când merită transformat un SVG în WebP
SVG a devenit Recomandare W3C în 2001 și este formatul potrivit pentru majoritatea logo-urilor și pictogramelor: câțiva kiloocteți de text care rămân clari la orice zoom. Problemele încep când fișierul iese din propriul cod. WordPress și multe platforme de magazine online refuză încărcarea SVG, previzualizările de linkuri de pe Facebook, LinkedIn și X sunt preluate ca bitmap-uri, iar instrumentele de design exportă ilustrații cu efecte raster încorporate care transformă un fișier vectorial în mai mulți megaocteți de cod.
WebP, lansat de Google în 2010 și susținut în sfârșit de Safari din versiunea 14, în 2020, este formatul bitmap creat pentru această sarcină: mai mic decât PNG la același aspect, cu un canal alfa real. Randarea SVG-ului direct în WebP la mărimea finală evită ocolul obișnuit printr-un export PNG mare. Dacă vă interesează și sensul invers, pagina noastră despre WebP în SVG explică de ce acea direcție necesită vectorizare, nu conversie.
Dimensiuni SVG în WebP pentru spațiile web uzuale
1200 × 630 px
Previzualizare link Open Graph
Imaginea afișată când pagina este distribuită
1920 × 1080 px
Ilustrație hero pe toată lățimea
Acoperă majoritatea ecranelor de desktop la 1×
1600 × 900 px
Imagine pentru coloana de blog la 2×
Pentru o coloană de conținut de 800 px
400 × 100 px
Logo în antet la 2×
Pentru un spațiu de logo de 200 × 50 px
SVG
Scalable Vector Graphics
SVG este un format vectorial bazat pe XML, standardizat de W3C în 2001. În loc de pixeli descrie forme, trasee și text, așa că rămâne clar la orice dimensiune și este de obicei foarte mic pentru sigle și pictograme. Acceptă transparență, stilizare CSS, scripting și animație, iar toate browserele îl redau nativ. SVG nu este potrivit pentru fotografii, iar ilustrațiile complexe pot deveni lente la randare. Illustrator, Inkscape, Figma și browserele îl pot deschide și edita.
- Compresie
- –
- Transparență
- Da
- Animație
- Da
- Introdus în
- 2001 · W3C
WEBP
Imagine WebP
WebP este un format de imagine lansat de Google în 2010 pentru ca paginile web să se încarce mai repede. Acceptă compresie atât cu pierderi, cât și fără pierderi, transparență alfa și animație într-un singur format. Fișierele WebP cu pierderi sunt de obicei cu 25–35% mai mici decât JPEG-urile cu o calitate vizuală similară, iar WebP fără pierderi este de regulă mai mic decât PNG. Toate browserele actuale îl acceptă, dar unele programe desktop mai vechi, servicii de tipar și formulare de încărcare încă îl resping. Windows, macOS și majoritatea editoarelor moderne de imagini pot deschide fișiere WebP.
- Compresie
- Cu sau fără pierderi
- Transparență
- Da
- Animație
- Da
- Introdus în
- 2010 · Google
SVG se convertește în WebP pentru a obține o imagine bitmap ușoară, de mărime fixă, pentru locuri care nu acceptă fișiere vectoriale sau le afișează lent, cum ar fi un CMS, o previzualizare socială sau o pagină de destinație încărcată; WebP în SVG înseamnă vectorizare, nu simplă schimbare de format.
Cum este rasterizat SVG-ul și ce trebuie verificat
Convertorul citește lățimea, înălțimea și viewBox-ul propriu ale SVG-ului, apoi desenează fiecare traseu la lățimea setată de dvs.; înălțimea urmează raportul de aspect. Deoarece desenarea are loc la mărimea finală, liniile subțiri și textul mic sunt netezite o singură dată, la scara corectă. Mărirea ulterioară a unui PNG mic nu arată niciodată la fel de curat.
Fonturile sunt surpriza obișnuită. Dacă SVG-ul indică un font care nu este încorporat sau convertit în contururi, se folosește un font de rezervă, iar lungimea rândurilor se schimbă. Convertiți textul în contururi în instrumentul de design înainte de export. Imaginile externe legate prin URL în SVG nu sunt preluate, deci încorporați-le sau aplatizați mai întâi desenul.
Convertor SVG în WebP: ce să faceți și ce să evitați
| Recomandat | De evitat |
|---|---|
| Randați la 2× lățimea CSS afișată | Nu convertiți pictograme simple inline care sunt mai mici ca SVG |
| Folosiți Fără pierderi pentru logo-uri plate cu puține culori | Nu randați la 4000 px pentru un spațiu de 600 px |
| Păstrați SVG-ul original pentru dimensiuni viitoare | Nu trimiteți WebP în newslettere prin e-mail |
| Servați WebP cu atributele width și height, ca să evitați deplasarea layoutului | Nu vă așteptați la text activ: WebP înseamnă pixeli, nu text selectabil |
Întrebări despre conversia SVG în WebP
Ce lățime în pixeli să folosesc la conversia SVG în WebP?
Luați lățimea la care este afișată imaginea în pixeli CSS și dublați-o, ca să rămână clară pe ecranele telefoanelor și laptopurilor cu densitate mare. O ilustrație afișată într-o coloană de 800 px trebuie randată la 1600 px. Varianta 3× se justifică rar pe web, deoarece fișierul crește, iar câștigul vizibil este mic.
Este WebP mai bun decât SVG pentru un site?
Nu pentru logo-uri, pictograme și diagrame simple: un SVG curat este foarte mic și clar la orice mărime, deci păstrați-l. WebP câștigă la ilustrațiile complexe cu gradienți, filtre sau mii de trasee și în orice loc care acceptă doar imagini bitmap, cum ar fi previzualizările din rețelele sociale sau un CMS fără suport SVG.
Păstrează fișierul WebP fundalul transparent al SVG-ului?
Da. WebP are canal alfa complet, atât în modul cu pierderi, cât și în cel fără pierderi, deci zonele fără umplere din SVG rămân transparente. Marginile formelor sunt netezite față de transparență, ceea ce arată corect pe orice culoare de fundal.
WebP lossy sau lossless pentru grafică vectorială?
Fără pierderi se potrivește logo-urilor plate, pictogramelor și graficelor cu câteva culori uni; acestea se comprimă foarte bine și păstrează margini perfect curate. Cu pierderi, la calitate 85–90, se potrivește ilustrațiilor cu gradienți, umbre sau texturi, unde fișierele fără pierderi devin grele. Încercați ambele variante pe un fișier și păstrați rezultatul mai mic care arată curat.
De ce nu pot încărca SVG în WordPress?
WordPress exclude SVG din tipurile de fișiere permise la încărcare, deoarece un SVG poate conține scripturi. Acceptă WebP începând cu versiunea 5.8, lansată în 2021, deci prin conversie obțineți un fișier pe care biblioteca media îl primește fără un plugin de securitate. Site-urile care au nevoie de vectori adevărați pot adăuga totuși suport SVG printr-un plugin care curăță codul.
Pot folosi fișierul WebP într-un newsletter prin e-mail?
Evitați. Mai mulți clienți de e-mail, inclusiv Outlook desktop pentru Windows, nu afișează WebP, iar Gmail nu afișează nici SVG. Pentru e-mail, randați imaginea cu SVG în PNG.