Vektör tasarımdan dışa aktarılmış SVG dosyalarını boyut kaybı olmadan optimize etmenin adım adım yolu.
Bu aracı hemen kullanın
Hesaplamayı yapmak için araca gidin
SVG Optimize aracı; vektör grafik düzenleme yazılımlarından dışa aktardığınız SVG dosyalarındaki yorum, metadata ve editör artıklarını temizleyerek dosya boyutunu küçültür. Görsel kalite korunur, yalnızca görüntülenmeyen veriler kaldırılır.
Üstteki giriş alanına SVG kodunu yapıştırın ya da Yükle sekmesinden .svg dosyasını seçin. Aracın geçerli bir SVG olup olmadığını otomatik doğruladığını görürsünüz.
Yorumları kaldır, metadata temizle, editör namespace siler, boşlukları sıkıştır gibi seçeneklerden ihtiyacınıza uygun olanları işaretleyin. Varsayılan ayarlar çoğu kullanım için yeterlidir.
Bazı yazılımlar yalnızca width ve height değerleri ekler; viewBox ekle seçeneği SVG'nin duyarlı (responsive) ölçeklenmesini sağlar. Web kullanımı için bu seçeneği açmanız önerilir.
JavaScript ile SVG elementlerine erişen kodlarınız varsa ID kısaltma referansları bozabilir. Yalnızca statik SVG'ler için kısaltmayı açın.
Sağ panelde orijinal boyut, optimize boyut ve yüzde olarak kazanç görünür. Tipik olarak 30-70 arası küçülme beklenir.
Vektör tasarım yazılımından dışa aktarılan kurumsal logo SVG dosyası 38 KB boyutundaydı. Yorumları kaldır, metadata temizle ve editör namespace seçenekleri ile boşluk sıkıştırma açıldı; sonuç dosyası 11 KB'a düştü ve %71 boyut kazancı sağlandı. Web sitesi başlık alanında kullanılan bu logonun yüklenme süresi yaklaşık 3 kat hızlandı, görsel kalitede hiçbir bozulma olmadı.
viewBox değeri olmayan SVG'ler farklı ekranlarda taşar veya küçülür. Optimizasyon sonrası mutlaka viewBox alanının korunduğunu kontrol edin.
JavaScript animasyonu, CSS hedefleme veya filtreleme kullanan SVG'lerde ID kısaltma fonksiyonel bozukluğa yol açar. Bu seçenek yalnızca statik dosyalarda güvenlidir.
Çıktıyı tarayıcıda görsel olarak doğrulamadan canlıya almayın. Bazı editör artıkları görünmeyen geometriyi kontrol ediyor olabilir.
Tasarım iş akışı içinde tekrar düzenlenecek SVG'leri sıkıştırmayın; yorum ve girintiler kaybolduğunda kod okunaklılığı düşer. Yayınlanmadan önce tek seferlik optimizasyon önerilir.
Hayır. Yalnızca görüntülenmeyen veriler (yorum, metadata, editör namespace, gereksiz boşluk) kaldırılır. SVG'nin geometrisi, renkleri ve görünümü korunur.
Profesyonel vektör tasarım yazılımları çoğunlukla kendi metadata namespace'lerini ve düzenleme katmanlarını ekler. Bu artıklar dosya boyutunun yarısına kadar yer kaplayabilir; web yayını öncesi temizlenmesi önerilir.
Tarayıcı tabanlı işlem 10 MB altındaki dosyalar için sorunsuz çalışır. Daha büyük dosyalar için önce gereksiz katmanları silmeniz, sonra optimizasyon uygulamanız önerilir.
Evet. Çıktı bir kez kaydedildikten sonra orijinal dosyayı silebilirsiniz. Ancak iş akışınızda yeniden düzenleme ihtiyacı varsa kaynak dosyanın bir kopyasını saklayın.
Hayır. SVG yorumları yalnızca geliştiriciler içindir; arama motorları ve ekran okuyucular yorumları yok sayar. Erişilebilirlik için title ve desc etiketlerinin korunması yeterlidir.
ID'ler CSS, JavaScript veya SVG içi referanslarda (clipPath, mask, filter) hedef olarak kullanılır. Kısaltma sırasında bu referanslar güncellenir; ancak harici kodda eski ID kullanılıyorsa bağlantı kopabilir.
Bu araç tek seferde bir dosya işler. Çoklu dosya işlemi için iş akışınızda komut satırı tabanlı bir optimize aracı kullanmanız önerilir; web tabanlı araç hızlı tek dosya optimizasyonu için tasarlanmıştır.
Bu aracı kullanarak hesaplamanızı hemen yapın.
Kopyala butonu ile çıktıyı panoya alın ya da İndir ile yeni .svg dosyası olarak kaydedin. Tasarımınızı tarayıcıda açıp görsel olarak doğrulayın.