shadcn.io— binlerce hazır shadcn/ui bloğu
İçeriğe geç

PNG'yi neden WebP'ye çeviriyorum (ve bir keresinde neden hiç çevirmedim)

Masaüstümde to-shrink adlı bir klasör var. Yıllarca ekran görüntülerinin ölmeye gittiği yer orasıydı — 2 MB'lık pano ve yarım kalmış maket PNG'leri, ekranımdan 2 MB'a hiç ihtiyacı olmayan insanlara e-postayla yolladıklarım. Bir öğleden sonra klasörü gerçekten açıp hesabı yaptım: aynı hafta yayına aldığım uygulamadan daha büyüktü. PNG'nin sessiz derdi işte bu. Harika bir biçim, ama şaşırtıcı miktarda yer harcıyor ve çoğumuz bunu hiç fark etmiyoruz, çünkü bant genişliği ucuz ve dosya «gayet açılıyor».

O yüzden birinin bana çok daha önce yapmasını dilediğim savunmayı yapayım. Bir PNG bir web sitesine gidiyorsa — düzenleneceği değil, bakılacağı bir yere — neredeyse kesinlikle bir WebP olmalı.

PNG'nin gerçekten iyi olduğu şey

PNG kayıpsızdır. Koyduğunuz her piksel, her seferinde tam olarak aynı çıkar. Bu gerçek bir erdemdir — bir ana dosya için. Tasarım aracınızın PNG dışa aktarmasının, ekran görüntülerinin PNG olmasının, keskin kenarlı ve saydam her şeyin ona uzanmasının nedeni budur. Kayıpsız olması, onu yüz kez açıp değiştirip yeniden kaydedebileceğiniz, hiçbir şeyin bozulmayacağı anlamına gelir.

İşin cılkı şu: «her pikseli kusursuz sakla» sözünün bedelini baytlarla ödersiniz. Bir fotoğrafı PNG kaydedin, degradeleri, sensör gürültüsünü ve yalnızca yaklaşık tutulsa gözünüzün hiç özlemeyeceği ince renk kaymalarını sadakatle kaydeder. Kimsenin göremediği ayrıntı için tam liste fiyatı ödersiniz.

WebP'nin yapabildiği, PNG'nin yapamadığı

WebP, Google'ın basit bir soruya verdiği yanıttı: ya daha iyi bir biçim yapsak? PNG'nin yapamadığı iki şeyi yapar. İstediğinizde kayıplı sıkıştırabilir — JPEG gibi, ama daha akıllıca, göze görünmeyeni atarak — ve bunu yaparken tam bir alfa kanalını korur. İşte bu ikinci kısım sessiz mucizedir. Yıllarca takas «saydamlık ya da küçük dosya, birini seç» idi. WebP ikisini birden verir.

Uygulamada, fotoğraf ya da ekran görüntüsü ağırlıklı bir PNG'yi makul bir kalitede çevirmek boyutu %60 ile %90 arasında küçültür. %10 değil. 1,8 MB'lık bir ekran görüntüsü kabaca 250 KB olur ve yan yana koyunca hangisinin hangisi olduğunu ayırt edemezsiniz. Bu sınavı kendime, itiraf edeceğimden çok kez yaptım, her seferinde WebP'yi suçüstü yakalayacağıma emindim. Hiç yakalayamadım.

Beni inandıran karşılaştırma

Geçen ay çevirdiğim bir partiden kabaca sayılar:

Kaynak PNGWebP olarak
Bir arayüz ekran görüntüsü — 1.8 MB~240 KB
Bir kapak fotoğrafı — 3.1 MB~380 KB
Düz iki renkli bir logo — 42 KB~30 KB

Logoya bakın. Neredeyse hiç kıpırdamadı — ve asıl önemli dipnot bu.

Ne zaman çevirmeye zahmet etmem

Basit grafikler — düz renkler, bir avuç renk, sert kenarlar — tam da PNG'nin sıkıştırmak için yapıldığı şeydir ve bu işi neredeyse her şey kadar iyi yapar. İki renkli bir simge, çizgilerden bir şema, bir QR kod: bunları PNG bırakın ya da vektörünüz varsa daha da iyisi SVG olarak gönderin. WebP bu dosyalara zarar vermez ama anlamlı bir yarar da sağlamaz, üstelik boşuna bir adım eklemiş olursunuz.

Çevirmediğim diğer durum ana dosyadır. Bir şeyin tek kopyasına asla dokunmam. WebP'nin kayıplı kipi tek yönlü bir kapıdır: attığınız ayrıntı geri gelmez. İşte asla bozmadığım tek kural — yayımladığınız kopyayı çevirin, aslı düzenlediğiniz yerde tutun. Makinemde bu tam anlamıyla iki dosyadır: PNG proje klasöründe kalır, WebP siteye gider. Ucuz bir sigorta ve buna bir kez bile pişman olmadım.

«Peki gerçekten her yerde çalışıyor mu?»

Eskiden asıl itiraz buydu, artık değil. İnsanların gerçekten kullandığı her tarayıcı WebP'yi 2020 civarından beri destekliyor — Chrome, Safari, Firefox, Edge, hepsi. E-posta istemcileri hâlâ eksik gedik ve bazı eski kurumsal yazılımlar tuhaf davranıyor, o yüzden bir bülten için yine JPEG'e uzanırım. Ama açık web için mi? WebP'yi yedeksiz sunmak yıllar önce cesur bir seçim olmaktan çıktı.

Gerçekte nasıl yapardım

Açıkçası bu sitedeki PNG'den WebP'ye dönüştürücüyü yapmamın nedeni, ekran görüntülerini küçültmek için gelişigüzel web araçlarına sürüklemekten, sonra dosyalarımın nerede bittiğinden hiç emin olamamaktan yorulmamdı. O yüzden önerdiğim sürüm sıkıcı ve gizli olan: dosyanın cihazdan hiç çıkmadığı, doğrudan tarayıcıda, kendi makinenizde çevirin. PNG'leri bırakın, boyut sütununun düşüşünü izleyin, WebP'yi indirin.

Ama mesele araç değil. Mesele alışkanlık. «Düzenlemek için PNG, yayımlamak için WebP» bir kez otomatikleşince, insanlara 2 MB'lık ekran görüntüleri yollamayı bırakırsınız, sayfalarınız bedavaya hızlanır ve masaüstünüzdeki o to-shrink klasörü nihayet boş kalır. Benimki kaldı — yaklaşık bir yıldır. Küçük bir zafer, ama ben razıyım.

İlgili yazılar


Tüm yazılar