Resimleri Web Performansı İçin Optimize Etme

WordPress’e görsellerinizi yüklemeden önce optimize etmenin web sitenizin hızı üzerinde büyük bir etkisi olabileceğini biliyor muydunuz?

Yeni bir blog oluştururken, birçok acemi, görselleri optimize etmeden sayfalarına yüklerler. Optimize edilmeden yüklenen bu büyük resim dosyaları web sitenizi yavaşlatır.

Resim optimizasyonu rutin blog yazma görevleriniz arasına alarak, bu sorunu ortadan kaldırabilirsiniz.

Bu makalede, kalitenizi kaybetmeden görüntülerinizi daha hızlı web performansı için nasıl optimize edeceğinizi göstereceğiz. Ayrıca WordPress için hayatınızı kolaylaştıracak otomatik görsel optimizasyonu eklentilerini de sizlerle paylaşacağız.

Görsel Optimizasyonu nedir?

Görsel optimizasyonu, genel görüntü kalitesini düşürmeden görselleri mümkün olan en küçük dosya boyutunda kaydetme ve yayımlama işlemidir.

Süreç karmaşık gibi görünse de oldukça kolaydır. Görselleri, görüntü kalitesinde gözle görülür bir kayıp olmadan otomatik olarak %80’e kadar sıkıştırmak için birçok görsel optimizasyonu eklentisinden ve araçlarından birini kullanabilirsiniz.

Görsel Optimizasyonu nasıl çalışır?

Basit bir ifadeyle, görsel optimizasyonu, kayda değer bir kalite kaybı olmadan genel dosya boyutunu azaltmaya yardımcı olan “Kayıplı” ve “Kayıpsız” gibi sıkıştırma teknolojisini kullanarak çalışır.

Görselleri Optimize Etmek Ne Anlama Geliyor?

WordPress barındırma desteğiniz veya bir hız testi aracıyla görselleri optimize etmek için bir öneri ya da uyarı aldıysanız, tek yapmanız gereken, resimlerinizi web için optimize ederek dosya boyutlarını azaltmanızdır.

Görsel Optimizasyonu Neden Önemlidir? Görsel Optimizasyonunun Faydaları Nelerdir?

Resimlerinizi optimize etmenin birçok faydası olsa da, bilmeniz gereken en önemlileri şunlardır:

  • Web sitenizin hızı artar
  • Arama motorlarından üst sıralara çıkarsınız
  • Satış imkanlarınız ve dolayısıyla satışlarınız artar
  • Daha az depolama alanı ve bant genişliği sağlar (depolama ve CDN maliyetini düşürebilir)
  • Web sitesi daha hızlı web sitesi yedeklenir (yedek depolama maliyetini de azaltır)

Videonun dışında, görseller bir web sayfasındaki en ağır öğelerdir. HTTP arşivine göre, görseller toplam web sayfasının ağırlığının ortalama %21’ini oluşturur.

Hızlı web sitelerinin arama motorlarında (SEO) daha üst sıralarda yer aldığını ve daha iyi dönüşümlere sahip olduğunu bildiğimizden, görsel optimizasyonu her profesyonel işletme web sitesinin başarılı olabilmesi için yapması gereken önemli bir prosestir.

Yapılan bir pazar araştırmasına göre, web sitesi yükleme süresinde bir saniyelik bir gecikme size satışların %7’sine, sayfa görüntülemenin %11’ine ve müşteri memnuniyetinde %16’lık bir düşüşe mal olabilir.
Resimleri Web Performansı İçin Optimize Etme

Web Performansı için Görseller Nasıl Optimize ve Kaydedilmelidir?

Web performansı için başarılı görsel optimizasyonunun anahtarı, en düşük dosya boyutu ile kabul edilebilir görüntü kalitesi arasındaki mükemmel dengeyi bulmaktır.

Görsel optimizasyonunda büyük rol oynayan 3 şey:

Görüntü dosyası formatı (JPEG, PNG, GIF)
Sıkıştırma (Daha yüksek sıkıştırma = daha küçük dosya boyutu)
Görüntü Boyutları (yükseklik ve genişlik)
Üçünün doğru kombinasyonunu seçerek görüntü boyutunuzu %80’e kadar azaltabilirsiniz.

Bunların her birini daha ayrıntılı inceleyelim.

1. Görüntü Dosyası Biçimi

JPEG, PNG ve GIF, çoğu web sitesi sahibi için gerçekten önemli olan sadece üç resim dosyası formatıdır. Doğru dosya türünü seçmek görsel optimizasyonunda önemli bir rol oynar.

İşleri basitleştirmek için fotoğraflar veya çok sayıda renk içeren görüntüler için JPEG’ler, basit görüntüler için PNG’ler veya saydam görüntülere ihtiyacınız olduğunda PNG ve yalnızca animasyonlu görüntüler için GIF kullanmak istersiniz.

