Berkas SVG lebih kecil yang tampil persis sama
SVG yang diekspor dari Illustrator, Figma, Inkscape, atau Sketch membawa banyak muatan yang tidak pernah digambar browser: metadata editor, komentar, layer tersembunyi, angka dengan delapan angka desimal, grup di dalam grup. Optimizer ini menjalankan SVGO — alat optimasi SVG standar — di browser Anda untuk membuangnya, lalu menampilkan hasilnya di samping aslinya agar Anda bisa melihat bahwa tidak ada yang berubah selain ukurannya.
Cara mengoptimasi SVG
- 1Jatuhkan satu atau beberapa berkas SVG, pilih berkasnya, atau tempel markup SVG.
- 2Periksa pratinjau sebelum dan sesudah, serta ukuran yang dihemat untuk setiap berkas.
- 3Turunkan Presisi untuk berkas yang lebih kecil; naikkan jika kurva mulai tampak salah.
- 4Nyalakan atau matikan plugin SVGO satu per satu — misalnya, hapus width dan height agar SVG mengikuti ukuran dari CSS.
- 5Unduh SVG yang sudah dioptimasi, salin markup-nya, atau unduh semua berkas sekaligus sebagai ZIP.
Apa saja yang dibuang
- Data editor
- Metadata, komentar, deklarasi XML dan doctype, serta namespace dan atribut yang ditambahkan Inkscape, Illustrator, dan Sketch untuk keperluan mereka sendiri.
- Markup berlebih
- Grup dan atribut kosong, nilai default, elemen tersembunyi, definisi dan ID yang tidak terpakai, serta grup yang hanya membungkus satu elemen.
- Geometri yang bertele-tele
- Data path ditulis ulang dengan perintah relatif dan digit lebih sedikit, bentuk diubah menjadi path yang lebih pendek, dan transform dilebur ke dalam koordinat jika memungkinkan.
Default yang aman, opsi yang lebih kuat
Set default adalah preset bawaan SVGO, yang dipilih agar gambar tidak berubah. Opsi tambahan bertindak lebih jauh tetapi mengubah lebih dari sekadar ukuran: menghapus width dan height membuat SVG memenuhi wadahnya, menghapus title menyembunyikan namanya dari pembaca layar, dan menghapus xmlns hanya cocok untuk SVG yang ditempel langsung (inline) ke HTML.
Untuk mengubah gambar bitmap menjadi SVG terlebih dahulu, gunakan konverter gambar, yang bisa mengirim SVG-nya langsung ke sini; untuk menyematkan hasilnya, gunakan gambar ke Base64.
Pertanyaan yang sering diajukan
- Apakah ini sama dengan SVGO atau SVGOMG?
- Alat ini menjalankan SVGO itu sendiri, mesin yang sama yang dipakai SVGOMG, dengan preset default-nya dan plugin yang sama sebagai sakelar. Semuanya berjalan di browser Anda.
- Apakah optimasi akan mengubah tampilan SVG saya?
- Tidak dengan pengaturan default. Presisi yang sangat rendah bisa membengkokkan kurva halus, dan beberapa opsi tambahan mengubah ukuran atau aksesibilitas — pratinjau sebelum dan sesudah langsung menunjukkan perbedaannya.
- Bisakah saya mengoptimasi beberapa berkas SVG sekaligus?
- Bisa. Jatuhkan sebanyak yang Anda mau, ubah pengaturan sekali untuk semuanya, dan unduh semuanya bersama sebagai ZIP.
- Mengapa ukuran gzip ditampilkan?
- Server web biasanya mengirim SVG dalam bentuk terkompresi gzip, jadi ukuran itu lebih mendekati apa yang benar-benar diunduh pengunjung.
- Apakah berkas saya diunggah?
- Tidak. SVGO berjalan di browser Anda dan berkas tidak pernah meninggalkan perangkat Anda.