Grafik tasarımı ile ilgilenen kişilerin sıklıkla karşılaştığı durumlardan birisidir. SVG nedir diyenlerin sayısı da aslında bir o kadar fazladır. Bilmeyenler için SVG nedir; Scalable Vector Graphics olarak tanımlansa da kısaca SVG denilmektedir. Vektör imaj formatı olarak bilinmesinde fayda vardır. Kullanım olarak oldukça pratik ve kolay olmasının yanı sıra web tasarımın önemli araçlarından birisidir.
Kullanım alanları ise genellikle bir görselin farklı boyutlarda ve renk çeşitliliğinin fazla kullanılması amaçlanmıştır. Scalable Vector Graphics sizlere İngilizce bir terim olarak lanse edilse de Türkçe karşılığında size verilecek olan sonuç ise; Ölçeklendirilebilir Vektör Grafikleri olarak bilinmektedir. Adobe Photoshop ve İlliustrator programları ile kullanılıyor.
Peki, neden SVG kullanmalıyız sorusuna ise verilecek cevaplar aslında bir hayli fazladır. Bunlar başlıca; küçük dosya boyutlarına sahip olması, vektörel olduğu için çözünürlük kalitesi asla bozulmadan şekillendirilebilmesi, Retina Display ekranlarında farklı bir başarı göstermesi ve tasarım sürecinde kod desteği imkânı sunmasıdır.
SVG kullanırken nerede karşıma çıkacak sorusuna ise ilk paragrafta belirttiğimiz SVG nedir açıklamasının hemen peşinden verilecek olan cevap da İlliustrator üzerinden ya da Photoshop programı üzerinden çizdiğiniz bir dosyanın kaydedilmesi sırasında SVG formatında kayıt et seçeneğinin bulunmasıyla karşınıza çıkacaktır.
SVG Nerede Kullanılır?
Web tasarımlarının vazgeçilmezlerinden birisi olan grafik tasarımlarında SVG ile ilgili olarak birçok adımda karşılaşmanız mümkündür. Neden tercih etmeniz gerektiği konusunu aslında yukarıdaki açıklamada açıkça belli ettik. Bir firmanın web tasarımını yaparken mutlaka kendine has bir tabirle özgü görseller tercih edilmelidir. Ancak internet tarayıcılarına girerek bu gibi resim görsellerini hazır olarak kullanmak pek de hoş karşılanmayan bir durumdur.
İMG etiketi ile birlikte SVG kullanımı çok yaygındır. Genelde CSS dosyasından dosya boyutunu ayarlamak da mümkündür. Ayrıca birçok bilgisayar kullanıcısı güncel olmayan tarayıcıları kullanmaktadır. Bunlardan birisi de İnternet Explorer olmaktadır. Güncelliği olmayan Browser’lardan SVG alternatifleri kodla mümkün olmaktadır.
SVG Avantajları Nelerdir?
SVG w3c tarafından geliştirilmiş dev Flash’a rakip konumunda bulunan lakin piyasada daha az tercih edilmesine rakibi sayesinde neden olmuştur. SVG’nin avantajları;
- Yüzeyleri, çizgileri matematiksel olarak algıladığından onlara sayısal bir değer biçebilir.
- SVG kullanıyıla etkileşim halindedir, değişime açıktır.
- XHTML içine yazılabilme özelliği kapsar.
- Çizim yöntemi olduğundan .jpg ve .png dosyalarını nesne olarak tanımlar.
- Tarayıcılar üzerinde tıklanması mümkün olan elementler yapabilirsiniz.
- Özellikle icon yapımında kullanabilirsiniz.
SVG dosyalarının e önemli özelliklerinden birisi hiç şüphesiz çok çeşitli renk seçeneklerinin olmasıdır. Genellikle ikon yapımında ve kullanımında SVG tercih edilir. Bu gibi kullanım tercihlerinde uygulanacak adım ise genellikle HTML kodları arasında SVG kodlarına yer verilmelidir.
XML tabanlı bir vektör özellikli grafik formatıdır. Ölçülebilir vektörel çizim olan bu format ile, JavaScript, DOM, CSS gibi dillerde çalışma özelliğine sahiptir. Ayrıca, HTML ve XHTML için de etkileşebilir uygun tabanlıdır. SVG; metin ve ikileşimli resimler kullanarak oluştuğu için gruplandırma özelliği bulunmaktadır.