Inline (Sıralı) SVG nedir ?
HTML5, Inline (Sıralı) SVG desteği içermektedir. SVG, Scalable Vector Graphics (Skala edilebilir vektör grafikleri) anlamına gelir. Vektör temelli grafikleri ifade etmek için kullanılmaktadır. SVG grafikleri XML formatında tanımlar. SVG grafikleri yakınlaştırılıp uzaklaştırılsa da yeniden boyutlandırılsa da kalite düşmesi olmaz. İçindeki her element, her özellik hareketlendirilebilir.
- SVG Skala edilebilir Vektör Grafikleri (Scalable Vector Graphics) anlamına gelir.
- SVG vektör temelli grafikleri ifade etmek için kullanılır.
- SVG grafikleri XML formatında tanımlar
- SVG grafikleri zoom’lansalar da yeniden boyutlandırılsalar da kaliteleri düşmez.
- SVG dosyaları içindeki her element, her özellik (attribute) hareketlendirilebilir (anime)
SVG’nin Avantajları nedir ?
Resim dosyalarında SVG kullanmanın avantajları (JPEG ve GIF gibi):
- SVG resimleri herhangi bir metin editörü ile yaratılabilir ya da düzenlenebilir
- SVG resimleri aranabilir, indekslenebilir, script kodu ile yazılabilir ya da sıkıştırıabilir
- SVG resimleri skale edilebilir.
- SVG resimleri tüm çözünürlüklerde yüksek kalite ile yazdırılabilir (yazıcı)
- SVG resimleri zoom edilebilir (ve kalite düşmez)
Ölçeklenebilir Vektör Grafikleri, (ÖVG, İng. Scalable Vector Graphics ya da kısaca SVG) svg çalışma grubu tarafından geliştirilen, telif hakkı bulunmadan sınırsızca yaygın olarak kullanılan vektör tabanlı bir grafik formatıdır.
Tarayıcı Desteği neler ?
Internet Explorer 9+, Firefox, Opera, Chrome, ve Safari inline SVG’yi destekler.
SVG’yi Doğrudan HTML Sayfalarına Gömmek
HTML5 ile SVG elementlerini doğrudan sayfanıza gömebilirsiniz:
<!DOCTYPE html> <html> <body> <svg width="300" height="200"> <polygon points="100,10 40,180 190,60 10,60 160,180" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" /> </svg> </body> </html>