UltKit

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

Rezultat

Fișierele sunt procesate pe serverele noastre și șterse după 30 minute.

Cum se folosește acest instrument

  1. 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. 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. 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.

Răspuns

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

40:21

1200 × 630 px

Previzualizare link Open Graph

Imaginea afișată când pagina este distribuită

16:9

1920 × 1080 px

Ilustrație hero pe toată lățimea

Acoperă majoritatea ecranelor de desktop la 1×

16:9

1600 × 900 px

Imagine pentru coloana de blog la 2×

Pentru o coloană de conținut de 800 px

4:1

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
Convertor SVG

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
Convertor WEBP

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

RecomandatDe 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 culoriNu randați la 4000 px pentru un spațiu de 600 px
Păstrați SVG-ul original pentru dimensiuni viitoareNu trimiteți WebP în newslettere prin e-mail
Servați WebP cu atributele width și height, ca să evitați deplasarea layoutuluiNu 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.