WordPress’te Görsel Alt Metni ve Başlık: Eksiksiz Teknik Kılavuz

WordPress’te resim alt metni ile title öznitelikleri arasındaki farkı anlamak, hem arama motoru optimizasyonu hem de web erişilebilirlik uyumluluğu açısından son derece önemlidir. Alt metni, resim içeriğini ekran okuyuculara ve arama motoru tarayıcılarına açıklayan, dizinleme ve sıralamaları doğrudan etkileyen bir HTML özniteliğidir. Title özniteliği ise bazı tarayıcıların üzerine gelindiğinde araç ipucu olarak gösterdiği isteğe bağlı bir etiket olup ölçülebilir bir SEO ağırlığı taşımaz.

Bu iki alan sıklıkla karıştırılmakta, yanlış kullanılmakta ya da tamamen boş bırakılmaktadır; bu durum organik görünürlüğü sessiz sedasız aşındırmakta, WCAG erişilebilirlik standartlarını karşılamamakta ve yapılandırılmış verileri eksik bırakmaktadır. Bu kılavuz, teknik ayrımı, doğru uygulamayı, gerçek dünya sınır durumlarını ve optimize edilmiş resimlerinizin kullanıcılara ne kadar hızlı ulaştığını etkileyen sunucu tarafı bağlamını ele almaktadır.

WordPress’te Resim Alt Metni Nedir?

Alt metni (HTML’deki alt özniteliği), HTML 2.0 spesifikasyonunda tanıtılmış olup o tarihten bu yana <img> öğelerinde zorunlu bir öznitelik olarak yer almaktadır. Temel işlevi, görsel içeriğin algılanamadığı durumlarda — resim yüklenemediğinde, kullanıcı bir ekran okuyucu kullandığında ya da istemci görsel işleme kapasitesi olmayan bir arama motoru tarayıcısı olduğunda — resim için metinsel bir alternatif sunmaktır.

İşlenmiş HTML şu şekilde görünür:

<img src="golden-retriever-ball.jpg" alt="Golden retriever playing with a red ball on a grass lawn" title="Playful Golden Retriever">

Alt Metninin SEO Açısından Önemi

Google’ın resim dizinleme süreci büyük ölçüde alt özniteliğine dayanmaktadır. Google’ın kendi Search Central belgelerine göre alt metni, resim arama sıralaması için en güçlü sayfa içi sinyallerden biridir. Googlebot bir sayfayı taradığında resimleri bir insan gibi “göremez” — resmin ne gösterdiğini anlamak için alt özniteliğini okur, ardından bu açıklamayı çevresindeki metin, sayfa başlığı ve yapılandırılmış verilerle karşılaştırır.

Pratik SEO etkileri şunlardır:

• Google Resim Arama görünürlüğü: Açıklayıcı ve anahtar kelime içeren alt metne sahip sayfalar, resim arama sonuçlarında sürekli olarak daha üst sıralarda yer alır ve bu durum önemli miktarda yönlendirme trafiği sağlayabilir.
• Core Web Vitals dolaylı etkisi: Açık width ve height öznitelikleriyle doğru şekilde etiketlenmiş resimler, doğrudan bir sıralama sinyali olan düzen kaymasını (CLS) önler.
• Zengin sonuçlara uygunluk: Doğru alt metne sahip ürün resimleri, Google Alışveriş panellerinde ve görsel arama özelliklerinde görünme olasılığı daha yüksektir.
• AI Overview dahil edilmesi: Google’ın üretken yapay zeka özetleri, metin parçacıklarının yanı sıra giderek daha fazla resim de çekmektedir. Açıklayıcı alt metni, resminizin seçilme olasılığını artırır.

Alt Metninin Erişilebilirlik Açısından Önemi

Web İçeriği Erişilebilirlik Yönergeleri (WCAG) 2.1, Başarı Kriteri 1.1.1 (Metin Dışı İçerik) kapsamında tüm bilgilendirici resimler için anlamlı alt metni zorunlu kılmaktadır. Uyumsuzluk yalnızca bir UX sorunu değildir — Avrupa Erişilebilirlik Yasası kapsamındaki AB ve ADA Başlık III kapsamındaki ABD dahil pek çok yargı bölgesinde erişilemez web siteleri yasal yükümlülükle karşı karşıya kalmaktadır.

JAWS, NVDA ve VoiceOver gibi ekran okuyucular, alt özniteliğini görme engelli kullanıcılara sesli olarak okur. Öznitelik eksikse ekran okuyucu genellikle dosya adını okur — bu da “image underscore 2024 underscore final dash copy dot jpeg” gibi anlamsız ve şaşırtıcı bir çıktı üretir.

