Görsel SEO'su: Daha Fazla Organik Trafik İçin 12 Pratik İpucu

Çoğu kişi görsel SEO'sunu alt özniteliğine bir anahtar kelime yazmaktan ibaret sanıyor. Oysa Google'ın sitenizdeki görselleri nasıl bulduğunu, anladığını ve sıraladığını etkileyen en az on iki etken var. Bu etkenleri göz ardı etmek, kolayca kazanılabilecek trafiği kaybetmek demek — üstelik küresel aramaların önemli bir bölümünü oluşturan Görseller sekmesindeki trafiği de.

Google'ın makine öğrenmesiyle görsel tanıma yeteneği hızla ilerliyor. Ama bu, görsel SEO'sunu geçersiz kılmıyor — tam tersine Google, görselleri isabetli yorumlayıp sıralamak için eldeki tüm sinyalleri (dosya adı, alt metni, sayfa bağlamı, yükleme hızı) kullanmayı sürdürüyor.

1. Dosyaları açıklayıcı biçimde adlandırın

Dosya adı, Google'ın bir görselin konusunu anlamak için kullandığı ilk sinyallerden biridir. Fotoğraf makineleri ve telefonlar IMG_0023.JPG ya da DSC_4817.jpg gibi jenerik adlar üretir — bunlar arama motoruna hiçbir şey anlatmaz.

Google, resmî yönergelerinde dosya adının görselin içeriği hakkında bir ipucu olduğunu açıkça belirtiyor. Öneri basit: açıklayıcı anahtar kelimeleri tire ile ayırarak, abartmadan kullanın:

• İyi: cikolatali-pasta.jpg
• Kötü: IMG_2947.jpg
• Yine kötü: cikolatali-pasta-tarif-tatli-kek-sekerli.jpg (anahtar kelime yığını)

Görselleri yüklemeden önce yeniden adlandırmak, fark yaratan basit bir alışkanlıktır — özellikle e-ticaret siteleri, yemek blogları, portfolyolar ve görsel aramasından trafik alan her site için.

2. İşe yarayan alt metinleri yazın

alt özniteliği bir görseli tarayıcıya tanımlar. Görsel yüklenmediğinde ekranda görünür, görme engelliler için ekran okuyucular tarafından seslendirilir ve Google tarafından sayfanın görsel içeriğini anlamak için kullanılır.

Söz dizimi basit:

<img src="dalmacyali-kopek.jpg" alt="Parkta oynayan Dalmaçyalı yavru köpek">

Google, görselin konusunu anlamak için alt metnini bilgisayarlı görü algoritmaları ve sayfa bağlamıyla birlikte değerlendirir. Öneri, anahtar kelimeleri bağlam içinde kullanarak bilgi dolu ve işe yarar açıklamalar yazmak — anlamsız kelime yığını (keyword stuffing) oluşturmak değil.

İşe yarayan bir kısayol: "Bu, ___ fotoğrafıdır" cümlesini tamamlayın. Boşluğa yazdığınız şey, hafifçe düzeltildiğinde genellikle iyi bir alt metin olur. Örnekler:

• "Bu, çilek soslu çikolatalı bir cheesecake fotoğrafıdır." → alt="Çilek soslu çikolatalı cheesecake"
• "Bu, masa üzerinde ekranı kırık bir dizüstü bilgisayar fotoğrafıdır." → alt="Ofis masasında ekranı kırık dizüstü bilgisayar"

Ürün görsellerinde model numarasını ya da SKU kodunu alt metnine eklemek, teknik aramalarda çıkmaya yardımcı olabilir. Resim yazılarını da unutmayın — Google, görselin konusuna dair bilgiyi çevresindeki metinden, sayfada görünen resim yazıları dahil, çıkarır.

3. Doğru dosya formatını seçin

Format seçimi dosya boyutunu, dolayısıyla sayfanın yükleme hızını doğrudan etkiler. Web'de en yaygın üç format JPG, PNG ve WebP'dir; her birinin kendine özgü özellikleri vardır:

Genel kural: fotoğraflarda JPG, şeffaf arka plan ve keskin yazı gerektiren görsellerde PNG, web'de ise mümkün olan her yerde WebP kullanın — bu format aynı kalitede daha iyi sıkıştırma sunar. Yüklemeden önce formatlar arasında geçiş için ImageTools'un Dönüştür aracını kullanın.

