Görsel Alt Etiketi Kontrolü
Bir sayfanın görsel alt özniteliklerini kontrol edin. Eksik, boş ve yazılmış metinleri kaynak satırları ve açık sınırlarla görün.
Aracı nasıl kullanırsınız?
Sonuçları yorumlamak ve sonraki adımı belirlemek için kullanım rehberi.
Görünürlük’ün Görsel Alt Etiketi Kontrolü aracı, görsellerin HTML alt özelliğini inceleyerek tek bir sayfanın getirilen HTML’sindeki desteklenen görsel öğelerini bulur; eksik alt niteliklerini, boş değerleri ve yazılmış metinleri ayırır. Kaynak bilgileriyle düzenleme listesi hazırlayıp her görselin sayfaya ne kattığını değerlendirin. Araç nitelikleri bulur; görselin piksellerini incelemez, açıklama üretmez veya sayfanın erişilebilir olduğunu belgelemez.
Görselleri içeren sayfayı kontrol edin
Fotoğraf veya başka bir görsel dosyasının adresi yerine herkese açık bir HTTP/HTTPS sayfa URL’si girin. Kaynak okunabilir HTML döndürmelidir. Ürün galerisi için galerinin bulunduğu ürün sayfasını kontrol edin. Görsel dosyasını tek başına kontrol etmek, kullanıldığı yerde ona hangi alternatif metnin atandığını göstermez.
Rapor, img etiketlerini ve type="image" olan input alanlarını inceler. JavaScript çalıştırmadan HTML yanıtını kullanır. Yalnızca script sonrasında eklenen görseller görünmeyebilir; CSS arka planları ve satır içi SVG’ler de bu listenin dışındadır.
En fazla 1.000 görsel satırı tutulur, uzun kanıtlar kısaltılabilir. Sayılar benzersiz görsel dosyalarını değil, görsellerin sayfada kaç kez kullanıldığını gösterir. Aynı fotoğraf iki kez kullanılıyorsa raporda iki ayrı satır görünür; görselin her kullanımda farklı bir işlevi olabilir. Kısmi kapsam uyarısını okuyun: saklanan liste büyük veya dinamik sayfadaki bütün görselleri temsil etmez. Desteklenen öğe bulunamaması, ekranda hiç görsel olmadığını kanıtlamaz.
Eksik, boş ve yazılmış alt metinlerini ayırın
Filtrelerle kategorileri sırayla inceleyin. Eksik, öğede alt niteliği bulunmadığını belirtir. Boş, nitelik mevcut olsa da anlamlı metin içermediğini; yalnızca boşluk içeren değerleri de kapsar. Yazılmış metin ise alanın dolu olduğunu söyler; açıklamanın doğru, yararlı veya ekran okuyucuya uygun olduğunu göstermez.
Önce eksik alanları, ardından boş değerleri bağlamıyla inceleyin. W3C WAI dekoratif görsel rehberi, bilgi katmayan görselde boş alternatifin neden uygun olabileceğini açıklar. Niteliği kaldırmakla boş nitelik yazmak farklıdır. Dolu metin sayısını artırmak için her boş değeri doldurmayın.
Öğeyi şablonda veya CMS çıktısında bulmak için görsel kaynağı ve HTML satırını kullanın. Araç .jpg ile biten açıklama gibi bazı dosya adına benzeyen değerleri de işaretler. Bu, inceleme ipucudur; tam dil kalitesi değerlendirmesi değildir. Genel, yanlış veya tekrarlı ifadeler bu dar kontrolden geçip yine düzenleme gerektirebilir.
Alternatif metni görselin görevine göre seçin
Görseli göremeyen kişinin hangi bilgiyi kaçıracağını düşünün. W3C WAI alt karar ağacı, bilgilendirici, dekoratif ve işlevsel kullanımları ayırır. Aynı dosyanın farklı sayfalarda farklı ele alınması gerekebilir; çevresindeki metin ve amacı değişir.
Bu örnekler editoryal kararları gösterir. İfadeler ancak görsel ve bağlam gerçekten böyleyse uygundur; araç bu görselleri incelemiş değildir.
| Görselin görevi | Olası yaklaşım | Doğrulanacak koşul |
|---|---|---|
| Ayrıntı gösteren ürün fotoğrafı | “Önde iki fermuarlı cebi olan mavi sırt çantası” | Ayrıntılar doğru olmalı ve ürün seçimine katkı sağlamalı |
| Dekoratif ayırıcı | Boş alt niteliği | Ayırıcı bilgi veya işlev katmamalı |
| Tek başına ana sayfaya bağlanan logo | “Örnek Mağaza ana sayfa” | Görsel bağlantının tek içeriği ve hedefi ana sayfa olmalı |
| Önemli değerler içeren grafik | Kısa alternatif ve yakınında açıklama veya veri tablosu | Temel sonuç ve değerler grafiği görmeden anlaşılmalı |
Bağlantılı görsel veya görsel düğmede işlev aksi hâlde anlaşılmıyorsa hedefi ya da eylemi açıklayın. İşlevi, simgenin şeklinin açıklamasıyla değiştirmeyin. Karmaşık grafikte bütün veri kümesini tek niteliğe doldurmak yerine ayrıntıları sayfa içinde verin.
Google görsel rehberi, yararlı ve bağlama uygun alternatif metni önerir; anahtar kelime doldurmaya karşı uyarır. İlgili anlamı doğal anlatın. Hedef kelime listesi açıklamanın yerine geçmez, alanı doldurmak da görsel arama sıralamasını garanti etmez.
Kaynağı düzeltip yayımlanan sayfayı inceleyin
İlgili öğeyi üreten alanı veya bileşeni düzeltin. Şablon açıklamayı alt niteliğine koymuyorsa CMS medya açıklaması tek başına işe yaramaz. Sorun tekrarlanan kart veya galerilerde görünüyorsa tekil kayıtlarla birlikte ortak bileşeni de inceleyin. Her açıklamayı site genelinde aynı varsayılan metinle değiştirmeyin.
Düzeltmeyi yayımlayıp aynı sayfa URL’sini tekrar kontrol edin. Beklenen niteliğin dönen HTML’ye ulaştığını doğrulayın, sonra görünür sayfayı ve çevre metnini inceleyin. Bilinçli boş alternatifleri koruyun; bilgilendirici ve işlevsel görsellerin doğru anlamı verdiğine bakın. Amaç sadece dolu değerlerden oluşan rapor değil, kullanılabilir içeriktir.
Listede bulunmayan önemli grafikleri ve JavaScript sonrası davranışları elle inceleyin. Tam erişilebilirlik değerlendirmesi bu nitelik kontrolünden fazlasını gerektirir. Diğer sayfa sinyalleri için On-Page SEO Analizi, belge başlık düzeni için H1–H6 Başlık Analizi kullanabilirsiniz. Bu ek kontroller de tek başına sayfanın tamamen erişilebilir olduğunu onaylamaz.
Hangi URL’yi girmeliyim?
Herkese açık tek bir HTTP veya HTTPS sayfa URL’si girin. Kaynak HTML döndürmelidir; yalnızca görsel dosyası kabul edilmez.
Boş alt özniteliği hata mı?
Her zaman değil. Dekoratif görseller genellikle boş öznitelik gerektirir; anlamlı veya işlevsel görseller ise bağlama uygun metin ister.
Ekrandaki her görsel kontrol edilir mi?
Hayır. JavaScript çalıştırılmadan alınan HTML kontrol edilir ve en fazla 1.000 desteklenen görsel öğesi saklanır. Kısmi kapsam belirtilir.
Eksik alt ile boş alt arasındaki fark nedir?
Eksik, alt özniteliğinin bulunmadığını belirtir. Boş, alt="" bulunduğunu belirtir ve dekoratif görseller için doğru olabilir. Görselin amacını inceleyin.
Faydalı alt metni nasıl yazmalıyım?
Görselin bağlamdaki anlamını anlatın. Bağlantı veya buton olarak kullanılan görselde hedefi ya da eylemi açıklayın. Anahtar kelime doldurmaktan kaçının.
