SVG optimalizáló

SVG fájlok minifikálása: kommentek, metaadatok, szerkesztői attribútumok és felesleges whitespace eltávolítása. Méretcsökkenés %-ban, böngészőben.

Szervermentes Azonnali Privát Ingyenes

Miről szól ez az eszköz?

Az SVG optimalizáló minifikálja a vektorgrafikus fájljaidat: eltávolítja a kommenteket, a metaadatokat, a szerkesztőprogramok (Inkscape, Illustrator) felesleges attribútumait és namespace-eit, valamint a felesleges szóközöket és sortöréseket. A kép megjelenése változatlan marad, a fájlméret viszont jelentősen csökken – gyorsabb betöltést és tisztább kódot eredményezve. Webfejlesztőknek és designereknek, akik ikonokat és illusztrációkat tesznek élesbe.

Hogyan használd a(z) SVG optimalizáló-t?

  1. SVG feltöltése

    Húzd be az SVG fájlt a feltöltési területre vagy tallózd ki.

  2. Optimalizálás

    Kattints az «Optimalizálás» gombra – a minifikálás azonnal lefut.

  3. Eredmény ellenőrzése

    Megjelenik az eredeti és az optimalizált méret, valamint a százalékos csökkenés.

  4. Másolás vagy letöltés

    Másold a tiszta SVG kódot a vágólapra, vagy töltsd le fájlként.

Mikor van rá szükséged?

  • Weboldal-teljesítmény

    Kisebb SVG-k gyorsabb betöltést és jobb Core Web Vitals értékeket adnak.

  • Ikonkészletek

    Szerkesztőből exportált ikonok megtisztítása a felesleges metaadatoktól élesítés előtt.

  • Inline SVG

    Tisztább kód, ha az SVG-t közvetlenül a HTML-be vagy komponensbe ágyazod.

  • Build pipeline

    Kézi optimalizálás gyors ellenőrzéshez, build-eszköz beállítása előtt.

Miért érdemes optimalizálni az SVG-t?

Az SVG (Scalable Vector Graphics) egy XML-alapú vektorformátum, amely tetszőleges méretben éles marad, és webre ideális. A grafikus szerkesztők (Inkscape, Illustrator) azonban exportáláskor gyakran rengeteg felesleges adatot tesznek a fájlba: szerkesztői metaadatokat, rejtett réteginformációkat, hosszú namespace-deklarációkat és bőséges whitespace-t.

Ezek az elemek nem befolyásolják a kép megjelenését, viszont feleslegesen növelik a fájlméretet. Az optimalizálás eltávolítja őket, így a fájl kisebb lesz, gyorsabban töltődik, és a kódja is áttekinthetőbb – különösen fontos ez, ha az SVG-t inline módon ágyazod a HTML-be, ahol minden bájt a HTML-súlyt növeli.

Hasznos tippek

  • A szerkesztőből exportált SVG-knél a legnagyobb a megtakarítás – ezek tele vannak felesleges metaadattal.

  • Az optimalizált SVG-t a szerveren gzip/brotli tömörítéssel kombinálva még kisebb lesz az átvitt méret.

  • A fájl a böngésződben marad – bizalmas, publikálatlan grafikákat is nyugodtan optimalizálhatsz.

Gyakori kérdések