Yanıtlar:
PNG'yi sadece SVG'den daha kabul edilmiş bir format gibi göründüğü için söyleyebilirim.
SVG'yi bir seçenek olarak adlandırmanız gerçeği, fotoğraf grafiklerini kullanım amacı olarak dışlayabileceğimiz anlamına gelir - çünkü SVG'ler yalnızca logolar, simgeler ve küçük resim benzeri resimler gibi çizgi grafikler için iyidir.
Fotoğraf grafikleri için bu seçimi düşünüyorsanız, başka seçenek yoktur; PNG muhtemelen her zaman daha iyi olacak. SVG'nin uygulanabilir bir seçenek olduğu grafikler için SVG, PNG / JPEG geri dönüşüyle en iyi seçenektir. PNG'nin birçok gücü var, ancak ölçeklenebilirlik ve dosya boyutunda, genellikle SVG ile eşleşmeyecek.
Bunları birbirlerine karşı tartıştıran PNG, kesinlikle şu anda bu noktada SVG'den daha fazla tarayıcı tarafından desteklenecek, ancak yeni çıkan cihazların kararları sonsuza kadar artacak, yani PNG'lerin ya çok çeşitli farklı çözünürlüklere dayanarak sunulması gerekecek (Medya Sorguları, JavaScript veya Kullanıcı Aracısı Sniffing yoluyla) veya tarayıcılar tarafından ölçeklendi;
Geleceğin neler tuttuğunu bildiğimize baktığımızda ; sonsuza dek yüksek çözünürlük, daha geniş destek ve SVG'lerin internet üzerinden daha geniş kullanımı; gelecek için inşa etmek mantıklı.
Genel olarak, web siteleri uzun yıllar sürecek şekilde kurulmalıdır; 5 yıl içinde geriye dönük uyumlu web siteniz hala eski tarayıcıları kullanan internet kullanıcılarının% 2'si için harika görünebilir, ancak çılgın çözünürlükteki güncel tarayıcılar için oldukça zayıf - bu yüzden bu yol için çok zor bir seçim yığını uzlaşmadır.
Yalnızca PNG'ler
Kalite açısından, ekran boyutlarına ve çözünürlüklerine bağlı olarak en az beş farklı sürüm sunmanız gerekir - ve bu çok muhafazakar bir tahmindir. Son derece kapsamlı olmak istiyorsanız, aynı görüntünün 10 - 15 sürümleriyle sonuçlanabilir. . Bu da uygulanması biraz zaman alır.
Tek bir grafik sunmayı seçtiyseniz ve tarayıcının ölçeklendirmesini sağladıysanız, sonuçlar muhtemelen mükemmelden daha az olacaktır ve ölçekleme miktarına bağlı olarak çirkin de olabilir.
Çok sayıda medya sorgusu CSS'yi gereksiz yere şişirebilir ve sayfa yükleme hızlarını olumsuz etkileyebilir.
Eski tarayıcılarda ve cihazlarda harika görünecek, ancak yenileri için harika görünmeyecek.
Tek PNG / JPEG / GIF geri dönüşlü SVG'ler
SVG'leri her yerde kullanabilir ve daha sonra SVG'yi desteklemeyen tarayıcılar için başka bir formata dönmesini sağlayabilirsiniz. Asıl avantaj, tüm farklı çözünürlükler için sadece bir dosyaya ihtiyacınız var.
Eski tarayıcılardaki kullanıcıların kusurlu şekilde ölçeklendirilmiş grafiklerle yaşayabileceklerini tehlikeye atarsanız ve kabul ederseniz, her dosyanın yalnızca bir sürümüne PNG, JPEG veya GIF biçiminde ihtiyacınız olacaktır.
Bu, PNG'nin yalnızca medya sorguları - muhtemelen daha da az olduğu gibi, aynı fiyat civarında olacağı anlamına gelmesi için de benzer bir zaman alacaktır.
Eski teknolojilerden fedakarlık ederek tüm yeni cihazlarda harika görünecek.
Çözünürlük ve ekran boyutuna bağlı olarak çoklu PNG / JPEG / GIF geri dönüş özelliklerine sahip SVG
Önce SVG'yi, sonra da SVG'yi desteklemeyen tarayıcılar için çözünürlüğe bağlı PNG'leri sunabilirsiniz. Bu, en kapsamlı, en geriye ve ileriye uyumlu, en tutarlı ve en pahalı zaman alan seçenek olacaktır.
Muhtemelen 1 ve 2'nin bir araya gelmesi kadar zaman alacaktır, ayrıca akrabaları çözmek için biraz fazladan.
Hemen hemen her cihazda muhteşem görünecek .
<picture>
Çeşitli görüntü boyutlarında yardımcı olan öğeyle ilgili bir şeyden bahsedebilirsiniz
Net bir avantaj olan bir vektör-grafiğiniz varsa, SVG ölçeklenebilir. Piksel grafikler için PNG daha iyidir. Bir dezavantajı, Internet Explorer’ın SVG’yi yalnızca gelecek sürüm 9 ile (eklenti olmadan) desteklemesidir. Mobil tarayıcılar ayrıca SVG için sınırlı bir desteğe sahip olabilir.
EDIT : ClemDesm'in işaret ettiği gibi, eski IE sürümleri IE8 desteklendiğinden beri tamamen şeffaf PNG'yi desteklememektedir. Şeffaf olmayan PNG'ler iyi çalışır. Computerish'in cevabı, vektör görüntülerini şimdilik kullanmak için mükemmel bir çözüme sahip: Onları SVG olarak saklayın, ancak web için PNG olarak dışa aktarın. Bu çözüme tamamen katılıyorum.
Bir web sitesi için kesinlikle PNG kullanın. SVG, yeterince geniş bir şekilde desteklenmemektedir ve PNG'ye göre yassı bir ihracat için (eğer varsa) önemli yararları yoktur. Bununla birlikte, tüm çalışma kopyalarınızı SVG'de saklayın.
PNG'ye güvenli tarafta kalırım. SVG hala birçok büyük internet şirketi ve tarayıcı tarafından tam olarak kabul görmemektedir. SVG'ler ölçeklenebilir ve vektörler olmasına rağmen genellikle gereksizdir, daha fazla yer kaplar ve web sitesini karmaşık hale getirir.
Umarım sorunuza cevap vermişsiniz :)
SVG dünya çapında kabul görmese ve bazı insanlar PNG'leri ölçeklendirmede sinir bozucu bir zamana sahip olsalar da, her zaman Adobe Illustrator'da bir simge oluşturmanın "makul" bir tutarı artırmada ya da azaltmada en iyi sonucu bulduğunu buldum.