WordPress’te WebP Görselleri Nasıl Kullanılır (3 Yöntem)

Görüntü kalitesini daha hızlı yükleme süreleriyle dengelemenin önemini biliyoruz. Birçok web sitesi sahibi bize tam da bunu yapmak için WebP görüntülerini kullanmanın en iyi yolunu soruyor.

WebP görüntüleri, görüntü kalitesinden önemli ölçüde ödün vermeden dosya boyutunu azaltarak daha iyi görüntü sıkıştırması sunan modern bir görüntü formatıdır. Bu, web sitenizin daha hızlı yüklenmesini sağlar ve bant genişliğinden tasarruf sağlar.

Sorun şu ki, WordPress WebP görüntülerinin yüklenmesini veya görüntülenmesini yerel olarak desteklemiyor.

Bu makalede, WordPress’te WebP görsellerini nasıl kolayca kullanabileceğinizi göstereceğiz.

WebP Nedir?

WebP, web üzerinde kullanılacak görüntüler için daha yeni bir dosya formatıdır. WebP görüntü formatını kullanarak, görüntüleriniz kalite kaybı olmadan PNG ve JPEG’e göre dosya boyutunda %25-34 daha küçük olacaktır.

Görüntüler web sitenizi yavaşlatıyorsa, bunları WebP formatına dönüştürmek sayfa yükleme hızı testi puanlarınızı artırabilir.

Görüntüleri web için optimize etme kılavuzumuzda görüntü sıkıştırma hakkında bilgi edinebilirsiniz.

WebP yeni bir dosya formatı olduğu için henüz tüm tarayıcılar tarafından desteklenmemektedir. Ancak Google Chrome, Firefox ve Microsoft Edge gibi modern tarayıcıların çoğu WebP görüntülerini desteklemektedir.

WordPress’te WebP Görselleri Kullanmalı mısınız?

WebP görüntüleri WordPress web sitenizi hızlandırmanıza yardımcı olabilir. WordPress önbellekleme eklentisi, CDN ve daha fazlası ile birlikte kullanılması önerilen en iyi uygulamadır.

WordPress 5.8‘den bu yana, WordPress varsayılan olarak WebP görüntülerini desteklemektedir. Bu, WebP resimlerinizi bir eklenti kullanmadan kaydedebileceğiniz ve WordPress web sitenize yükleyebileceğiniz anlamına gelir.

Ancak bunu söyledikten sonra, yine de WordPress sitenizde bir görüntü sıkıştırma eklentisi kullanmak isteyebilirsiniz. Kullanıcılarınızın çoğu desteklenmeyen tarayıcılar kullanıyorsa, bir görüntü sıkıştırma eklentisi kullanmayı düşünmelisiniz.

Görüntü sıkıştırma eklentileri mevcut görüntülerinizi WebP formatına dönüştürebilir ve henüz WebP’yi desteklemeyen tarayıcılarda JPEG veya PNG görüntülerini yedek seçenek olarak görüntüleyebilir.

Sitenizde çok sayıda resim kullanılıyorsa ve bunlar WordPress blogunuzu yavaşlatıyorsa, WebP resimleri kullanmayı kesinlikle düşünmelisiniz.

WordPress’te WebP görsellerini nasıl kullanacağınız aşağıda açıklanmıştır. Size birden fazla yöntem göstereceğiz, böylece sizin için en uygun olanı seçebilirsiniz:

Video Eğitimi

Yazılı talimatları tercih ediyorsanız, okumaya devam edin.

Yöntem 1: WordPress’te EWWW Optimizer ile WebP Görüntüleri Kullanma

EWWW Image Optimizer, WordPress görüntülerinizi optimize etmenizi sağlayan en iyi WordPress görüntü sıkıştırma eklentilerinden biridir. Ayrıca WebP Görüntülerini destekler ve bunları desteklenen tarayıcılarda otomatik olarak gösterebilir. Daha fazla ayrıntı için EWWW Image Optimizer incelememize bakın.

