Web Siteleriniz İçin Resim Boyutunu Nasıl Küçültebilirsiniz (Kaliteyi Kaybetmeden)

Güncelleme: 2022-04-25 / Makale: Jason Chow

Ziyaretçilerinizin en iyi deneyimi yaşamasını sağlamak için web sitesi resim boyutunu küçültmek çok önemlidir. Bu kadar "ağır" olmak, resimlerin ayrıca Google'ın nefret ettiği daha uzun sayfa yükleme sürelerine neden olduğu anlamına gelir. Optimize edilmemiş görseller bırakmak, Arama Motoru Sonuç Sayfası (SERP) sıralamasında sonuçlara yol açabilir.

Web sitesi sahipleri genellikle resimlerle aşk-nefret ilişkisine sahiptir. Kullanıcılarımıza sağladıkları zengin deneyim için onları seviyoruz. Yine de görüntüler genellikle orantısız miktarda kaynak yüküne neden olur. Bunu önlemek için çeşitli şekillerde resim boyutlarını küçültmek için çalışabiliriz;

Görüntü boyutunu küçültmenin, yalnızca piksel boyutlarını küçültmek değil, dosya boyutunu da küçültmek anlamına geldiğini unutmayın. 

1. Bir Görüntü Düzenleyici Kullanma

MS boya

Görüntü boyutunu küçültmenin en basit yolu, Microsoft Paint (veya GIMP Linux kullanıyorsanız). Yukarıdaki resimde, orijinal olarak 3724 x 2400 piksel boyutunda, nispeten büyük bir dosya indirdim. Web kullanımı için önemli olan 1.2MB aldı.

Bunu Microsoft Paint'te açarak, orantılı bir küçültme yüksekliği ile 1024 piksel genişliğine yeniden boyutlandırdım. Bu, yalnızca 1024 kb boyutunda 659 x 273 piksellik bir görüntüyle sonuçlandı. Gördüğünüz gibi, görüntü boyutu küçültme, orijinal dosya boyutunun beş katı kadar kaydedildi.

2. Görüntü Sıkıştırmayı Kullanma

Görüntü sıkıştırma

Görüntü sıkıştırma, görüntü boyutlarını daha da azaltmaya yardımcı olabilir. Her görüntü, renk kalitesi, piksel yoğunluğu ve daha fazlası gibi bileşenleri içerir. Kalite ne kadar iyi olursa, fotoğraf o kadar fazla veriye sahip olur ve dolayısıyla daha büyük bir boyut kaplar.

Özellikle bu mobil cihaz çağında, web kullanımı için her zaman en kaliteli görüntülere ihtiyacımız yok. Bu nedenle, aşağıdaki gibi çevrimiçi bir araçla görüntüleri sıkıştırabilirsiniz. Optimizilla. Bu araç, görüntü boyutunu küçültmek için görüntü kalitesini kontrol etmenizi sağlar.

70'lik bir görüntü kalitesi ayarlayarak, küçültülmüş görüntüyü 274 kb'den 80 kb'nin altına düşürdüm. Unutmayın, bu 1.2 MB'ın üzerindeki orijinal görüntü boyutuyla karşılaştırılır.

3. Görüntüleri Diğer Formatlara Dönüştürme

Görüntüler, kalitelerini ve boyutlarını etkileyen çeşitli türlerde gelir. Örneğin, JPG'deki aynı görüntü, BMP formatındaki aynı görüntüden çok daha küçük olabilir. Bugün, birçok web sitesi WebP gibi yeni nesil görüntü formatlarına doğru ilerliyor.

Yine, gibi bir çevrimiçi araç kullanarak Çevrimiçi Dönüştürme, Orijinal kurt görüntüsünü JPG'den WebP formatına hızlıca değiştirebilirim. Bu değişiklik, WebP dosyası artık yalnızca 28.7 kb olduğundan daha fazla boyutta tasarruf sağladı. 

4. Bir WordPress Eklentisi kullanın

Smush

Birden fazla görüntüyü işlemeniz ve bir WordPress web sitesi, daha da iyi bir seçenek var. Görüntü optimizasyon eklentileri, sizin müdahaleniz olmadan bile yukarıdakilerin hepsini yapabilir. Saygın görüntü optimizasyonu eklentilerinin örnekleri şunları içerir: EWWW Optimize Edici, Görüntü Sıkıştır, ve Imagify.

Bu eklentileri kullanmanın avantajı, bağımsız çalışabilmeleridir ve bir kez ayarladıktan sonra endişelenmenize gerek kalmayacaktır. Ancak, eklentileri kullanmak web sitenizdeki genel kaynak tüketimini artırır, bu nedenle eklentilerinizi akıllıca seçin.

Görüntü Boyutlarını Küçültmeye İlişkin Son Düşünce

Gösterilen çeşitli yöntemler birbirini dışlamaz. Bir, iki veya üçünü birden kullanmayı seçebilirsiniz ve sonuçlar genellikle yalnızca iyileşir. Ana amaç, çok fazla görüntü kalitesinden ödün vermeden dosya boyutlarını olabildiğince küçültmektir.

Web siteniz ne kadar hafif olursa, okuyucularınız ve sizin için o kadar avantajlı olduğunu unutmayın. Depolama ve bant genişliği için daha az ödeme yaparken daha sorunsuz bir yükleme deneyimi yaşarlar. Bu bir kazan-kazan durumu.

Daha fazla oku:

Jason Chow hakkında

Jason teknoloji ve girişimcilik hayranıdır. Web sitesi yapmayı çok seviyor. Twitter üzerinden onunla iletişime geçebilirsiniz.