# Görsellerin alternatif metni olmalıdır

<https://www.fixreports.com/tr/issues/image-alt>

WCAG 1.1.1 Non-text Content · Seviye A

Görsellerde metin alternatifi eksik; bu yüzden ekran okuyucu kullananlar görsellerin ne gösterdiğini bilemiyor.

## Bu kural neyi kontrol eder
<img> öğelerinin alternatif metni ya da none veya presentation rolü olduğunu denetler.

## Neden önemli
WCAG 1.1.1, anlam taşıyan görseller için bir metin alternatifi ister. Bu olmadan ekran okuyucu kullanan biri, bir fotoğrafın hangi ürünü gösterdiğini anlayamaz.

## Nasıl düzeltilir
### Her web sitesinde
1. İçerik yönetim sisteminizde veya şablonunuzda her görselin alternatif metnine kısa ve belirli bir açıklama ekleyin.
2. Bir müşteri için önemli olanı açıklayın: ürün adı, renk ve gösterilen açı (örneğin “Zeytin yeşili kanvas çanta, önden görünüm”).
3. Dekoratif görsellerde, ekran okuyucuların onları atlaması için boş bir alt özniteliği (alt="") olmalıdır.

### Shopify’da
1. Shopify yönetici panelinde Ürünler > [ürün] > Medya bölümünü açın, her görsele tıklayın ve “Alternatif metin” alanını doldurun. Bölüm görselleri için Online Mağaza > Temalar > Özelleştir bölümünü açın ve görselin alternatif metnini bölüm ayarlarında belirleyin.
2. Bir müşteri için önemli olanı açıklayın: ürün adı, renk ve gösterilen açı (örneğin “Zeytin yeşili kanvas çanta, önden görünüm”).
3. Dekoratif görsellerde, ekran okuyucuların onları atlaması için boş bir alt özniteliği (alt="") olmalıdır.

### WooCommerce ve WordPress’te
1. WordPress’te Ortam > Kütüphane bölümünü açın, her görseli seçin ve “Alternatif metin” alanını doldurun. Ürün galerisi görselleri de aynı alanı kullanır.
2. Bir müşteri için önemli olanı açıklayın: ürün adı, renk ve gösterilen açı (örneğin “Zeytin yeşili kanvas çanta, önden görünüm”).
3. Dekoratif görsellerde, ekran okuyucuların onları atlaması için boş bir alt özniteliği (alt="") olmalıdır.

## Düzeltme nasıl kontrol edilir
- Etkilenen sayfaları yeniden tarayın.
- Ürün görsellerinin nasıl seslendirildiğini duymak için bir ekran okuyucu kullanın (Mac’te VoiceOver: Cmd+F5).

## Kaynaklar
- axe-core kural dokümantasyonu (Deque): https://dequeuniversity.com/rules/axe/4.13/image-alt
- WCAG 1.1.1 açıklaması (W3C): https://www.w3.org/WAI/WCAG22/Understanding/non-text-content