Alt Metni İçin Teknik En İyi Uygulamalar

• Özgül ve bağlamsal olun: Görsel olarak neyin mevcut olduğunu ve çevresindeki içerikle neden ilgili olduğunu açıklayın. “Köpek” yetersizdir. “Çeviklik eğitimi sırasında frizbi yakalayan golden retriever” doğrudur.
• Anahtar kelimeleri doğal biçimde entegre edin: Hedef anahtar kelime öbeğiniz resmi gerçekten tanımlıyorsa ekleyin. Resim içeriğini yanlış temsil eden anahtar kelimeleri zorla eklemeyin — Google’ın resim kalite algoritmaları bunu tespit eder.
• 125 karakter yönergesine uyun: Çoğu ekran okuyucu alt metnini yaklaşık 125 karakterde keser. Açıklamaları bu sınır içinde tutun.
• Dekoratif resimlerde boş alt metni kullanın: Bir resim tamamen dekoratifse (arka plan dokusu, ayırıcı grafik), alt="" değerini açıkça ayarlayın. Bu, ekran okuyuculara resmi atlamasını söyler. Dekoratif resimlerde özniteliği hiç çıkarmayın; aksi takdirde ekran okuyucu dosya adına geri döner.
• “Image of” veya “Photo of” ile başlamayın: Ekran okuyucular öğe türünü zaten duyurur. Bu ifadelerle başlamak karakter bütçesini boşa harcar.

WordPress’te Alt Metni Nasıl Eklenir

WordPress, alt metni alanını iki konumda sunar:

Medya Kitaplığı aracılığıyla:

1. WordPress yönetici panosunda Medya > Kitaplık‘a gidin.
2. Ek ayrıntılar panelini açmak için herhangi bir resme tıklayın.
3. Sağ taraftaki kenar çubuğunda Alt Metni alanını bulun.
4. Açıklayıcı metninizi girin ve Güncelle‘ye tıklayın.

Blok Düzenleyici (Gutenberg) aracılığıyla:

1. Bir Resim bloğu ekleyin veya seçin.
2. Sağ taraftaki Blok panelinde, Resim ayarları altındaki Alt metni (alternatif metin) alanını bulun.
3. Alt metnini doğrudan girin. Bu, söz konusu blok örneği için Medya Kitaplığı’nda ayarlanan değerin üzerine yazar.

Klasik Düzenleyici aracılığıyla:

1. Düzenleyici içinde bir resme tıklayın.
2. Düzenle‘yi (kalem simgesi) seçin.
3. Alternatif Metin alanına alt metnini girin.

WordPress’te Resim Title Özniteliği Nedir?

Bir resim öğesindeki title özniteliği, tamamlayıcı bir etiket sağlar. Destekleyen tarayıcılarda — öncelikle Chrome, Firefox ve Edge’in masaüstü sürümlerinde — imleç resmin üzerine getirildiğinde title değeri araç ipucu olarak görüntülenir. Mobil tarayıcılar bunu neredeyse evrensel olarak yok sayar; zira dokunmatik ekranlarda üzerine gelme etkileşimi yoktur.

<img src="server-rack.jpg" alt="1U rack-mounted server with NVMe drives installed" title="NVMe Server Rack">

Title Özniteliğinin Yapmadıkları

Çoğu WordPress kullanıcısının yanlış anlamalar geliştirdiği yer burasıdır:

• Google sıralamalarını etkilemez. Google, resimlerdeki title özniteliğinin sıralama sinyali olarak kullanılmadığını açıkça doğrulamıştır. Anahtar kelimelerle doldurmak sıfır SEO faydası sağlar.
• Çoğu ekran okuyucu tarafından varsayılan olarak okunmaz. NVDA ve JAWS, title özniteliklerini duyuracak şekilde yapılandırılabilir; ancak bu varsayılan davranış değildir. WCAG, title özniteliğini alt metninin yerine kabul etmez.
• Mobilde görüntülenmez. Mobil cihazlar küresel web trafiğinin %60’ından fazlasını oluşturduğundan, yalnızca masaüstünde üzerine gelindiğinde görünen bir araç ipucu kitlenizin azınlığına ulaşır.

Title Özniteliğinin Meşru Kullanım Alanları

Sınırlı kapsamına rağmen title özniteliğinin geçerli kullanım durumları vardır:

• Medya Kitaplığı organizasyonu: WordPress, yükleme sırasında title alanını otomatik olarak dosya adından doldurur. Başlıkları temiz ve açıklayıcı tutmak, özellikle binlerce varlığa sahip sitelerde toplu medya yönetimini önemli ölçüde kolaylaştırır.
• Masaüstü kullanıcıları için tamamlayıcı bağlam: Karmaşık diyagramlar veya grafikler için bir title araç ipucu, görünür sayfa düzenini karmaşıklaştırmadan kısa bir etiket sağlayabilir.
• CMS iş akışı meta verileri: Bazı editoryal iş akışları, title alanını kamuya açık alt metninden ayrı bir dahili referans tanımlayıcısı olarak kullanır.

WordPress’te Title Nasıl Eklenir veya Düzenlenir

Medya Kitaplığı aracılığıyla:

1. Medya > Kitaplık‘a gidin.
2. Ek ayrıntılarını açmak için resme tıklayın.
3. Başlık alanı sağ taraftaki panelin üst kısmında görünür (dosya adından otomatik olarak doldurulur).
4. Gerektiği gibi düzenleyin ve Güncelle‘ye tıklayın.

Blok Düzenleyici aracılığıyla:

Gutenberg blok düzenleyicisi, standart kullanıcı arayüzünde title özniteliğini göstermez. Bunu ayarlamak için blok araç çubuğundaki HTML olarak düzenle seçeneğini kullanarak temel HTML’yi doğrudan düzenlemeniz ya da Image Attributes Pro gibi bir eklenti veya özel blok filtreleri kullanmanız gerekir.

Alt Metni ve Title: Yan Yana Karşılaştırma

Yaygın Hatalar ve Sınır Durumlar

Hata 1: Her İki Alan İçin Aynı Metni Kullanmak

Alt metnini title alanına kopyalamak gereksizdir ve her iki özniteliği de okuyacak şekilde yapılandırılmış ekran okuyucuların aynı açıklamayı iki kez duyurmasına neden olabilir; bu da görme engelli ziyaretçiler için kullanıcı deneyimini olumsuz etkiler.

Hata 2: İşlevsel Resimlerde Alt Metnini Boş Bırakmak

Resim olarak işlenen düğmeler (örn. özel grafik kullanan bir “Gönder” düğmesi), bağlantılı resimler ve infografikler işlevsel veya bilgilendirici resimlerdir — bunların açıklayıcı alt metni olmalıdır. Bunları boş bırakmak bir WCAG başarısızlığı ve taranabilirlik açığıdır.

Hata 3: Alt Metnine Anahtar Kelime Doldurmak

alt="VPS hosting cheap VPS server VPS Moldova best VPS" gibi bir alt özniteliği açık bir spam sinyalidir. Google’ın resim kalite değerlendirici yönergeleri bu kalıbı açıkça işaretler. Resmi doğru şekilde tanımlayan tek bir doğal anahtar kelime öbeği kullanın.

Hata 4: Basit Resimleri Aşırı Açıklamak

Basit bir simge veya logo 120 karakterlik bir açıklama gerektirmez. Bir şirket logosu için alt="AlexHost logo" yeterli ve doğrudur.

Hata 5: Geç Yüklenen Resimlerde Alt Metnini Göz Ardı Etmek

WordPress 5.5, loading="lazy" özniteliği aracılığıyla yerel geç yüklemeyi tanıttı. Bazı kötü yapılandırılmış temalar veya eklentiler, geç yükleme işlemi sırasında alt özniteliğini kaldırır. Alt metninin son DOM’da mevcut olduğunu doğrulamak için yalnızca WordPress düzenleyicisini değil, tarayıcı DevTools veya Screaming Frog gibi bir tarayıcı kullanarak işlenmiş HTML’yi her zaman denetleyin.

Sunucu Tarafı Bağlamı: Barındırma Ortamınız Resim SEO’sunu Nasıl Etkiler

Doğru yazılmış alt metni ve başlıklar, resim SEO performansı için gerekli ancak yeterli değildir. Resimlerinizin tarayıcılara teslim edilme hızı, onaylı bir Google sıralama faktörü olan Core Web Vitals puanlarını doğrudan etkiler.

Resim teslim performansını belirleyen çeşitli sunucu tarafı faktörler şunlardır:

• Depolama G/Ç: NVMe tabanlı depolama, resim dosyaları için ilk bayta kadar geçen süreyi SATA SSD veya dönen HDD’lere kıyasla azaltır. Yüksek trafikli bir WordPress sitesinde bu fark, eş zamanlı istekler altında birikir.
• HTTP/2 ve HTTP/3 desteği: Modern protokoller, çoğullanmış resim teslimine olanak tanıyarak HTTP/1.1’in bağlantı başına ek yükünü ortadan kaldırır.
• Sunucu tarafı WebP dönüşümü: cwebp gibi araçlar veya mod_pagespeed gibi modüller, JPEG ve PNG resimlerini sunucu düzeyinde WebP formatına dönüştürerek kalite kaybı olmaksızın dosya boyutlarını %25-35 oranında azaltabilir.
• Önbellek başlıkları: Uygun Cache-Control ve ETag başlıkları, tarayıcıların ve CDN uç düğümlerinin resimleri agresif biçimde önbelleğe almasını sağlayarak kaynak sunucu yükünü azaltır.

WordPress’i düzgün yapılandırılmış bir VPS Hosting ortamında çalıştırmak, paylaşımlı ortamların sağlayamadığı bu parametreler üzerinde tam kontrol sağlar. nginx‘ı ngx_http_image_filter_module ile kurabilir ve yapılandırabilir, ayrıntılı önbellek TTL’leri ayarlayabilir ve SVG varlıkları için Brotli sıkıştırmasını etkinleştirebilirsiniz.

Birden fazla WordPress mülkünü veya yüksek çözünürlüklü medya kitaplıklarını yöneten ekipler için Dedicated Servers, trafik artışları sırasında tutarsız resim teslim sürelerine neden olan kaynak çekişmesini ortadan kaldırır.

Daha küçük bir site işletiyorsanız ve tanıdık bir kontrol paneliyle yönetilen bir ortam istiyorsanız, VPS with cPanel, doğrudan komut satırı erişimi olmaksızın PHP bellek sınırlarını yapılandırmak, OPcache’i etkinleştirmek ve resim ağırlıklı WordPress kurulumlarını yönetmek için basit bir arayüz sunar.

Ölçekte Alt Metni Uygulamak: Otomasyon ve Denetim

Büyük medya kitaplıklarına sahip siteler için alt metnini manuel olarak denetlemek ve güncellemek pratik değildir. Aşağıdaki yaklaşımlar bunu sistematik biçimde ele alır:

WP-CLI Toplu Denetim

Alt metni eksik tüm resimleri belirlemek için WP-CLI kullanın:

wp post list --post_type=attachment --post_mime_type=image --fields=ID,post_title --format=csv | while IFS=',' read id title; do
  alt=$(wp post meta get "$id" _wp_attachment_image_alt 2>/dev/null)
  if [ -z "$alt" ]; then
    echo "Missing alt text: ID=$id Title=$title"
  fi
done

WP-CLI Aracılığıyla Alt Metni Ayarlama

wp post meta update 1234 _wp_attachment_image_alt "Golden retriever playing with a red ball on a grass lawn"

1234 yerine gerçek ek kimliğini yazın.

Screaming Frog SEO Spider

Screaming Frog’u sitenizi tarayacak şekilde yapılandırın ve Resimler sekmesini Eksik Alt Metni ile filtreleyin. Raporu CSV olarak dışa aktarın ve düzeltme kontrol listesi olarak kullanın. Bu yaklaşım, WordPress düzenleyicisinde ayarlanmış görünse bile işlenmiş HTML’de eksik olan alt metnini yakalar — bu durum, sayfa oluşturucular veya geç yükleme eklentileriyle ortaya çıkabilen bir tutarsızlıktır.

Google Search Console Resim Dizinleme Raporu

Search Console > Arama sonuçları raporu, Arama türü: Resim ile filtrelendiğinde hangi resimlerin gösterim ve tıklama oluşturduğunu ortaya koyar. Yüksek gösterim ancak düşük tıklama oranına sahip resimler genellikle genel veya eksik alt metnine sahiptir. Önceliklendirilmiş bir düzeltme listesi için bu verileri Screaming Frog dışa aktarmanızla çapraz referanslayın.

Yapılandırılmış Veri ve Resimler: Bir Sonraki Katman

Alt metninin ötesinde, resimler için yapılandırılmış veri işaretlemesi (schema.org) uygulamak, arama motorlarına ek bağlam sağlar ve zengin sonuçlara uygunluğu artırır. WordPress için Yoast SEO veya Rank Math eklentileri, doğru yapılandırıldığında gönderi resimlerine otomatik olarak ImageObject şeması ekler.

Doğru uygulanmış bir ImageObject şeması şunları içerir:

{
  "@type": "ImageObject",
  "url": "https://example.com/images/golden-retriever-ball.jpg",
  "width": 1200,
  "height": 800,
  "caption": "Golden retriever playing with a red ball on a grass lawn",
  "name": "Playful Golden Retriever"
}

Şemadaki caption özelliğinin işlevsel olarak alt metnine, name ise title özniteliğine karşılık geldiğini unutmayın. Her ikisi de resim öğesindeki HTML öznitelikleriyle tutarlı olmalıdır.

Karar Kontrol Listesi: Alt Metni ve Title Uygulaması

Resim içeren herhangi bir WordPress sayfası veya gönderisi yayınlamadan önce bu kontrol listesini kullanın:

• Her bilgilendirici resim, 125 karakterin altında açıklayıcı bir alt özniteliğine sahiptir
• Dekoratif resimlerde alt="" (boş, eksik değil) bulunur
• Hiçbir alt metni “Image of,” “Photo of” veya benzeri gereksiz ifadelerle başlamaz
• Alt metni, hedef anahtar kelime öbeğini yalnızca resmi doğru şekilde tanımladığı durumlarda içerir
• Alt metni ve title metni özdeş değildir
• İşlevsel resimler (bağlantılı resimler, resim düğmeleri), görünüşlerini değil eylemlerini açıklayan alt metnine sahiptir
• Resim dosya adları yüklemeden önce açıklayıcıdır (örn. golden-retriever-ball.jpg, IMG_4821.jpg değil)
• CLS’yi önlemek için resim boyutları (width ve height) HTML’de açıkça belirtilmiştir
• İşlenmiş HTML, yalnızca WordPress düzenleyici görünümü değil, DevTools veya bir tarayıcı aracılığıyla doğrulanmıştır
• Yüksek değerli sayfalardaki birincil içerik resimleri için yapılandırılmış veri (ImageObject) uygulanmıştır

SSS

Resim title özniteliği Google resim arama sıralamalarını etkiler mi?

Hayır. Google, <img> öğelerindeki title özniteliğinin sıralama sinyali olarak kullanılmadığını doğrulamıştır. Yalnızca alt özniteliği, çevresindeki metin, sayfa başlığı ve yapılandırılmış veriler resim arama sıralamalarını etkiler.

WordPress’te tamamen dekoratif bir resim için alt metni ne olmalıdır?

alt="" ayarlayın — açıkça boş bir alt özniteliği. Bu, ekran okuyuculara resmi tamamen atlamasını bildirir. Özniteliği çıkarmayın; aksi takdirde ekran okuyucu kullanıcı için anlamsız olan dosya adını okur.

WordPress sitem genelinde birden fazla resimde aynı alt metnini kullanabilir miyim?

Yalnızca resimler gerçekten aynıysa. Farklı resimlerdeki yinelenen alt metni, Google’ın resim dizinleme sistemi tarafından bir kalite sinyali olarak değerlendirilir ve resim arama sonuçlarında resimlerden birinin veya her ikisinin bastırılmasına neden olabilir. Her benzersiz resim, benzersiz ve açıklayıcı bir alt metnine sahip olmalıdır.

Alt metnimin WordPress’te doğru görünmesine rağmen işlenmiş HTML’de neden eksik?

Bu durum genellikle HTML oluşturma sırasında alt özniteliğini kaldıran veya üzerine yazan bir sayfa oluşturucu (Elementor, Divi, WPBakery), geç yükleme eklentisi veya önbellek eklentisinden kaynaklanır. Tarayıcı DevTools (Ctrl+U veya sağ tıklayın > Sayfa Kaynağını Görüntüle) kullanarak canlı işlenmiş kaynağı denetleyin ve WordPress düzenleyicisiyle karşılaştırın. Tutarsızlıklar varsa çakışmayı izole etmek için eklentileri tek tek devre dışı bırakın.

Sunucu performansı resim SEO’suyla nasıl ilişkilidir?

Core Web Vitals metrikleri — özellikle Largest Contentful Paint (LCP) ve Cumulative Layout Shift (CLS) — doğrudan Google sıralama faktörleridir. LCP sıklıkla bir hero resmi tarafından tetiklenir. Sunucunuz yüksek G/Ç gecikmesi veya PHP-FPM çalışanları için yetersiz bellek nedeniyle bu resmi yavaş teslim ediyorsa, alt metniniz ne kadar iyi yazılmış olursa olsun LCP puanınız düşer. WordPress’i NVMe depolama ve yeterli RAM ile performanslı bir VPS Hosting ortamında barındırmak, doğru alt metni uygulamasının yanı sıra güçlü Core Web Vitals puanlarını doğrudan destekler.