Yapmanız gereken ilk şey EWWW Image Optimizer eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için WordPress eklentisi yükleme hakkındaki adım adım kılavuzumuza bakın.

Etkinleştirmenin ardından, eklenti seçeneklerini yapılandırmak için Ayarlar ” EWWW Image Optimizer sayfasına gidin. Bir kurulum sihirbazı sizi karşılayacaktır, ancak sihirbazdan çıkmak için ‘Ne yaptığımı biliyorum’ bağlantısına tıklayabilirsiniz.

Bir sonraki ekranda bir dizi eklenti seçeneği göreceksiniz.

Aşağı kaydırın ve ‘WebP Dönüştürme’ seçeneğinin yanındaki kutuyu işaretleyin.

Bundan sonra, ayarlarınızı kaydetmek için ‘Değişiklikleri Kaydet’ düğmesine tıklayın.

Ardından, WebP Dönüştürme bölümüne ilerlemeniz gerekir. Eklenti şimdi size kırmızı bir önizleme görüntüsü ile bazı yeniden yazma kuralları gösterecektir.

‘Yeniden Yazma Kuralları Ekle’ düğmesine tıklamanız gerekir ve eklenti otomatik olarak bu yeniden yazma kurallarını .htaccess dosyanıza eklemeye çalışacaktır.

Eklenti bu kuralları eklemede başarılı olursa, kırmızı görüntü önizlemesi ‘WebP’ metniyle yeşile dönecektir.

Bazen eklenti kuralları ekleyemeyebilir. Bu durumda, yeniden yazma kurallarını eklentinin ayarlar sayfasından kopyalamanız ve .htaccess dosyanızın altına manuel olarak yapıştırmanız gerekir.

İşiniz bittiğinde, eklentinin ayarlar sayfasına dönün ve ‘Değişiklikleri Kaydet’ düğmesine tekrar tıklayın. Önizleme görüntüsü yeşile dönerse, bu, WordPress web sitenizde WebP görüntü dağıtımını başarıyla etkinleştirdiğiniz anlamına gelir.

Alternatif olarak, WebP teslim seçenekleriniz olarak JS WebP Rewriting veya WebP Rewriting yöntemlerinden birini seçebilirsiniz. Bunlar .htaccess yönteminden biraz daha yavaştır, ancak işi halledeceklerdir.

Eski Görüntülerinizi WebP Sürümlerine Toplu Olarak Dönüştürün

EWWW Image Optimizer, önceden yüklediğiniz resim dosyalarınızı kolayca WebP resimlerine dönüştürmenizi sağlar. Sadece Medya ” Kütüphane sayfasına gidin ve liste görünümüne geçin.

Ardından, ‘Ekran Seçenekleri’ düğmesine tıklamanız ve ‘Sayfa başına öğe sayısı’nı 999 olarak değiştirmeniz gerekir. Eğer 1000’den fazla resminiz varsa, bu resimler bir sonraki sayfada görünecektir.

Bu şekilde, toplu optimizasyon için çok sayıda görüntüyü hızlı bir şekilde seçebileceksiniz. Ardından, tüm görüntüleri seçmek için üstteki Tümünü Seç onay kutusuna tıklayın.

Bundan sonra, ‘Toplu Eylemler’ açılır menüsüne tıklayın ve ‘Toplu Optimize Et’ seçeneğini seçin. Son olarak, ‘Uygula’ düğmesine tıklayın.

Bir sonraki ekranda, eklenti size görüntü sıkıştırmayı atlama ve yalnızca WebP’ye dönüştürme seçeneği sunacaktır. Resimleriniz zaten optimize edilmişse bu seçeneği işaretleyebilirsiniz.

Bundan sonra, devam etmek için ‘Optimize Edilmemiş Görselleri Tara’ düğmesine tıklayın. Eklenti daha sonra size bulduğu görüntülerin sayısını gösterecektir, böylece devam etmek için Optimize Et düğmesine tıklayabilirsiniz.

