Görsel SEO, sayfalarınızdaki resimlerin hem arama motorları tarafından doğru anlaşılması hem de hızlı yüklenmesi için yapılan optimizasyonların tümüdür. Dosya adından alt metne, WebP ve AVIF gibi modern formatlardan lazy loading'e kadar her ayrıntı, Google Görseller'den gelen trafiği ve sayfanın genel hızını etkiler. Bu rehberde görsel SEO'yu sırasıyla, her adımda ne yapmanız gerektiğini örnekle anlatıyoruz.
Görsel SEO neden önemli?
Görsellerin iki ayrı etkisi vardır. Birincisi görünürlük: Google Görseller ve normal aramalardaki görsel kutuları ziyaretçi getirebilen ayrı bir kanaldır; özellikle ürün, tarif, mekân ve dekorasyon gibi konularda kullanıcılar önce görsele bakar. İkincisi hız: çoğu sayfada toplam veri boyutunun en büyük kısmını görseller oluşturur ve sayfadaki en büyük öğe sıklıkla bir görseldir. Yani optimize edilmemiş tek bir kahraman görseli, Core Web Vitals'taki LCP değerini bozarak tüm sayfanın performansını düşürebilir.
Üçüncü bir etki de erişilebilirliktir: alt metin, ekran okuyucu kullanan ziyaretçilere görseli anlatır. İyi alt metin hem kullanıcıya hem arama motoruna hizmet eder.
Dosya adı
Google, görselin ne hakkında olduğunu anlamak için dosya adını da kullanır. Fotoğraf makinesinden
gelen IMG_20260412_0043.jpg gibi adlar hiçbir bilgi taşımaz. Kurallar basit:
- Görseli tanımlayan, kısa ve anlamlı kelimeler kullanın:
deri-kanepe-gri-uc-kisilik.webp. - Kelimeleri tire (-) ile ayırın; alt çizgi (_) kelimeleri birleştirilmiş sayabilir.
- Küçük harf ve ASCII karakter tercih edin; Türkçe karakter ve boşluk kullanmayın.
- Anahtar kelime doldurmayın:
kanepe-kanepe-ucuz-kanepe.webpyardımcı olmaz.
| Kötü | İyi |
|---|---|
IMG_0043.jpg | gri-deri-kanepe.webp |
Yeni Resim (2).png | istanbul-kadikoy-ofis-girisi.webp |
kanepe_ucuz_kanepe_satilik.jpg | kose-koltuk-takimi.webp |
Alt metin nasıl yazılır?
Alt metin (alt özniteliği), görselin içeriğini kelimelerle anlatır. Görsel yüklenemezse
yerine gösterilir, ekran okuyucular okur ve Google görselin bağlamını anlamak için kullanır.
- Görseli olduğu gibi tarif edin. "Mutfak tezgâhında kahve yapan barista" iyi bir alt metindir; "görsel", "fotoğraf" gibi sözcüklerle başlamaya gerek yoktur.
- Kısa tutun. Genelde 125 karakterin altı yeterlidir.
- Anahtar kelimeyi doğal yerleştirin. Görsel gerçekten o konuyla ilgiliyse kelime kendiliğinden geçer; zorla eklenen listeler spam sayılabilir.
- Süs görsellerinde alt metni boş bırakın (
alt=""); böylece ekran okuyucular gereksiz yere okumaz. Alt özniteliğini tamamen silmeyin. - Metin içeren görselleri yazıya dökün. Görsel içinde bir slogan ya da fiyat varsa alt metne ya da sayfa metnine yazın.
Örnek: Bir ürün sayfasında alt="kanepe kanepe koltuk takımı ucuz"
yazmak yerine alt="Gri kumaşlı üç kişilik kanepe, ahşap ayaklı" yazın. İkincisi kullanıcıya
da yardımcı olur, arama motoruna da daha net bilgi verir.
Alt metnin yanı sıra görselin çevresindeki metin, başlık ve görsel altı yazısı (caption) de Google'ın bağlamı anlamasına yardım eder. Görseli ilgili paragrafın hemen yanına koymak, sayfanın en altındaki alakasız bir yere koymaktan çok daha iyidir.
Format seçimi: JPEG, PNG, WebP, AVIF
| Format | Güçlü yanı | Ne zaman? |
|---|---|---|
| JPEG | Yaygın, fotoğraflarda iyi sıkıştırma | Eski sistemler için yedek |
| PNG | Kayıpsız, şeffaflık | Logo, ekran görüntüsü, basit grafik |
| WebP | JPEG/PNG'den belirgin küçük dosya, şeffaflık desteği | Çoğu görsel için güvenli varsayılan |
| AVIF | Genelde WebP'den de küçük dosya | Fotoğraf ağırlıklı sayfalar; tarayıcı desteği geniş ama yedek ekleyin |
| SVG | Vektör, ölçeklenebilir, çok küçük | Logo, ikon, basit çizim |
Birden çok format sunmak için <picture> öğesini kullanabilirsiniz: tarayıcı desteklediği
ilk formatı seçer, hiçbirini desteklemiyorsa içindeki <img> etiketine düşer. Böylece
AVIF destekleyene AVIF, desteklemeyene WebP ya da JPEG gider.
Boyut ve sıkıştırma
En sık yapılan hata, 4000 piksel genişliğindeki bir fotoğrafı 400 piksellik bir kutuda göstermektir. Tarayıcı yine de tüm dosyayı indirir. Şunları uygulayın:
- Gerçek gösterim boyutuna göre yeniden boyutlandırın. Blog içeriği için genelde
800–1200 piksel genişlik yeterlidir; yüksek yoğunluklu ekranlar için iki katı boyutu
srcsetile ayrıca sunun. - Sıkıştırın. Fotoğraflarda kalite 75–85 aralığı çoğu zaman gözle fark edilmeden dosya boyutunu ciddi biçimde küçültür.
- Metadata temizleyin. EXIF verileri (konum, cihaz) gereksiz yük ve gizlilik riskidir.
- Hedef belirleyin. Genel bir yaklaşım olarak içerik görsellerini birkaç yüz KB'ın altında tutmaya çalışın; büyük kahraman görselleri için bile bir sınır koyun.
width ve height değerlerini HTML'de mutlaka belirtin. Tarayıcı, görsel inmeden
önce ona ne kadar yer ayıracağını bilir; sayfa yüklenirken içerik aşağı kaymaz.
Duyarlı görseller: srcset ve sizes
Aynı görseli hem 360 piksel genişliğinde bir telefona hem 1920 piksellik bir monitöre göndermek israftır.
srcset ile farklı genişlikte birkaç sürüm tanımlar, sizes ile görselin ekranın
ne kadarını kaplayacağını söylersiniz; tarayıcı kendisine en uygun dosyayı seçer. Örneğin 480, 800 ve
1200 piksel genişliğinde üç sürüm üretmek çoğu blog ve ürün sayfası için yeterlidir. Mobil cihazlarda
veri tasarrufu belirgindir ve bu doğrudan LCP süresine yansır.
Görsel nerede durmalı?
Google görselin konusunu çevresindeki metinden de çıkarır. Bu yüzden görseli, anlattığı konunun geçtiği paragrafın yanına koyun; altına konuyu özetleyen kısa bir görsel yazısı (caption) ekleyin. Görselin bulunduğu bölümün başlığı, görselin ne ile ilgili olduğunu güçlendirir. Telif haklı stok görselleri doğrudan kullanmak yerine mümkünse kendi çektiğiniz özgün fotoğrafları tercih edin; özgün görsel hem kullanıcıya güven verir hem de tekrar eden stok görsellerden sizi ayırır.
Lazy loading ve CLS
Lazy loading, ekranın altında kalan görsellerin kullanıcı oraya yaklaşana kadar yüklenmemesidir. Modern tarayıcılarda tek bir öznitelikle uygulanır:
<img src="kanepe.webp" alt="Gri kumaşlı üç kişilik kanepe" width="800" height="600" loading="lazy">
- İlk ekrandaki (above the fold) görsele lazy loading uygulamayın. Sayfanın en
büyük görseli geç yüklenirse LCP kötüleşir. Bu görsel için
fetchpriority="high"kullanabilirsiniz. - Galeri, ürün listesi ve uzun yazıların alt bölümündeki görseller lazy loading için idealdir.
- Her zaman
width/heightile birlikte kullanın; aksi halde yüklenen görsel düzeni kaydırır. - Google'ın görseli bulabilmesi için gerçek bir
<img src>kullanın; yalnızca CSS arka planı olan görseller görsel aramada indekslenmeyebilir.
Hız metrikleri hakkında daha fazlası için Core Web Vitals rehberimize bakın.
Görsel sitemap ve yapısal veri
Google çoğu görseli normal tarama sırasında bulur. Yine de JavaScript ile yüklenen galeriler ya da
karmaşık yapılar için görselleri sitemap'inize eklemek yardımcı olabilir. Standart sitemap'te her
<url> altında <image:image> ve <image:loc> öğeleri
kullanılır:
- Sitemap'in başına görsel ad alanını ekleyin.
- Her sayfa için o sayfada geçen görsellerin adreslerini listeleyin.
- Sitemap'i Search Console'dan gönderin ve hataları kontrol edin.
- robots.txt dosyanızın görselleri engellemediğinden emin olun.
Ürün, tarif veya makale gibi içeriklerde yapısal veri (schema) içine görsel adresi eklemek, Google'ın görseli zengin sonuçlarda kullanabilmesini kolaylaştırır. Search Console kullanımı için başlangıç rehberimize bakabilirsiniz.
Sık yapılan görsel hataları
- Metni görsele gömmek: Önemli bilgiyi (fiyat, adres, kampanya) yalnızca görselin içine yazmak, arama motorunun ve ekran okuyucunun onu görememesine yol açar.
- Aynı alt metni her yere kopyalamak: Ürün galerisindeki beş görselin hepsine aynı alt metni yazmak yerine her birini (ön, yan, detay) ayrı tarif edin.
- Çok büyük "kahraman" görseller: Tam ekran bir slayt görseli bazen yüzlerce KB yerine birkaç MB tutar; önce boyutu küçültün, sonra tasarımı gözden geçirin.
- Görselleri robots.txt ile engellemek: Görsel klasörünü engelleyen bir kural, Google Görseller'de hiç görünmemenize neden olur.
- Kırık görsel bağlantıları: Taşınan veya silinen görseller 404 verir; düzenli tarama yaparak onarın.
Kontrol listesi ve ölçüm
- Dosya adı anlamlı, ASCII ve tire ile ayrılmış mı?
- Alt metin görseli kısaca ve doğal biçimde anlatıyor mu?
- Görseller WebP/AVIF veya uygun formatta mı?
- Gösterim boyutundan büyük dosya yüklenmiyor mu?
- İlk ekran dışındaki görsellerde
loading="lazy"var mı? widthveheighttanımlı mı?- Görsel sitemap ve robots.txt doğru mu?
Ölçüm için PageSpeed Insights "Görselleri verimli şekilde kodlayın" ve "Doğru boyutlu görseller" önerilerini doğrudan gösterir. Search Console'daki performans raporunda arama türünü "Görsel" olarak seçip görsel aramadan gelen gösterim ve tıklamaları ayrı izleyebilirsiniz. Görsel optimizasyonunun hızı iyileştirmesi de hemen çıkma oranını düşürmeye yardımcı olur.
Sonuç
Görsel SEO tek bir hamle değil, her görselde tekrarlanan küçük bir alışkanlıktır: anlamlı bir dosya adı, dürüst bir alt metin, doğru format ve boyut, ekran altı için lazy loading ve gerekirse görsel sitemap. En büyük kazanç genellikle en büyük görsellerden gelir; önce PageSpeed Insights'ta en ağır birkaç görseli bulup onlarla başlayın. Sonuç, Google Görseller'den gelen ek trafik ve daha hızlı bir site olacaktır. Sıralamayı yine Google'ın algoritmaları belirler; sizin işiniz, görsellerinizi anlaşılır ve hafif tutmaktır.