Raster ve vektör, bir görseli saklamanın iki farklı yoludur ve farkı bilmek, aralarında ne zaman dönüştürme yapacağınızı tam olarak söyler. Bir raster görsel — PNG, JPG, WebP — renkli piksellerin sabit bir ızgarasıdır. Bir vektör görsel — SVG — bir dizi talimattır: bu yolu çiz, bu renkle doldur, bu daireyi buraya koy. Bir vektör şekilleri piksel yerine matematikle tanımladığından, herhangi bir boyutta keskin kalır, oysa bir raster onu doğal çözünürlüğünün ötesine ittiğiniz an bulanıklaşır.
"Rasterden vektöre" izleme demektir: bir motor pikselleri okur ve içlerinde saklanan şekilleri çözer, sonra o şekilleri vektör yolları olarak yazar. Doğru durumda yapıldığında gerçekten yararlıdır. Yanlış durumda yapıldığında bir karmaşa çıkarır. Bu rehber ikisini de kapsar.
İzleme neyde iyidir
İzleme düz, temiz kenarlı girdi ister: logolar, ikonlar, basit illüstrasyonlar, çizgi resmi, elle yazı. Bunların sınırlı bir paleti ve net sınırları vardır, dolayısıyla izleyici her renk bölgesini bulabilir ve etrafına düzgün bir yol çizebilir. Sonuç, bir avuç şekilden oluşan kompakt bir SVG'dir — her ölçekte keskin, dosya boyutunda küçük ve sonradan düzenlenebilir. Amacınız favicon'dan bilborda kadar çalışan bir logoysa, izleme sizi oraya götürür.
Fotoğraflar neden uygun değildir
Bir fotoğraf, bir izleyicinin istediğinin tam tersidir. Binlerce hafifçe değişen rengi ve sert kenarı yoktur — sürekli ton. Bunu vektörleştirmek için motorun her geçişi, üst üste binmiş düz renk yığınlarıyla yaklaşık olarak taklit etmesi gerekir. Aynı anda üç şey ters gider: SVG kocaman olur, çoğu zaman orijinal JPG'den birkaç kat büyük; fotoğrafik yerine bulaşmış ve posterleşmiş görünür; ve binlerce anlamsız şekilden yapıldığı için düzenlemesi acı vericidir. Fotoğraflar için bir raster formatı basitçe doğru cevaptır — bunun yerine JPG'yi sıkıştırın ya da WebP'ye dönüştürün. Vektör, fotoğraflar için değil grafikler içindir.
Hazır ayarlar ve renk sayısı
İzleyicinin kullanmasına izin verilen renk sayısı, sonuç üzerindeki en büyük koldur. Hazır ayarlar bunu sizin için belirler: Düz / logo basit işaretler için renkleri düşük tutar, Detaylı daha zengin illüstrasyonlar için daha fazlasına izin verir, Posterleştirilmiş görseli cesur düz bantlara indirger ve Siyah beyaz çizgi resmi ve siluetler için her şeyi iki tona düşürür. Daha az renk daha temiz, daha küçük bir dosya demektir; daha fazla renk, fazladan yollar ve ağırlık pahasına inceliği yakalar. Aynı görselde iki hazır ayarı deneyip önce/sonra önizlemesini karşılaştırmak, doğru dengeyi bulmanın en hızlı yoludur.
Hepsi yerel, hiçbir şey yüklenmez
Tüm dönüştürme imagetracer motoruyla tarayıcınızda çalışır. Görsel kendi makinenizdeki bir canvas'tan okunur, orada izlenir ve bir SVG olarak geri verilir — hiçbir şey yüklenmez, hesap yok ve sayfa yüklendikten sonra ağ kapalıyken çalışır. Başkasının sunucusuna göndermek istemeyeceğiniz bir logo ya da dahili bir grafik için buna değer.
Bir açıklama, çünkü "dönüştür" kelimesi bunu davet eder: bu gerçek bir izlemedir, bir AI yeniden çizimi değil. Verdiğiniz pikselleri takip eder ve çalışmanızın daha temiz bir versiyonunu uydurmaz. Keskin, düz, az renkli bir kaynak keskin bir sonuç verir; bulanık ya da gürültülü bir tanesi bulanık, gürültülü yollar verir.
İzlemeden sonra
Çıktı, adlandırılmış yollar ve dolgulardan oluşan standart bir SVG olduğundan, üzerinde herhangi bir vektör düzenleyicide çalışmaya devam edebilirsiniz — Illustrator, Inkscape, Figma. Tek bir dolguyu düzenleyerek bütün bir bölgeyi yeniden renklendirin, kesin marka renkleri belirleyin, başıboş şekilleri kaldırın ya da bir yolu ayarlayın. Vektöre geçmenin amacı budur: görsel sabit bir resim olmaktan çıkar ve sahip olduğunuz, herhangi bir boyutta bulanıklık olmadan yeniden şekillendirebileceğiniz bir nesne olur.