Teknobench

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.

Kif tottimizza SVG

  1. 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.
  2. Agħżel Preset: Sikur, Bilanċjat (il-predefinit) jew Massimu. Il-lista Plugins t’isfel turi eżatt liema passi jixgħel kull preset.
  3. 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.
  4. 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.
  5. Iċċekkja ċ-ċifri ta’ Daqs oriġinali, Daqs ottimizzat, Iffrankar u Gzipped, imbagħad qabbel iż-żewġ disinji maġenb xulxin.
  6. 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 </strong>, <strong>Neħħi l-iscripts u l-attributi tal-avvenimenti</strong>, <strong>Neħħi width/height (żomm viewBox)</strong> u <strong>Ibdel xlink:href b’href</strong>, b’2 deċimali u diversi passaġġi.</li> </ul> <p>Ebda preset ma jneħħi l-viewBox. <strong>Neħħi viewBox</strong> hemm għal każijiet speċjali biss: mingħajru, id-disinn ma jistax jiskala iktar għad-daqs li tagħtih fis-CSS.</p> <p>Kun af x’jistgħu jkissru l-plugins l-oħra:</p> <ul> <li><strong>Qassar u neħħi l-IDs mhux użati</strong> jerġa’ jisimma IDs bħal <code>#icon-home</code> għal <code>a</code>. Kull selettur CSS, query tal-JavaScript, referenza <code><use href="#…"></code> ta’ sprite, anchor tal-paġna jew animazzjoni SMIL/CSS li tindirizza l-isem l-antik tieqaf taħdem.</li> <li><strong>Neħħi <title></strong> u <strong>Neħħi <desc></strong> iħassru l-isem u d-deskrizzjoni aċċessibbli. Żommhom fuq ikoni u charts sinifikanti li l-qarrejja tal-iskrin iridu jħabbru.</li> <li><strong>Preċiżjoni deċimali</strong> 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.</li> <li><strong>Ngħaqqad il-paths</strong> 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.</li> </ul> <h2>Pariri</h2> <ul> <li>Żomm kopja master mhux ottimizzata għall-editjar; ittratta l-<code>.min.svg</code> bħal kodiċi kkompilat.</li> <li>Attiva gzip jew brotli fuq is-server tiegħek: formati tat-test bħal SVG jikkompressaw tajjeb ħafna, u ċ-ċifra <strong>Gzipped</strong> turi dak li l-viżitaturi fil-fatt jniżżlu (turi meta l-brawżer tiegħek jappoġġja <code>CompressionStream</code>).</li> <li>SVG inline jista’ jiġi stilizzat bis-CSS u animat imma ma jinżammx f’cache separatament; SVG f’<code><img></code> jinżamm f’cache imma ma jistax jiġi stilizzat mill-paġna.</li> </ul></div> <section class="mt-10" aria-labelledby="faq"> <h2 id="faq" class="text-2xl font-semibold">Mistoqsijiet frekwenti</h2> <div class="mt-4 divide-y divide-line rounded-xl border border-line bg-surface"> <details class="faq group"> <summary>L-SVG tiegħi jittella’ fuq server?</summary> <div class="prose px-5 pb-5"><p>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.</p></div> </details> <details class="faq group"> <summary>Għaliex il-previżjoni tintwera bħala immaġini?</summary> <div class="prose px-5 pb-5"><p>SVG huwa format ta’ dokument li jista’ jkun fih JavaScript u jgħabbi fajls esterni. Iż-żewġ previżjonijiet jitpinġu bħala <code><img></code> 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 <strong>Neħħi l-iscripts u l-attributi tal-avvenimenti</strong> ma jkunx attiv (huwa f’<strong>Massimu</strong>).</p></div> </details> <details class="faq group"> <summary>L-SVG ottimizzat tiegħi ma jiskalax iktar. X’ġara?</summary> <div class="prose px-5 pb-5"><p>Il-viewBox x’aktarx tneħħa, jew minn <strong>Neħħi viewBox</strong> jew qabel minn għodda oħra. Erġa’ ottimizza l-oriġinal b’dak il-plugin mitfi.</p></div> </details> <details class="faq group"> <summary>Għaliex l-ikona sprite jew l-animazzjoni tiegħi waqfet taħdem?</summary> <div class="prose px-5 pb-5"><p><strong>Qassar u neħħi l-IDs mhux użati</strong> jew <strong>Ngħaqqad il-paths</strong> biddlu l-elementi li l-kodiċi tiegħek jirreferi għalihom. Uża l-preset <strong>Sikur</strong>, li jżomm it-tnejn.</p></div> </details> <details class="faq group"> <summary>Il-fajl ottimizzat mhuwiex iżgħar. Għaliex?</summary> <div class="prose px-5 pb-5"><p>L-SVG x’aktarx diġà huwa minifikat. Ipprova <strong>Massimu</strong> jew <strong>Preċiżjoni deċimali</strong> aktar baxxa, u itfi <strong>Pretty print (output b’indentazzjoni)</strong>.</p></div> </details> </div> </section> <section class="mt-10" aria-labelledby="related"> <h2 id="related" class="text-2xl font-semibold">Għodod relatati</h2> <ul class="card-grid mt-4"><li><a class="card" href="/mt/svg-ghal-png/"> <span class="card-title">SVG għal PNG</span> <span class="card-text">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.</span> </a></li> <li><a class="card" href="/mt/immagni-ghal-svg/"> <span class="card-title">Immaġni għal SVG (traċċar vettorjali)</span> <span class="card-text">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.</span> </a></li> <li><a class="card" href="/mt/kompressur-tal-immagini/"> <span class="card-title">Kompressur tal-immaġini</span> <span class="card-text">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.</span> </a></li> <li><a class="card" href="/mt/formatter-tas-css/"> <span class="card-title">Formatter u minifier tas-CSS</span> <span class="card-text">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’.</span> </a></li> </ul> </section> </article> <div class="hidden lg:block"> <div class="sticky top-24"><aside class="ad-slot ad-slot-sidebar" data-ad-slot="sidebar" aria-label="Reklam"><span class="ad-label">Reklam</span></aside> </div> </div> </div> </main> <footer class="mt-16 border-t border-line bg-surface"> <div class="mx-auto grid max-w-6xl gap-8 px-4 py-10 sm:grid-cols-3 text-sm"> <div> <p class="font-semibold">Teknobench</p> <p class="mt-2 text-muted">Għodod online b’xejn li jaħdmu fil-brawżer tiegħek. Id-data tiegħek tibqa’ fuq l-apparat tiegħek.</p> </div> <nav aria-label="L-għodod kollha"> <p class="font-semibold">Għodod</p> <ul class="mt-2 space-y-1"><li><a class="link-muted" href="/mt/godod-tat-test/">Għodod tat-test</a></li><li><a class="link-muted" href="/mt/godod-ghall-izviluppaturi/">Għodod għall-iżviluppaturi</a></li><li><a class="link-muted" href="/mt/web-seo-u-marketing/">Web, SEO u marketing</a></li><li><a class="link-muted" href="/mt/kuluri-u-disinn/">Kuluri u disinn</a></li><li><a class="link-muted" href="/mt/godod-tal-immagini/">Għodod tal-immaġini</a></li><li><a class="link-muted" href="/mt/pdf-u-dokumenti/">PDF u dokumenti</a></li><li><a class="link-muted" href="/mt/kalkulaturi-matematici/">Kalkulaturi matematiċi</a></li><li><a class="link-muted" href="/mt/kalkulaturi-finanzjarji/">Kalkulaturi finanzjarji</a></li><li><a class="link-muted" href="/mt/data-u-hin/">Data u ħin</a></li><li><a class="link-muted" href="/mt/konvertituri-tal-unitajiet/">Konvertituri tal-unitajiet</a></li><li><a class="link-muted" href="/mt/sahha-u-fitness/">Saħħa u fitness</a></li><li><a class="link-muted" href="/mt/dar-kcina-u-karozza/">Dar, kċina u karozza</a></li><li><a class="link-muted" href="/mt/generaturi/">Ġeneraturi</a></li><li><a class="link-muted" href="/mt/testijiet-tal-apparat-u-brawzer/">Testijiet tal-apparat u tal-brawżer</a></li><li><a class="link-muted" href="/mt/awdjo-u-vidjo/">Awdjo u vidjo</a></li><li><a class="link-muted" href="/mt/edukazzjoni-u-lingwi/">Edukazzjoni u lingwi</a></li><li><a class="link-muted" href="/mt/loghob/">Logħob</a></li></ul> </nav> <nav aria-label="Tagħrif"> <p class="font-semibold">Tagħrif</p> <ul class="mt-2 space-y-1"> <li><a class="link-muted" href="/mt/dwarna/">Dwarna</a></li> <li><a class="link-muted" href="/mt/kuntatt/">Kuntatt</a></li> <li><a class="link-muted" href="/mt/politika-tal-privatezza/">Politika tal-privatezza</a></li> <li><a class="link-muted" href="/mt/termini-ta-uzu/">Termini tal-użu</a></li> <li><a class="link-muted" href="/mt/licenzji/">Licenzji open source</a></li> </ul> </nav> </div> <p class="border-t border-line py-4 text-center text-xs text-muted">© 2026 Teknobench</p> </footer> </body> </html>