Teknobench
Catagóirí ▾
Teanga: ga ▾

Barrfheabhsóir SVG

Barrfheabhsaigh agus miniaigh comhaid SVG ar líne le SVGO, i do bhrabhsálaí. Roghnaigh réamhshocrú, déan comparáid amhairc agus féach na coigiltis méide.

Breiseáin

Má bhainfidh tú an viewBox, ní scálfaidh an líníocht a thuilleadh, agus má ghiorraíonn nó má bhainfidh tú IDanna, brisfidh naisc CSS, JavaScript, <use> nó ancaire a thagraíonn dóibh. Coinnigh an réamhshocrú Sábháilte do SVGanna a úsáidtear i gcód, i spríteanna nó i mbeochan.

Conas SVG a bharrfheabhsú

  1. Scaoil comhad SVG sa limistéar scaoilte nó cliceáil air chun ceann a roghnú. Is féidir leat an marcáil a ghreamú sa bhosca Cód SVG freisin.
  2. Roghnaigh Réamhshocrú: Sábháilte, Cothromaithe (an réamhshocrú) nó Uasta. Taispeánann an liosta Breiseáin thíos go beacht na céimeanna a chasann gach réamhshocrú air.
  3. Coigeartaigh más gá: an Cruinneas deachúil (0 go 8 ndigit), Pasanna iolracha, agus Priontáil dheas (aschur eangaithe) más mian leat cód inléite. Chomh luath agus a athraíonn tú breiseán, an cruinneas nó na pasanna, aistríonn an réamhshocrú go Saincheaptha.
  4. Cliceáil Barrfheabhsaigh SVG. Barrfheabhsaítear comhad scaoilte láithreach, agus a luaithe a bhíonn toradh ann, ritheann gach athrú socruithe an barrfheabhsú arís go huathoibríoch.
  5. Seiceáil na figiúirí Bunmhéid, Méid barrfheabhsaithe, Coigilt agus Gzip, ansin cuir an dá líníocht i gcomparáid taobh le taobh.
  6. Cliceáil Cóipeáil chun an Cód SVG barrfheabhsaithe a chóipeáil, nó Íoslódáil SVG barrfheabhsaithe chun é a shábháil mar name.min.svg.

Déanann SVGO 4 an barrfheabhsú, an barrfheabhsóir SVG foinse oscailte (MIT) caighdeánach a úsáidtear i bhformhór uirlisí tógála gréasáin. Luchtaítear a leagan brabhsálaí an chéad uair a chliceálann tú, agus ritheann sé go hiomlán ar do ghléas: ní uaslódáiltear d’SVG riamh.

Cén fáth a bhfuil comhaid SVG ó uirlisí dearaidh chomh trom

Iompraíonn SVG a easpórtáiltear ó Illustrator, Inkscape, Figma nó Sketch i bhfad níos mó ná an líníocht. Cuireann eagarthóirí a n-ainmspásanna agus a dtréithe féin leis (ainmneacha sraitheanna, treoracha, socruithe easpórtála), bloc <metadata>, tuairimí mar “Generator: Adobe Illustrator”, comhordanáidí le sé dheachúil nó níos mó, grúpaí ina bhfuil gné amháin, agus dathanna fadchainteacha mar #ffffff. Ní athraíonn aon cheann de seo an méid a tharraingíonn an brabhsálaí. Bainfidh SVGO é seo, cruinníonn sé uimhreacha, athscríobhann sé sonraí cosáin le horduithe níos giorra, giorraíonn sé dathanna agus cumasc nó díphacálann sé gnéithe iomarcacha. Is gnách laghdú 40–60% do dheilbhíní agus do léaráidí easpórtáilte.