4. Görselleri gerçek görüntüleme ölçülerine getirin

Görselleri 800px genişlikte gösteren bir siteye 4000px genişliğinde fotoğraf yüklemek bant genişliği israfıdır. Tarayıcı görselin tamamını indirir, sonra fazla pikselleri atar — kullanıcı hiçbir görsel kazanım olmadan daha uzun bekler.

Tasarımınızdaki görsellerin en büyük görüntüleme genişliğini belirleyin (görsel türüne ve siteye göre genellikle 800px ile 1440px arası) ve yüklemeden önce boyutlandırın. Retina (HiDPI) ekranları karşılamak için bu genişliğin iki katını kullanın. Ölçüleri hassas biçimde ayarlamak için ImageTools'un Boyutlandır aracını kullanın.

5. Görünür kalite kaybı olmadan sıkıştırın

Sıkıştırma, görselin ölçülerini değiştirmeden dosya boyutunu küçültme işlemidir. JPG fotoğraflarda kaliteyi %100'den %80'e düşürmek, ekranda fark edilmeyecek bir değişimle dosyayı 5–10 kat küçültebilir.

Yükleme hızı, Google'ın hem masaüstü hem mobil için doğruladığı bir sıralama etkenidir. Görseller çoğu zaman bir web sayfasının ağırlığındaki en büyük kalemdir. Tüm görselleri yüklemeden önce sıkıştırmak, harcanan emek başına en çok geri dönüş veren teknik SEO iyileştirmesidir.

Görsel türüne göre pratik boyut hedefleri:

• Tam genişlikte afiş / hero görseli: 200 KB altı
• Ürün fotoğrafı ya da blog görseli: 60–150 KB
• Küçük görsel (thumbnail): 15–40 KB
• PNG/WebP logo: 30 KB altı

JPG, PNG ve WebP dosyalarını doğrudan tarayıcınızda küçültmek için ImageTools'un Sıkıştır aracını kullanın — dosyalar dış sunuculara gönderilmez.

6. Görsel site haritası oluşturun

Görsel site haritası, Google'ın kendi başına keşfedemeyebileceği görselleri ona bildirir — özellikle JavaScript ile yüklenen ya da karmaşık galerilere gömülü görselleri. Sıradan site haritasından farklı olarak görsel site haritası, başka alan adlarındaki (örneğin CDN'lerdeki) URL'leri de içerebilir.

Siteniz WordPress ve Yoast SEO eklentisi kullanıyorsa görseller site haritasına zaten otomatik eklenir. Özel geliştirilmiş sitelerde görsel site haritası, Google'ın resmî belgelerini izleyerek elle eklenebilir. Kullanılabilir başlıca etiketler image:loc (görselin URL'si), image:title ve image:caption etiketleridir.

7. Ürün görselleri için yapılandırılmış veri kullanın

Google, görseller için yapılandırılmış verileri (Schema.org) pek çok bağlamda destekler — tarifler, ürünler, makaleler, etkinlikler. Doğru uygulandığında bu veriler görsellerin Google'da zengin sonuçlarda (rich results) çıkmasını sağlar; ek görsel vurgu tıklama oranını artırır.

E-ticaret siteleri için görselli ürün işaretlemesi özellikle değerlidir: görseli doğru işaretlenmiş ürünler Google Shopping'de ve Google bilgi panelindeki ürün kartlarında çıkabilir.

8. Lazy loading uygulayın

Lazy loading, görselleri ilk yüklemede topluca indirmek yerine yalnızca ekranın görünür alanına girmek üzereyken yükleme tekniğidir. Çok görselli sayfalarda (uzun blog yazıları, ürün listeleri) sayfanın ilk ağırlığını %60–80 azaltabilir.

En basit uygulama doğrudan HTML içindedir:

<img src="urun.webp" alt="Mavi spor ayakkabı" loading="lazy">

Önemli: sayfayı kaydırmadan görünen ilk görsele (ekranın üst bölümü) asla loading="lazy" uygulamayın. Bu, Core Web Vitals metriklerinden LCP'yi (Largest Contentful Paint) geciktirir ve sıralamayı doğrudan olumsuz etkiler.

9. Tüm görsel etiketlerinde width ve height tanımlayın