Dosya formatları arasındaki farkı bilmeyenler için, PNG görüntü formatı sıkıştırılmamış, yani daha yüksek kaliteli bir görüntüdür. Dezavantajı, dosya boyutlarının çok daha büyük olmasıdır.

Öte yandan JPEG, çok daha küçük bir dosya boyutu sağlamak için görüntü kalitesini biraz azaltan sıkıştırılmış bir dosya biçimidir.

GIF ise animasyonlu görüntüler için en iyi seçim olmasını sağlayan kayıpsız sıkıştırma ile birlikte yalnızca 256 renk kullanır.

2. Sıkıştırma

Bir sonraki şey, görüntü optimizasyonunda büyük rol oynayan görüntü sıkıştırmadır.

Farklı görüntü sıkıştırma türleri ve seviyeleri mevcuttur. Her birinin ayarları, kullandığınız görüntü sıkıştırma aracına bağlı olarak değişir.

Adobe Photoshop, On1 Fotoğraf, GIMP, Affinity Fotoğraf ve diğerleri gibi görüntü düzenleme araçlarının çoğu entegre görüntü sıkıştırma özellikleriyle birlikte gelir.

Ayrıca görüntüleri normal şekilde kaydedebilir ve daha kolay görüntü sıkıştırma için TinyPNG veya JPEG Mini gibi bir web aracı da kullanabilirsiniz.

Biraz manuel olmasına rağmen, bu iki yöntem görüntüleri WordPress’e yüklemeden önce sıkıştırmanıza izin verir.

Ayrıca, görüntüleri ilk yüklediğinizde otomatik olarak sıkıştırabilen Optimole, EWWW Image Optimizer ve diğerleri gibi birkaç popüler WordPress eklentisi de vardır. Kolay ve kullanışlı olduğu için, yeni başlayanlar ve hatta büyük şirketler bu görüntü optimizasyonu eklentilerini kullanmayı tercih ediyorlar.

Bu WordPress eklentilerini başka bir yazımızda detaylı olarak paylaşacağız.

3. Görüntü Boyutları

Normalde, bir fotoğrafı telefonunuzdan veya dijital kameradan içe aktardığınızda, çok yüksek bir çözünürlüğe ve büyük dosya boyutlarına (yükseklik ve genişlik) sahiptir. Bu yüksek kaliteli fotoğraflar baskı için uygundur, fakat web siteleri için uygun değildir.

Dosya boyutlarını daha makul bir ölçüye azaltmak görüntü dosyası boyutunu önemli miktarda azaltabilir. Bilgisayarınızdaki bir görüntü düzenleme yazılımını kullanarak görüntüleri yeniden boyutlandırabilirsiniz.

Örneğin, 1,8 MB orijinal dosya boyutu, 300 DPI çözünürlük ve 4900 × 3200 piksel görüntü boyutlarına sahip bir fotoğrafı optimize ettik.

Daha yüksek sıkıştırma için jpeg formatını seçtik ve boyutları 1200 × 795 piksele değiştirdik ve görüntü dosyası boyutunu 103 KB’ye düşürdük. Orijinal dosya boyutundan %94 daha az bir boyut bu.

Artık görsel optimizasyonundaki üç önemli faktörü bildiğinize göre, web sitesi sahipleri için çeşitli görsel optimizasyon araçlarına göz atalım.

En İyi Görsel Optimizasyon Araçları ve Programları

Daha önce de belirttiğimiz gibi, çoğu görsel düzenleme yazılımı görsel optimizasyonu ve sıkıştırma ayarlarıyla birlikte gelir.

Görsel düzenleme yazılımının dışında, görselleri web için optimize etmek için kullanabileceğiniz birkaç kullanışlı ücretsiz görsel optimizasyon aracı da vardır (sadece birkaç tıklamayla basitçe yapabileceğiniz).

Özellikle mükemmeliyetçi iseniz WordPress’e yüklemeden önce görselleri optimize etmek için bu araçları kullanmanızı öneririz.

Bu yöntem, WordPress’i barındırdığınız sunucunuzun disk alanından tasarruf etmenize yardımcı olur ve her görseli manuel olarak incelediğiniz için en hızlı görseli en iyi kalitede garanti eder.

Adobe Photoshop

Adobe Photoshop, web için optimize edilmiş görselleri kaydetme özelliği ile gelen premium bir yazılımdır. Görselinizi açın ve “Dosya» Web İçin Kaydet ”seçeneğini tıklayın.

Yeni bir pencere açılacaktır. Sağ tarafta farklı görüntü formatlarını ayarlayabilirsiniz. JPEG formatı için farklı kalite seçenekleri göreceksiniz. Seçeneklerinizi seçtiğinizde, sol alt kısımdaki dosya boyutunu da gösterir.

GIMP

GIMP, popüler Adobe Photoshop’a ücretsiz ve açık kaynak kodlu bir alternatif yazılımdır. Görsellerinizi web için optimize etmek için kullanılabilir. Dezavantajı ise kullanımı kolay olmamasıdır.

