SVG dosyaları.

SVG dosya formatı, web sitelerinde iki boyutlu grafikler, çizelgeler ve illüstrasyonlar göstermeye yönelik popüler bir araçtır. Ayrıca bir vektör dosyası olduğundan, çözünürlüğünü kaybetmeden büyütülebilir veya küçültülebilir. SVG görüntülerinin temel özellikleri, avantajlarıyla dezavantajları ve SVG formatının nasıl geliştiği hakkında daha fazla bilgi edinin.

SVG seçim çerçevesi görüntüsü

Öğrenecekleriniz.

 

  • SVG dosyası nedir?
  • SVG dosyasının tarihi
  • SVG dosyaları ne için kullanılır?
  • SVG dosyalarının avantajları ve dezavantajları
  • SVG dosyasını açma
  • SVG dosyası oluşturma ve düzenleme
  • SVG dosyaları: sık sorulan sorular

 

 

SVG dosyası nedir?

Scalable Vector Graphics (SVG), web dostu bir vektör dosyası formatıdır. JPEG'ler gibi piksel tabanlı raster dosyalarının aksine vektör dosyaları, bir ızgaradaki noktaları ve çizgileri temel alan matematiksel formüllerle görüntüleri saklar. Bu sayede SVG gibi vektör dosyaları, kaliteden ödün vermeden önemli ölçüde yeniden boyutlandırılabildiğinden logolar ve karmaşık çevrimiçi grafikler için idealdir. 

 

SVG'leri web tasarımcıları arasında son derece popüler hale getiren sadece yeniden boyutlandırma yeteneği değildir. SVG'ler XML kodu ile yazılır. Bu da metin bilgilerini şekiller yerine düz metin olarak depoladıkları anlamına gelir. Böylece Google gibi arama motorları, anahtar kelimeler için SVG grafiklerini okuyabilir. Bu da bir web sitesinin arama sıralamalarında yukarı taşınmasına yardımcı olabilir.

 

SVG dosyasını .svg uzantısından kolayca tanıyabilirsiniz.

 

 

SVG dosyasının tarihi.

SVG dosyasının tarihi, World Wide Web Consortium'un (W3C) geliştiricilerin yeni bir vektör grafik formatı türü için önerilerini istediği 1990'ların sonuna dayanıyor. Altı rakip şirket öneri gönderdi ve bu önerilerin sunduğu veriler W3C'nin SVG formatını oluşturmasına yardımcı oldu.  

 

SVG'lerin popülerlik kazanması biraz zaman aldı. İnsanların modern web tarayıcılarında SVG kullanımının avantajlarını görmeye başladığı 2017 yılına kadar bu dosya formatı için nispeten az destek vardı. Vektör dosyalarına yönelik çoğu tarayıcı ve çizim uygulaması bunları kolayca işleyebildiğinden SVG dosyaları, artık 2D web sitesi görüntüleri için yaygın olarak kullanılmaktadır.

 

 

SVG dosyaları ne için kullanılır?

Scalable Vector Graphics son yıllarda çok yol kat etti. Peki SVG'ler pratikte ne için kullanılıyor?

 

Web sitesi simgeleri ve logoları.

Tasarımcılar SVG'leri genellikle düğmeler gibi web sitesi simgelerini ve şirket logolarını göstermek için kullanır. Bu dosya türünün kaliteden ödün vermeden yukarı veya aşağı ölçekleme özelliği, birden çok yerde ve farklı boyutlarda görünmesi gereken grafikler için ideal olduğu anlamına gelir.

 

İnfografikler ve illüstrasyonlar.

SVG dosyalarında XML kullanıldığından Google gibi arama motorları, metin ağırlıklı çizelgeleri ve grafikleri okuyabilir. Bu da arama motoru optimizasyonuna yardımcı olabilir. Google, SVG'lerdeki anahtar sözcükleri algılayabildiğinden, bir web sayfasını arama sonuçlarında daha yüksek bir sıraya yerleştirebilir. Ayrıca SVG'ler animasyonu desteklediğinden web sayfalarını daha ilginç hale getirmede kullanılabilir.

 