Resimleriniz artık optimize edilecek ve EWWW Optimizer resimleriniz için WebP sürümleri oluşturacaktır.

WebP Görüntü Teslimatınızı Test Etme

Görsellerinizi optimize ettikten sonra, birkaç görsel içeren bir blog gönderisine gidebilirsiniz.

Fareyi herhangi bir resmin üzerine getirin ve resmi yeni bir sekmede açmak için sağ tıklayın.

Bu, görüntüyü yeni bir tarayıcı sekmesinde açacaktır.

Adres çubuğunda .webp uzantısına sahip olduğunu görebileceksiniz.

Eğer eklenti WebP görüntüsünü sunamıyorsa, eklentinin ayarlar sayfasına geri dönebilirsiniz. Buradan, WebP teslim seçeneğini ‘JS WebP Rewriting’ veya ‘WebP Rewriting’ yöntemleriyle değiştirebilirsiniz.

Yöntem 2: Imagify ile WordPress’te WebP Görüntülerini Kullanma

Imagify, en iyi WordPress önbellekleme eklentisi olan WP Rocket‘in arkasındaki kişiler tarafından oluşturulan bir WordPress görüntü optimizasyon eklentisidir. Görüntüleri kolayca optimize etmenizi ve WebP görüntü formatına dönüştürmenizi sağlar. Daha fazla bilgi edinmek için Imagify incelememize bakın.

Yapmanız gereken ilk şey Imagify eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına ilişkin adım adım kılavuzumuza bakın.

Etkinleştirmenin ardından, eklenti ayarlarını yapılandırmak için Ayarlar ” Imagify sayfasını ziyaret etmeniz gerekir. Buradan devam etmek için ‘Ücretsiz API Anahtarı Oluştur’ düğmesine tıklayın.

Bir iş e-posta adresi girmeniz istenecektir. Bundan sonra, API anahtarınızı içeren bir e-posta için gelen kutunuzu kontrol edebilirsiniz. Anahtarı kopyalayıp eklentinin ayarlar sayfasına yapıştırın ve ‘Değişiklikleri Kaydet’ düğmesine tıklayın.

Ardından, Optimizasyon bölümüne ilerlemeniz gerekir. Burada ‘Görsellerin webp versiyonlarını oluştur’ ve ‘Görselleri sitede webp formatında görüntüle’ seçeneklerinin yanındaki seçenekleri işaretlemeniz gerekir.

Bunun altında, WordPress’te WebP görüntülerini görüntülemek için iki dağıtım yönteminden birini seçebilirsiniz. Bunlardan ilki .htaccess yöntemi, ikincisi ise bir etiket kullanmaktır.

.htaccess yöntemi daha hızlıdır, ancak bir CDN hizmeti kullanıyorsanız çalışmaz. Etiket yöntemi de CDN’lerle çalışır, ancak bazı WordPress temalarını bozabilir.

Siteniz için uygun olan herhangi birini seçebilirsiniz. Bundan sonra, alttaki ‘Kaydet ve Toplu Optimize Ediciye Git’ düğmesine tıklayın.

Bu sizi Medya ” Toplu Optimizasyon sayfasına götürecektir.

Eklenti arka planda otomatik olarak tüm WordPress resimlerinizi optimize etmeye başlayacaktır.

Çok sayıda görseliniz varsa, bu işlem biraz zaman alabilir. Endişelenmeyin, sayfayı kapatıp daha sonra geri dönebilirsiniz çünkü sayfayı kapatmak görüntü optimizasyon sürecini durdurmayacaktır.

WebP Görüntülerinizi WordPress’te Test Etme

Optimizasyon tamamlandıktan sonra, birkaç resim içeren bir sayfayı veya gönderiyi ziyaret edebilirsiniz. Farenizi bir resmin üzerine getirin ve ardından sağ tıklayarak ‘Resmi yeni sekmede aç’ seçeneğini seçin.

Bu, görüntüyü yeni bir tarayıcı sekmesinde açacaktır.

