İletişim

Alt Metni (Alt Text) Nedir?

Kısa tanım

Alt metni, HTML'deki bir görselin alt özniteliğine (alt attribute) yazılan ve görseli göremeyen biri için onun yerine geçen kısa metindir. Öncelikle ekran okuyucu kullanan ziyaretçiler ve görselin yüklenemediği durumlar için yazılır; arama motorları da görselin konusunu anlamak için bu metinden yararlanır. Yalnızca süs amaçlı görsellerde alt özniteliği boş bırakılır (alt="").

Diğer adları: alt etiketi, alt özniteliği, alternatif metin, image alt attribute, alt tag, alt text

img etiketindeki alt metninin ekran okuyucuya, görsel aramaya ve görsel yüklenmezse yedek metne aktarıldığını gösteren şema

Önce erişilebilirlik: alt metni kimin için yazılır?

Alt metninin ilk okuru, sayfayı ekran okuyucuyla dinleyen ziyaretçidir. Ekran okuyucu bir <img> öğesine geldiğinde görselin kendisini değil, alt özniteliğindeki metni seslendirir. WCAG'nin 1.1.1 "Metin Dışı İçerik" başarı ölçütü (A düzeyi) bu yüzden kullanıcıya sunulan her metin dışı içeriğin aynı amaca hizmet eden bir metin alternatifi olmasını ister; dekoratif öğeler, CAPTCHA ve kontroller gibi istisnalar ayrıca tanımlanmıştır. Alt metni aynı zamanda görsel yüklenemediğinde, yavaş bağlantıda ya da görseller kapatıldığında tarayıcının gösterdiği metindir.

Bu nedenle alt metni bir SEO alanı olarak değil, web erişilebilirliğinin temel parçası olarak ele alınmalıdır. Arama motorlarına faydası, iyi yazılmış bir erişilebilirlik metninin doğal yan etkisidir.

İyi bir alt metni görselin işlevini anlatır

Doğru alt metni, görselin o sayfada ne işe yaradığına göre değişir. Aynı fotoğraf bir ürün sayfasında ürünü, bir haber yazısında olayı anlatıyor olabilir. Kendinize şunu sorun: "Bu görseli telefonda birine okusam, sayfayı anlaması için ne söylemem gerekir?"

BağlamZayıf alt metniDaha iyi alt metni
Ürün fotoğrafıgömlekLacivert keten gömlek, düğmeli yaka, önden görünüm
Bağlantı olan logologo.pngŞirket adı – ana sayfa
Süreç şemasışemaSipariş, paketleme ve teslimat adımlarından oluşan kargo süreci
Ekip fotoğrafıresimProje ekibi ofiste bir planlama toplantısında

"Resim", "görsel", "fotoğraf" gibi sözcükleri başa eklemeye gerek yoktur; ekran okuyucu bunun bir görsel olduğunu zaten bildirir. Görselin hemen altındaki açıklama yazısını (caption) kelimesi kelimesine tekrarlamak da aynı bilgiyi iki kez okutur. Karmaşık grafiklerde alt metni kısa bir özet verir, verinin ayrıntısı ise sayfadaki metinde ya da bir tabloda bulunur.

Dekoratif görseller: boş alt, eksik alt değildir

Ayraç çizgileri, arka plan desenleri ya da yanındaki metni tekrar eden ikonlar bilgi taşımaz. Bunlar için alt özniteliği yazılır ama içi boş bırakılır; böylece yardımcı teknolojiler görseli tamamen atlar. Özniteliği hiç yazmamak ise farklı bir sonuç doğurur: W3C'nin dekoratif görseller rehberine göre alt yoksa bazı ekran okuyucular görselin dosya adını okur.

<!-- Bilgi taşıyan görsel -->
<img src="kargo-sureci.png" alt="Sipariş, paketleme ve teslimat adımlarından oluşan kargo süreci">

<!-- Dekoratif ayraç: alt var ama boş -->
<img src="dalga.svg" alt="">

<!-- Hatalı: alt özniteliği hiç yok -->
<img src="dalga.svg">

Tamamen süs amaçlı görseller CSS arka planı olarak da verilebilir; o durumda HTML'de bir <img> öğesi oluşmaz.

Görsel aramada ve bağlantılarda oynadığı rol

Google, görsel SEO dokümantasyonunda alt metnini bilgisayarlı görü algoritmaları ve sayfanın içeriğiyle birlikte görselin konusunu anlamak için kullandığını belirtir. Bir görsel bağlantı olarak kullanıldığında alt metni, metin bağlantılarındaki anchor text gibi hedef sayfanın neyle ilgili olduğunu anlatır. Aynı belge alt özniteliğini anahtar kelimelerle doldurmanın kötü bir kullanıcı deneyimi yarattığını ve sitenin spam olarak görülmesine yol açabileceğini açıkça yazar; bu, anahtar kelime doldurmanın görsellerdeki biçimidir. Dosya adı, boyut, format ve yakın metin gibi diğer sinyaller görsel SEO maddesinde ele alınıyor.

Bir sitede alt metni denetlenirken

  • Eksik alt: İçerik taşıyan görsellerde alt özniteliğinin hiç olmaması.
  • Dosya adı ya da kamera numarası: IMG_1234.jpg gibi değerler ne kullanıcıya ne arama motoruna bir şey anlatır.
  • Her görselde aynı metin: Bir ürün galerisindeki on görselin hepsinde ürün adının yazması, görseller arasındaki farkı kaybettirir.
  • Bağlamdan kopuk varsayılan metin: CMS'lerin medya kütüphanesine kaydedilen alt metni, görselin kullanıldığı her sayfaya uymayabilir.
  • Çevrilmemiş alt metni: Çok dilli sitelerde görseller ortak olsa da alt metni her dilde ayrı yazılmalıdır.

Alt metni eksik, boş ya da dosya adı olan görselleri sayfa bazında görmek için SEO Analiz Aracı kullanılabilir; boş alt'ın gerçekten dekoratif bir görsele ait olup olmadığına ise yine bir insanın karar vermesi gerekir.

İlgili terimler

← Sözlüğe dön