Daha fazla vektör dosyası keşfedin

 

 

SVG dosyalarının avantajları ve dezavantajları.

Görüntülerinizi bu dosya formatında kaydetmeden önce SVG'nin avantajlarını ve dezavantajlarını araştırmanız önemlidir.

 

SVG dosyalarının avantajları.

  • Piksellerden oluşan raster dosyalarının aksine SVG gibi vektör grafikleri, ne kadar büyük veya küçük hale getirirseniz getirin, her zaman çözünürlüğünü korur. SVG görüntülerinin belirli tarayıcılarda veya farklı yerlerde görüntülenmesi için yeniden boyutlandırdığınızda kalite konusunda endişelenmenize gerek yoktur.
     
  • Temel SVG dosyaları, matematiksel algoritmalar kullanmak yerine birçok renkli pikselden oluşturulan raster görüntülerden genellikle daha küçüktür. 
     
  • SVG dosyalarındaki metinler, tasarım olarak değil, metin olarak kullanıldığından ekran okuyucular SVG görüntülerindeki tüm sözcükleri tarayabilir. Bu, web sayfalarını okuma konusunda yardıma ihtiyacı olan kişiler için çok kullanışlıdır. Arama motorları SVG görüntü metnini de okuyabilir ve dizine alabilir.

 

SVG dosyalarının dezavantajları.

  • SVG dosyaları; logolar, illüstrasyonlar ve çizelgeler gibi web grafikleri için idealdir. Ancak SVG'lerin piksele sahip olmaması, yüksek kaliteli dijital fotoğrafları görüntülemeyi zorlaştırır. Ayrıntılı fotoğraflar için genellikle JPEG dosyaları daha iyidir. 
     
  • SVG görüntülerini yalnızca modern tarayıcılar destekler. SVG dosyalarını Internet Explorer 8 ve diğer eski tarayıcılarla kullanmak zor olabilir.
     
  • SVG görüntülerinde bulunan kodu anlamak, dosya formatını yeni kullanmaya başladığınızda zor olabilir. 

 

 

SVG dosyasını açma.

Bugünlerde Chrome ve Edge'den Safari ve Firefox'a kadar başlıca tarayıcıların tümü, Mac veya Windows'da olmanız fark etmeksizin SVG dosyalarını açmanızı sağlar. Tarayıcınızı başlatın ve görüntülemek istediğiniz dosyayı seçmek için Dosya > Aç'ı tıklatın. Dosyanız daha sonra tarayıcınızda görüntülenecektir.

 

SVG görüntülerini bilgisayarınızda yerleşik bir programla açmak da aynı derecede kolaydır. Dosya adını çift tıklattığınızda, dosyayı açacak programların bir listesi gösterilir veya otomatik olarak uyumlu bir programda açılır.

 

 

SVG dosyası oluşturma ve düzenleme.

Adobe Photoshop'u kullanırken aşağıdaki adımları izleyin:

 

  1. Photoshop'ta bir görüntü oluşturduktan sonra Dosya > Dışa Aktar > Farklı Dışa Aktar'ı tıklatın.
     
  2. Görüntülenen kutunun içindeki Format açılır menüsünü tıklatın ve SVG'yi seçin.
     
  3. Tümünü Dışa Aktar'ı seçin ve dosyayı kaydedin. 

 

Yararlı bir not: Photoshop bir raster grafik düzenleyici olduğundan, birçok kişi SVG dosyalarını vektör grafik düzenleyici olan Adobe Illustrator'da oluşturmayı ve düzenlemeyi tercih eder.

 

 

SVG dosyaları: sık sorulan sorular.

SVG dosyaları animasyonu destekliyor mu?

SVG dosya formatı yalnızca statik görüntüler için değildir. Birçok çevrimiçi araçtan yararlanarak web grafiklerinize hareketli öğeler ekleyebilirsiniz. SVG animasyonları, bir infografikteki farklı slaytlar arasında geçiş yapılmasını sağlayan kaydırıcı gibi nispeten temel öğeleri içerebilir. İllüstrasyonların, saat kadranındaki akrep ve yelkovan gibi hareket etmesi sağlanabilir.

 