Adres çubuğunda .webp uzantısını görebileceksiniz.

Yöntem 3: SG Optimizer ile WordPress’te WebP Görüntülerini Kullanma

SiteGround kullanıcısıysanız bu yöntem önerilir.

SiteGround en iyi WordPress barındırma şirketlerinden biridir. Kullanıcılarına WordPress performansınızı optimize etmenizi sağlayan ücretsiz bir SG Optimizer eklentisi sunuyorlar. Ayrıca WordPress görüntülerini optimize etme seçeneğini de içerir.

İlk olarak, SG Optimizer eklentisini yüklemeniz ve etkinleştirmeniz gerekir.

Etkinleştirmenin ardından eklenti, yönetici kenar çubuğunuza ‘SG Optimizer’ etiketli yeni bir menü öğesi ekleyecektir. Üzerine tıkladığınızda sizi eklentinin ayarlar sayfasına götürecektir.

SiteGround’un yerleşik önbellekleme sistemini kullanmak istiyorsanız buradan önbellekleme ayarlarını açabilirsiniz.

Bundan sonra, Medya Optimizasyonu sekmesine geçebilir ve ‘Yeni Görüntülerin WebP Kopyalarını Oluştur’ seçeneğini açabilirsiniz.

Bunun altında, ‘WebP Dosyalarını Toplu Oluşturma’ seçeneğini göreceksiniz.

Bu seçeneğin geçiş düğmesine tıklamak, WordPress medya kitaplığınızdaki tüm görüntü dosyaları için WebP kopyaları oluşturmaya başlayacaktır.

Tamamlandığında, WordPress siteniz WebP görüntüleri sunmaya başlayacaktır.

WebP Görüntülerini SG Optimizer’da Test Etme

Web sitenizin WebP görüntüleri sunup sunmadığını görmek için sitenizde birkaç görüntü içeren bir sayfa açmanız gerekir.

Bundan sonra, sağ tıklayın ve İncele aracını seçin. Bu, Ağ sekmesine geçmeniz gereken geliştirici konsolunu açacaktır.

Buradan, ‘img’ sekmesine tıklayın ve ardından sayfayı yeniden yükleyin (Windows’ta CTRL+R ve Mac’te Command+R). Web siteniz yeniden yüklendiğinde, geliştirici konsolunda tüm görsellerin yüklendiğini göreceksiniz.

WordPress’te Görsel Kullanımına İlişkin Uzman Kılavuzları

Artık WordPress’te WebP görsellerini nasıl kullanacağınızı bildiğinize göre, WordPress sitenizde görselleri kullanmak için diğer bazı kılavuzları görmek isteyebilirsiniz:

• WordPress’te Görseller Nasıl Doğru Şekilde Eklenir (Adım Adım)
• WordPress’te Öne Çıkan Görseller veya Yazı Küçük Resimleri Nasıl Eklenir
• WebP vs. PNG vs. JPEG: WordPress için En İyi Görüntü Formatı
• Görüntüleri Kaliteden Ödün Vermeden Web Performansı İçin Optimize Etme
• En İyi WordPress Görüntü Sıkıştırma Eklentileri Karşılaştırıldı
• Blog Yazılarınız İçin Daha İyi Görseller Oluşturmanıza Yardımcı Olacak Araçlar
• Görselleri Yönetmek için Harika WordPress Eklentileri (Güncellendi)
• WordPress’te Resim Alt Metni ve Resim Başlığı – Aradaki Fark Nedir?
• WordPress Sitenizdeki Görselleri Nerede Depolar?
• WordPress’te Görseller Nasıl Kolayca Tembel Yüklenir?

Umarız bu makale WordPress’te WebP görsellerinin nasıl kullanılacağını öğrenmenize yardımcı olmuştur. Ayrıca e-posta bülteni oluşturma kılavuzumuza ve web siteniz için en iyi iş telefonu hizmetlerine yönelik uzman seçimlerimize de göz atmak isteyebilirsiniz.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.