Réamhshocruithe agus breiseáin dhainséaracha

  • Ritheann Sábháilte réamhshocrú réamhshocraithe SVGO ach coinníonn sé IDanna, <desc>, cosáin ar leith agus rialacha <style>, le 3 dheachúil agus pas amháin. Úsáid é d’SVGanna a luaitear ó CSS nó JavaScript, spríteanna agus beochan.
  • Is é Cothromaithe réamhshocrú réamhshocraithe SVGO, 3 dheachúil, pasanna iolracha. Oireann sé do fhormhór na ndeilbhíní agus na léaráidí a thaispeántar mar íomhánna.
  • Cuireann Uasta Bain </strong>, <strong>Bain scripteanna agus tréithe imeachta</strong>, <strong>Bain width/height (coinnigh viewBox)</strong> agus <strong>Cuir href in ionad xlink:href</strong> leis, le 2 dheachúil agus pasanna iolracha.</li> </ul> <p>Ní bhaineann aon réamhshocrú an viewBox. Níl <strong>Bain viewBox</strong> ann ach do chásanna speisialta: gan é, ní féidir leis an líníocht scálú go dtí an méid a thugann tú di i CSS.</p> <p>Bíodh a fhios agat cad is féidir leis na breiseáin eile a bhriseadh:</p> <ul> <li>Athainmníonn <strong>Giorraigh agus bain IDanna nach n-úsáidtear</strong> IDanna mar <code>#icon-home</code> go <code>a</code>. Stopann aon roghnóir CSS, fiosrúchán JavaScript, tagairt spríte <code><use href="#…"></code>, ancaire leathanaigh nó beochan SMIL/CSS a dhíríonn ar an seanainm ag obair.</li> <li>Scriosann <strong>Bain <title></strong> agus <strong>Bain <desc></strong> an t-ainm agus an cur síos inrochtana. Coinnigh iad ar dheilbhíní agus ar chairteacha brí a gcaithfidh léitheoirí scáileáin iad a fhógairt.</li> <li>D’fhéadfadh <strong>Cruinneas deachúil</strong> íseal deilbhíní beaga a shaobhadh: critheann cuair agus imíonn imill. Seiceáil an chomparáid amhairc i gcónaí; is réamhshocrú sábháilte é 3.</li> <li>Tagann <strong>Cumaisc cosáin</strong> le chéile cosáin chomhghaolmhara in aon cheann amháin, mar sin cailleann éifeacht hover nó beochan a dhírigh ar chosán amháin a sprioc.</li> </ul> <h2>Leideanna</h2> <ul> <li>Coinnigh máistir-chóip neamhbharrfheabhsaithe le haghaidh eagarthóireachta; déileáil leis an <code>.min.svg</code> mar chód tiomsaithe.</li> <li>Cumasaigh gzip nó brotli ar do fhreastalaí: comhbhrúnn formáidí téacs mar SVG go han-mhaith, agus taispeánann an figiúr <strong>Gzip</strong> an méid a íoslódálann cuairteoirí i ndáiríre (taispeántar nuair a thacaíonn do bhrabhsálaí le <code>CompressionStream</code>).</li> <li>Is féidir SVG inlíne a stíliú le CSS agus a bheochan ach ní chaipeáiltear ar leith é; caipeáiltear SVG in <code><img></code> ach ní féidir é a stíliú ón leathanach.</li> </ul></div> <section class="mt-10" aria-labelledby="faq"> <h2 id="faq" class="text-2xl font-semibold">Ceisteanna coitianta</h2> <div class="mt-4 divide-y divide-line rounded-xl border border-line bg-surface"> <details class="faq group"> <summary>An uaslódáiltear mo SVG chuig freastalaí?</summary> <div class="prose px-5 pb-5"><p>Ní uaslódáiltear. Ritheann SVGO i do bhrabhsálaí. Is é cód an bharrfheabhsóra féin an t-aon íoslódáil, an chéad uair a bharrfheabhsaíonn tú.</p></div> </details> <details class="faq group"> <summary>Cén fáth a dtaispeántar an réamhamharc mar íomhánna?</summary> <div class="prose px-5 pb-5"><p>Is formáid doiciméid é SVG ar féidir JavaScript a bheith ann agus comhaid sheachtracha a luchtú. Rindreáiltear an dá réamhamharc mar <code><img></code> ó URLanna blob áitiúla, agus sa mhodh sin ní ritheann brabhsálaithe scripteanna riamh ná ní fhaigheann siad acmhainní seachtracha, mar sin tá sé sábháilte SVG neamhiontaofa a réamhamharc anseo. Tá aon scripteanna sa chód barrfheabhsaithe féin fós ann mura bhfuil <strong>Bain scripteanna agus tréithe imeachta</strong> ar siúl (tá sé in <strong>Uasta</strong>).</p></div> </details> <details class="faq group"> <summary>Níl mo SVG barrfheabhsaithe ag scálú a thuilleadh. Cad a tharla?</summary> <div class="prose px-5 pb-5"><p>Is dócha gur baineadh an viewBox, ag <strong>Bain viewBox</strong> nó níos luaithe ag uirlis eile. Barrfheabhsaigh an bunchomhad arís leis an mbreiseán sin múchta.</p></div> </details> <details class="faq group"> <summary>Cén fáth ar stop mo sprít deilbhín nó mo bheochan ag obair?</summary> <div class="prose px-5 pb-5"><p>D’athraigh <strong>Giorraigh agus bain IDanna nach n-úsáidtear</strong> nó <strong>Cumaisc cosáin</strong> na gnéithe a dtagraíonn do chód dóibh. Úsáid an réamhshocrú <strong>Sábháilte</strong>, a choinníonn an dá cheann.</p></div> </details> <details class="faq group"> <summary>Níl an comhad barrfheabhsaithe níos lú. Cén fáth?</summary> <div class="prose px-5 pb-5"><p>Is dócha go bhfuil an SVG miniaithe cheana. Bain triail as <strong>Uasta</strong> nó <strong>Cruinneas deachúil</strong> níos ísle, agus múch <strong>Priontáil dheas (aschur eangaithe)</strong>.</p></div> </details> </div> </section> <section class="mt-10" aria-labelledby="related"> <h2 id="related" class="text-2xl font-semibold">Uirlisí gaolmhara</h2> <ul class="card-grid mt-4"><li><a class="card" href="/ga/svg-go-png/"> <span class="card-title">Tiontaire SVG go PNG</span> <span class="card-text">Tiontaigh SVG go PNG, JPG nó WebP i do bhrabhsálaí ag aon leithead, airde, scála nó DPI, le cúlra trédhearcach nó daite. Baisc agus ZIP, gan uaslódáil.</span> </a></li> <li><a class="card" href="/ga/iomha-go-svg/"> <span class="card-title">Íomhá go SVG (rianaire veicteora)</span> <span class="card-text">Tiontaigh lógó nó líníocht PNG nó JPG ina cosáin veicteora SVG i do bhrabhsálaí. Réamhshocruithe, líon dathanna agus scagaire bricíní, gan uaslódáil.</span> </a></li> <li><a class="card" href="/ga/comhbhruiteoir-iomhanna/"> <span class="card-title">Comhbhrúiteoir íomhánna</span> <span class="card-text">Comhbhrúigh íomhánna JPG, PNG agus WebP le sleamhnán cáilíochta, déan comparáid idir méideanna, agus próiseáil baisc gan uaslódáil.</span> </a></li> <li><a class="card" href="/ga/formaideoir-css/"> <span class="card-title">Formáidiú agus Miniú CSS</span> <span class="card-text">Maisigh CSS praslach le heangú glan nó minigh é le csso, agus féach ar an méid roimh agus tar éis. Ritheann sé i do bhrabhsálaí; ní uaslódáiltear aon rud.</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="Fógra"><span class="ad-label">Fógra</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">Uirlisí saor in aisce ar líne a oibríonn i do bhrabhsálaí. Fanann do shonraí ar do ghléas.</p> </div> <nav aria-label="Gach uirlis"> <p class="font-semibold">Uirlisí</p> <ul class="mt-2 space-y-1"><li><a class="link-muted" href="/ga/uirlisi-teacs/">Uirlisí téacs</a></li><li><a class="link-muted" href="/ga/uirlisi-forbartha/">Uirlisí forbartha</a></li><li><a class="link-muted" href="/ga/greasan-seo-margaiocht/">Gréasán, SEO agus margaíocht</a></li><li><a class="link-muted" href="/ga/dathanna-agus-dearadh/">Dathanna agus dearadh</a></li><li><a class="link-muted" href="/ga/iomhanna-agus-grianghraif/">Íomhánna agus grianghraif</a></li><li><a class="link-muted" href="/ga/pdf-agus-doicimeid/">PDF agus doiciméid</a></li><li><a class="link-muted" href="/ga/aireamhain-mhatamaitice/">Áireamháin mhatamaitice</a></li><li><a class="link-muted" href="/ga/aireamhain-airgeadais/">Áireamháin airgeadais</a></li><li><a class="link-muted" href="/ga/datai-agus-am/">Dátaí agus am</a></li><li><a class="link-muted" href="/ga/tiontairi-aonad/">Tiontairí aonad</a></li><li><a class="link-muted" href="/ga/slainte-agus-follaine/">Sláinte agus folláine</a></li><li><a class="link-muted" href="/ga/baile-cistin-agus-carr/">Baile, cistin agus carr</a></li><li><a class="link-muted" href="/ga/gineadoiri/">Gineadóirí</a></li><li><a class="link-muted" href="/ga/tastail-gaireas-agus-brabhsala/">Tástálacha gaireas agus brabhsálaí</a></li><li><a class="link-muted" href="/ga/fuaim-agus-fisean/">Fuaim agus físeán</a></li><li><a class="link-muted" href="/ga/oideachas-agus-teangacha/">Oideachas agus teangacha</a></li><li><a class="link-muted" href="/ga/cluichi/">Cluichí</a></li></ul> </nav> <nav aria-label="Eolas"> <p class="font-semibold">Eolas</p> <ul class="mt-2 space-y-1"> <li><a class="link-muted" href="/ga/faoinn/">Fúinn</a></li> <li><a class="link-muted" href="/ga/teagmhail/">Teagmháil</a></li> <li><a class="link-muted" href="/ga/polasai-priobhaideachais/">Polasaí príobháideachais</a></li> <li><a class="link-muted" href="/ga/tearmai-usaide/">Téarmaí úsáide</a></li> <li><a class="link-muted" href="/ga/ceadunais/">Ceadúnais foinse oscailte</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>