Görsel Alt Text Yazma Rehberi
Alt text (alternatif metin veya alt metin), HTML'de alt niteliği ile tanımlanan ve görselin içeriğini metin olarak açıklayan ifadedir. Google Görsel Arama, ekran okuyucular ve görsel yüklenemediğinde kullanıcı deneyimi için kritik öneme sahiptir. Bu rehberde alt metnin ne olduğunu, neden önemli olduğunu, nasıl iyi yazılacağını ve sık yapılan hataları ele alıyoruz.
Alt Text Nedir ve Neden Önemli?
Alt metin, görselin ne gösterdiğini tanımlar. Tarayıcı görseli yükleyemezse bu metin gösterilir. Ekran okuyucu (screen reader) kullanıcıları alt metni seslendirir; görme engelli kullanıcılar böylece görsel içeriğe erişir. Google ve diğer arama motorları alt metni indeksler; görsel arama sonuçlarında ve sayfa anlamsal anlayışında kullanır.
SEO Faydaları
Doğru alt metin, hedef anahtar kelimeleri doğal şekilde içerir. "Erkek kahverengi deri ceket" gibi bir açıklama hem kullanıcıya hem arama motoruna bilgi verir. Anahtar kelime doldurma (keyword stuffing) yapmayın; "erkek ceket ceket deri ceket" gibi metinler spam olarak algılanabilir. Bağlamı yansıtan, özlü açıklamalar hem erişilebilirlik hem SEO için idealdir.
Erişilebilirlik (Ekran Okuyucular)
WCAG (Web Content Accessibility Guidelines) tüm bilgilendirici görsellere alternatif metin sağlanmasını önerir. Ekran okuyucular alt metni kullanıcıya okur; bu yüzden görselin amacını ve içeriğini net yansıtmalıdır. Süs amaçlı görseller için alt="" (boş) kullanın; ekran okuyucu bu görseli atlar. Boş bırakmak yerine "dekoratif görsel" yazmak gereksiz tekrar oluşturur.
İyi Alt Metin Nasıl Yazılır?
Kısa ve öz olun: Genelde 125 karakter veya daha az yeterlidir. Görseli tanımlayın: Ne gösteriyor, önemli detaylar neler? Bağlamı dahil edin: Sayfa konusuyla ilişkisini belirtin. "Görsel", "resim", "fotoğraf" yazmayın: Zaten görsel olduğu bellidir. Anahtar kelimeyi doğal kullanın: Zorlamadan, anlamlı cümle içinde.
Farklı Görsel Türleri İçin Örnekler
Ürün fotoğrafı: "Nike Air Max 270 erkek koşu ayakkabısı siyah beyaz" Blog kapak görseli: "İstanbul Boğazı'nda gün batımı manzarası" Infografik: "2025 yılı web kullanım istatistikleri grafiği" Kişi fotoğrafı: "Ahmet Yılmaz, yazılım geliştirici" Buton / ikon: "Sepete ekle" (buton görseliyse işlevi yazın)
Sık Yapılan Hatalar
Alt metni boş bırakmak (bilgilendirici görsellerde): Google ve erişilebilirlik için kayıp. Anahtar kelime doldurma: Doğal olmayan tekrarlar cezalandırılabilir. Çok uzun metin: Ekran okuyucu kullanıcısı için yorucu. Görselin tekrarı: Zaten sayfada metin varsa "X görseli" yeterli olabilir. Dosya adını alt metin olarak kullanmak: IMG_1234.jpg anlamsızdır.
Alt Text vs Title Niteliği
title niteliği, fare üzerine gelindiğinde tooltip gösterir. Alt metin kadar önemli değildir; Google alt metni indeksler. Title genelde ek bilgi veya bağlam için kullanılır. Her iki niteliği de doldurmak gerekmez; öncelik alt metinde. Title kullanacaksanız alt metni tekrarlamayın.
Süs Amaçlı Görseller — Boş Alt
Dekoratif çizgiler, arka plan desenleri, sayfa düzenini tamamlayan süslemeler bilgi taşımıyorsa alt="" kullanın. Boş alt, ekran okuyucuların bu öğeyi atlamasını sağlar. Niteliği tamamen kaldırmayın; alt="" erişilebilirlik için gerekli işaret olarak kalmalıdır.
E-ticaret Ürün Alt Metni İpuçları
Ürün adı, marka, renk, varyant (beden, model) gibi bilgileri ekleyin. "Mavi kot pantolon 32 beden" yeterli olabilir. Aynı ürünün farklı açılardan fotoğraflarında: "Mavi kot pantolon arka görünüm", "Mavi kot pantolon yakın çekim dikiş detayı" gibi ayırt edici açıklamalar kullanın. Her görselin benzersiz alt metni olmalı; kopyala-yapıştır yapmayın.
Görsellerinizi optimize edin, alt metinlerinizi güçlendirin. WebP sıkıştırma ile sayfa hızını artırın.
Sıkıştırma Aracına Git →