SVG dosyasını nasıl tespit edebilirim?

SVG dosyasını tespit etmenin en kolay yolu, uzantı kodunu kontrol etmektir. SVG dosyası, .svg dosyası olarak listelenir. Ayrıca SVG'ler gibi vektör görüntülerini bilgisayar ekranınızda %200 veya daha yüksek bir değere genişleterek de tespit edebilirsiniz. Bir vektör görüntüsü, pikselli veya bulanık hale gelmez ve temiz çizgileriyle düz renklerini korur.

 

SVG dosyaları yalnızca internette mi kullanılabilir?

SVG görüntüleri çoğunlukla web'de kullanılsa da çevrimiçi dünyanın ötesinde bir kullanımı da vardır. Örneğin, SVG dosyaları orijinal halinden farklı olarak boyutlandırıldığında bozulmadığından, tişört gibi kıyafetlerde baskı şablonu olarak kullanılabilir. Çok sayıda pikselden oluşturulan bir JPEG dosyası ise temiz bir şekilde aktarım yapamaz.

 

SVG dosyaları ne kadar büyüktür?

SVG dosyasının boyutu, içerdiği görüntü verilerine bağlıdır ancak genellikle diğer dosya türlerinin çoğundan daha düşüktür. Birçok yol ve bağlantı noktası içeren karmaşık grafikler, daha basit ve daha temiz tasarımlardan daha fazla depolama alanı kaplar. Dosyanızdaki karmaşık talimatların sayısını en aza indirmeye çalışın.

 

SVG ile PNG dosyaları arasındaki fark nedir?

Özetle, SVG'ler vektör dosyalarıyken PNG'ler ise raster dosyalarıdır. Bir PNG dosyasını çok fazla genişletirseniz veya çok sıkıştırırsanız bulanık ve piksellenmiş hale gelir. SVG'ler hiç piksel içermediği için çözünürlüğünü asla kaybetmez. Ayrıca PNG'ler animasyonu desteklemez.

SVG'lere benzer dosya türleri hakkında daha fazla bilgi edinin.

PNG dosya görüntüsü

PNG dosyaları

Web grafikleri ve logolar için popüler olan başka bir format hakkında daha fazla bilgi edinin.

JPEG dosya görüntüsü

JPEG dosyaları

JPEG dosyalarının neden karmaşık dijital fotoğraflara yönelik tasarlandığını öğrenin.

HEIC dosya görüntüsü

HEIC dosyaları

Apple'daki zihinlerden çıkmış bu yeni raster dosyası hakkında bilgi edinin.

AI dosya görüntüsü

AI dosyaları

Adobe Illustrator için geliştirilen ve yaygın olarak kullanılan bu vektör formatını keşfedin.

SVG'leri diğer dosya türleriyle karşılaştırın.

SVG ile PNG dosyalarının karşılaştırma görüntüsü

SVG ile PNG karşılaştırması

Web tasarım sektöründe hangi dosya formatı daha öndedir?

SVG ile EPS dosyalarının karşılaştırma görüntüsü

SVG ile EPS karşılaştırması

Yazdırma becerilerine yakından göz atın.

Sizin için en uygun olan planı bulun.

Illustrator

Adobe Illustrator Tek Uygulama

Muhteşem vektör resimleri ve illüstrasyonlar oluşturun.
7 gün ücretsiz, ardından ₺134,40/ay.

Indesign

Adobe InDesign Tek Uygulama

Basılı ve dijital yayıncılık için şık sayfa mizanpajları tasarlayın.
7 gün ücretsiz, ardından ₺134,40/ay.

Lightroom

Tüm Uygulamalar

Yaratıcı uygulamalardan oluşan koleksiyonun tamamına ve daha fazlasına sahip olun.
7 gün ücretsiz, ardından ₺190,80/ay.