İlk olarak, görselinizi GIMP’de açmanız ve ardından Dosya »Farklı Dışa Aktar seçeneğini belirlemeniz gerekir. Bu, dosyayı kaydetmeniz gereken pencereye getirir. Dosyanıza yeni bir ad verin ve ardından dışa aktar düğmesini tıklayın.

Bu, görüntü dışa aktarma seçeneklerini getirecektir. Jpeg dosyaları için, dosya boyutunu azaltmak üzere sıkıştırma seviyesini seçebilirsiniz. Son olarak, optimize edilmiş görüntü dosyasını kaydetmek için dışa aktar düğmesine tıklamalısınız.

TinyPNG

TinyPNG, PNG dosyalarınızın boyutunu azaltmak için akıllı bir kayıplı sıkıştırma tekniği kullanan ücretsiz bir web uygulamasıdır. Yapmanız gereken tek şey web sitelerine gitmek ve görsellerinizi yüklemek (basit sürükle ve bırak tekniği).

Görüntüyü sıkıştırdıktan sonra indirebileceğiniz linki verecektir. JPEG formatındaki bir görseli sıkıştırmak için TinyPNG’nin kardeş web sitesi TinyJPG’yi kullanabilirsiniz.

Ayrıca geliştiriciler için görselleri otomatik olarak dönüştürmek için bir API’ye sahipler ve yeni başlayanlar için otomatik olarak tüm işlemi sizin için yapabilen bir WordPress eklentisi de mevcut.

JPEG Mini

JPEGmini, algısal kalitelerini etkilemeden görsellerin boyutunu önemli ölçüde azaltan kayıpsız bir sıkıştırma teknolojisi kullanır. Orijinal görselinizin kalitesini ve sıkıştırılmış görseli de karşılaştırabilirsiniz.

Web sürümlerini ücretsiz olarak kullanabilir veya programı bilgisayarınızda kullanmak için satın alabilirsiniz. Ayrıca, sunucunuzda işlemi otomatikleştirmek için ücretli bir API’ye de sahiptirler.

ImageOptim

ImageOptim, en iyi sıkıştırma parametrelerini bularak ve gereksiz renk profillerini kaldırarak görüntüleri herhangi bir kalite kaybetmeden sıkıştırmanızı sağlayan Mac için geliştirilmiş yardımcı bir programıdır.

Windows işletim sistemlerinin alternatifi olarak Trimage’i kullanabilirsiniz.

WordPress için En İyi Görsel Optimizasyonu Eklentileri

Resimlerinizi optimize etmenin en iyi yolunun WordPress’e yüklemeden önce bunu yapmak olduğuna inanıyoruz. Ancak, çok yazarlı bir site çalıştırıyorsanız veya otomatik bir çözüme ihtiyacınız varsa, bir WordPress görsel sıkıştırma eklentisini denemeniz faydalı olacaktır.

En iyi WordPress görüntü sıkıştırma eklentileri listemiz:

  1. Optimole
  2. EWWW Image Optimizer
  3. Compress JPEG & PNG images
  4. Imagify
  5. ShortPixel
  6. WP Smush
  7. reSmush.it

Bu WordPress görsel optimizasyonu eklentilerinden herhangi birini kullanmak web sitenizi hızlandırmanıza yardımcı olacaktır.

Görsel Optimizasyonu İçin Düşüncelerimiz ve En İyi Uygulamalar

Web için optimize edilmiş görselleri kaydetmiyorsanız, şimdi yapmaya başlamanız gerekir. Bu işlem site hızınızda büyük bir fark yaratacak ve sayfalarınız hızlı yüklendiği için kullanıcılarınız size teşekkür edeceklerdir.

Unutmamanız gereken nokta, daha hızlı web siteleri SEO için temel özelliklerden biridir ve bu sayede arama motoru sıralamalarınızda gözle görülür bir artış sergileyecektir.

Görsel optimizasyonu dışında, web sitenizi hızlandırmanıza yardımcı olacak iki yöntemden biri WordPress önbellek eklentisi ve bir diğeri de WordPress CDN kullanmaktır.

Alternatif olarak, yönetilen bir WordPress sunucu şirketini kullanabilirsiniz, çünkü bunlar genellikle platformun bir parçası olarak hem önbellekleme hem de CDN sunarlar.

Umarım bu yazımız WordPress’te resimlerinizi nasıl optimize edeceğinizi öğrenmenize yardımcı olmuştur. Ayrıca, WordPress güvenliğinizi ve işletme web siteleri için en iyi WordPress eklentilerini nasıl geliştirebileceğinizle ilgili yazımızı da incelemek isteyebilirsiniz.

Bu yazımızı beğendiyseniz, lütfen YouTube Kanalımıze BURADAN abone olun.

CEVAP VER

Please enter your comment!
Please enter your name here