Tarayıcı bir görseli yüklemeden önce boyutunu bilmiyorsa düzende doğru alanı ayırmaz — görsel yüklendiğinde de sayfa içeriği "zıplar". Google'ın CLS (Cumulative Layout Shift) adıyla ölçtüğü bu olgu, bir başka Core Web Vital metriğidir.

Çözüm, görsel etiketlerinde width ve height değerlerini her zaman belirtmektir:

<img src="urun.webp" alt="Mavi spor ayakkabı" width="800" height="800" loading="lazy">

Bu değerlerin ekranda görünen ölçüyle birebir aynı olması gerekmez — yalnızca oranı tanımlar ve tarayıcının görseli yüklemeden önce doğru alanı ayırmasını sağlar.

10. srcset ile duyarlı görseller kullanın

srcset özniteliği, aynı görselin farklı ekran ölçüleri için farklı sürümlerini sunmanızı sağlar. Tarayıcı en uygun sürümü otomatik seçer — telefonlara küçük, masaüstüne büyük görsel gönderir. Mobil trafiği yüksek sitelerde bu, aktarılan veri hacmini %40–60 azaltabilir.

<img
  src="urun-800.webp"
  srcset="urun-400.webp 400w,
          urun-800.webp 800w,
          urun-1200.webp 1200w"
  sizes="(max-width: 600px) 400px, 800px"
  alt="Mavi spor ayakkabı"
  width="800" height="800"
  loading="lazy"
>

11. Öne çıkan görseli Open Graph ve sosyal medya için optimize edin

Biri WhatsApp, Instagram, LinkedIn ya da başka bir platformda bir URL paylaştığında önizlemede görünen görsel, Open Graph meta etiketlerinden gelir. Bu etiketler tanımlı değilse platform sayfadaki herhangi bir görseli seçer — sonuç genellikle kötü olur.

Sitenizdeki her önemli sayfada og:image etiketini 1200×630px'lik bir görselle mutlaka tanımlayın:

<meta property="og:image" content="https://siteniz.com/gorseller/yazi-onizleme.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">

İyi hazırlanmış bir önizleme görseli — okunaklı başlık, markanın görsel kimliği ve konuyla ilgili bir görselle — paylaşımlardaki tıklama oranını belirgin biçimde artırır.

12. Sayfanın bütünündeki bağlamı gözetin

Google görselleri tek başına değerlendirmez; bütüne bakar: görselin çevresindeki metin, sayfa başlığı, anlamsal bağlam, diğer görsel ögeler, görselin altındaki resim yazısı ve hatta sayfaya işaret eden bağlantıların metni. Kırmızı bir ayakkabı görseli, kadın modası sayfasında ile bir yemek sayfasında tamamen farklı bir bağlama sahiptir.

Bağlam için iyi uygulamalar:

• Görselleri, onları açıklayan ya da atıf yaptıkları metnin yakınına yerleştirin
• Mümkün olduğunca görsellerin altına görünür resim yazıları ekleyin
• Görselin konusunun sayfanın temasıyla ilgili olduğundan emin olun
• Ana görsellerin konusunu pekiştiren sayfa başlıkları ve ara başlıklar kullanın

Görsel SEO'su kontrol listesi

• ☑ Anahtar kelime içeren açıklayıcı dosya adı (tireli, kelime yığını olmadan)
• ☑ Tüm görsellerde açıklayıcı ve bağlama uygun alt özniteliği
• ☑ Her tür için doğru format: fotoğraflarda WebP ya da JPG, logo ve ikonlarda PNG/SVG
• ☑ Ölçüler gerçek görüntüleme boyutuna göre ayarlı (Retina için en fazla 2×)
• ☑ Sıkıştırma uygulanmış — boyut, türüne göre hedefin altında
• ☑ Tüm <img> etiketlerinde width ve height tanımlı
• ☑ Ekranın altında kalan görsellerde loading="lazy"
• ☑ LCP görselinde lazy loading yok; mümkünse fetchpriority="high"
• ☑ Görsel site haritası tanımlı (ya da eklentinin bunu yaptığı doğrulandı)
• ☑ Tüm önemli sayfalarda og:image meta etiketi tanımlı
• ☑ Uygun yerlerde ürün görselleri için yapılandırılmış veri
• ☑ Görseller ilgili metin, resim yazısı ve ara başlıklarla bağlama oturtulmuş

Sıkça sorulan sorular