Ottimizzatur tal-SVG
Ottimizza u minifika fajls SVG online bl-SVGO, fil-brawżer tiegħek. Agħżel preset, qabbel ir-riżultat viżwalment u ara l-iffrankar tad-daqs u tal-gzip.
Plugins
Meta tneħħi l-viewBox id-disinn ma jiskalax iktar, u li tqassar jew tneħħi l-IDs tkisser is-CSS, il-JavaScript, l-links <use> jew l-anchors li jirreferu għalihom. Żomm il-preset Sikur għall-SVGs użati fil-kodiċi, f’sprites jew f’animazzjonijiet.
- Daqs oriġinali
- Daqs ottimizzat
- Iffrankar
- Gzipped
Kif tottimizza SVG
- Waqqa’ fajl SVG fiż-żona tat-tqegħid jew ikklikkja fuqha biex tagħżel wieħed. Tista’ wkoll twaħħal il-markup fil-kaxxa Kodiċi SVG.
- Agħżel Preset: Sikur, Bilanċjat (il-predefinit) jew Massimu. Il-lista Plugins t’isfel turi eżatt liema passi jixgħel kull preset.
- Irranġa jekk meħtieġ: il-Preċiżjoni deċimali (0 sa 8 ċifri), Diversi passaġġi, u Pretty print (output b’indentazzjoni) jekk trid kodiċi leġibbli. Hekk kif tbiddel plugin, il-preċiżjoni jew il-passaġġi, il-preset jinbidel fuq Personalizzat.
- Ikklikkja Ottimizza SVG. Fajl imwaqqa’ jiġi ottimizzat minnufih, u ladarba jkun hemm riżultat, kull bidla fis-settings terġa’ tħaddem l-ottimizzazzjoni awtomatikament.
- Iċċekkja ċ-ċifri ta’ Daqs oriġinali, Daqs ottimizzat, Iffrankar u Gzipped, imbagħad qabbel iż-żewġ disinji maġenb xulxin.
- Ikklikkja Ikkopja biex tikkopja l-Kodiċi SVG ottimizzat, jew Niżżel l-SVG ottimizzat biex taħżnu bħala
isem.min.svg.
L-ottimizzazzjoni ssir bl-SVGO 4, l-ottimizzatur SVG open source (MIT) standard użat fil-biċċa l-kbira tal-għodod tal-bini tal-web. Il-verżjoni tiegħu għall-brawżer titgħabba l-ewwel darba li tikklikkja, u taħdem għalkollox fuq l-apparat tiegħek: l-SVG tiegħek ma jittella’ qatt.
Għaliex fajls SVG minn għodod tad-disinn huma tant tqal
SVG esportat minn Illustrator, Inkscape, Figma jew Sketch iġorr ħafna iktar mid-disinn. L-edituri jżidu l-namespaces u l-attributi tagħhom stess (ismijiet ta’ saffi, gwidi, settings tal-esportazzjoni), blokk <metadata>, kummenti bħal “Generator: Adobe Illustrator”, koordinati b’sitt deċimali jew iktar, gruppi li fihom element wieħed, u kuluri verbużi bħal #ffffff. Xejn minn dan ma jbiddel dak li l-brawżer jpinġi. L-SVGO jneħħih, iddawwar in-numri, jerġa’ jikteb id-dejta tal-paths b’kmandi iqsar, iqassar il-kuluri u jgħaqqad jew jiftaħ elementi żejda. Tnaqqis ta’ 40–60% huwa komuni għall-ikoni u l-illustrazzjonijiet esportati.
Presets u plugins riskjużi
- Sikur iħaddem il-preset predefinit tal-SVGO imma jżomm l-IDs,
<desc>, paths separati u regoli<style>, b’3 deċimali u passaġġ wieħed. Uża għal SVGs li jirreferi għalihom is-CSS jew il-JavaScript, sprites u animazzjonijiet. - Bilanċjat huwa l-preset predefinit tal-SVGO, 3 deċimali, diversi passaġġi. Jaqbel għall-biċċa l-kbira tal-ikoni u l-illustrazzjonijiet murija bħala immaġini.
- Massimu iżid Neħħi
, Neħħi l-iscripts u l-attributi tal-avvenimenti, Neħħi width/height (żomm viewBox) u Ibdel xlink:href b’href, b’2 deċimali u diversi passaġġi.
Ebda preset ma jneħħi l-viewBox. Neħħi viewBox hemm għal każijiet speċjali biss: mingħajru, id-disinn ma jistax jiskala iktar għad-daqs li tagħtih fis-CSS.
Kun af x’jistgħu jkissru l-plugins l-oħra:
- Qassar u neħħi l-IDs mhux użati jerġa’ jisimma IDs bħal
#icon-homegħala. Kull selettur CSS, query tal-JavaScript, referenza<use href="#…">ta’ sprite, anchor tal-paġna jew animazzjoni SMIL/CSS li tindirizza l-isem l-antik tieqaf taħdem. - Neħħi
u Neħħi iħassru l-isem u d-deskrizzjoni aċċessibbli. Żommhom fuq ikoni u charts sinifikanti li l-qarrejja tal-iskrin iridu jħabbru. - Preċiżjoni deċimali baxxa tista’ tiddeforma ikoni żgħar: il-kurvi jitħawdu u t-truf jiċċaqalqu. Iċċekkja dejjem it-tqabbil viżwali; 3 huwa predefinit sikur.
- Ngħaqqad il-paths jgħaqqad paths maġenb xulxin f’wieħed, għalhekk effett hover jew animazzjoni li kienet timmira path wieħed titlef il-mira tagħha.
Pariri
- Żomm kopja master mhux ottimizzata għall-editjar; ittratta l-
.min.svgbħal kodiċi kkompilat. - Attiva gzip jew brotli fuq is-server tiegħek: formati tat-test bħal SVG jikkompressaw tajjeb ħafna, u ċ-ċifra Gzipped turi dak li l-viżitaturi fil-fatt jniżżlu (turi meta l-brawżer tiegħek jappoġġja
CompressionStream). - SVG inline jista’ jiġi stilizzat bis-CSS u animat imma ma jinżammx f’cache separatament; SVG f’
<img>jinżamm f’cache imma ma jistax jiġi stilizzat mill-paġna.
Mistoqsijiet frekwenti
L-SVG tiegħi jittella’ fuq server?
Le. L-SVGO jaħdem fil-brawżer tiegħek. L-uniku tniżżil huwa l-kodiċi tal-ottimizzatur innifsu, l-ewwel darba li tottimizza.
Għaliex il-previżjoni tintwera bħala immaġini?
SVG huwa format ta’ dokument li jista’ jkun fih JavaScript u jgħabbi fajls esterni. Iż-żewġ previżjonijiet jitpinġu bħala <img> minn blob URLs lokali, u f’dak il-mod il-brawżers qatt ma jħaddmu scripts jew jġibu riżorsi esterni, għalhekk li tara previżjoni ta’ SVG mhux fdat hawn huwa sikur. Il-kodiċi ottimizzat innifsu xorta jkun fih kull script sakemm Neħħi l-iscripts u l-attributi tal-avvenimenti ma jkunx attiv (huwa f’Massimu).
L-SVG ottimizzat tiegħi ma jiskalax iktar. X’ġara?
Il-viewBox x’aktarx tneħħa, jew minn Neħħi viewBox jew qabel minn għodda oħra. Erġa’ ottimizza l-oriġinal b’dak il-plugin mitfi.
Għaliex l-ikona sprite jew l-animazzjoni tiegħi waqfet taħdem?
Qassar u neħħi l-IDs mhux użati jew Ngħaqqad il-paths biddlu l-elementi li l-kodiċi tiegħek jirreferi għalihom. Uża l-preset Sikur, li jżomm it-tnejn.
Il-fajl ottimizzat mhuwiex iżgħar. Għaliex?
L-SVG x’aktarx diġà huwa minifikat. Ipprova Massimu jew Preċiżjoni deċimali aktar baxxa, u itfi Pretty print (output b’indentazzjoni).
Għodod relatati
- SVG għal PNG Ikkonverti SVG għal PNG, JPG jew WebP fil-brawżer tiegħek b’kull wisa’, għoli, skala jew DPI, b’sfond trasparenti jew ikkulurit. F’lott u ZIP, mingħajr upload.
- Immaġni għal SVG (traċċar vettorjali) Ikkonverti logo jew disinn PNG jew JPG f’paths vettorjali SVG fil-brawżer tiegħek. Presets, għadd ta’ kuluri, filtru tat-tikek, mingħajr upload.
- Kompressur tal-immaġini Ikkompressa immaġini JPG, PNG u WebP b’slider tal-kwalità, qabbel id-daqsijiet qabel u wara, u pproċessa ritratti f’lott mingħajr ma ttellagħhom.
- Formatter u minifier tas-CSS Ibbewtifika CSS mħawwad b’indentazzjoni nadifa jew minimizzah bil-csso, u ara d-daqs qabel u wara. Jaħdem fil-brawżer tiegħek; xejn ma jittella’.