Boş alt ve Gizli Dekoratif Görsel
Ekran okuyucuların atlaması için alt değerini boş bırakın.
Boş alt ve Gizli Dekoratif Görsel, CoddyKit'te ücretsiz bir Web Accessibility Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Web Accessibility Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Web Accessibility Academy kursu toplamda 4 dersten oluşur.
Bu dersin bazı bölümleri henüz çevrilmemiş olup İngilizce olarak gösterilmektedir.
The Empty alt Trick
For decorative images, the right move is an empty alt: write alt equals two quotation marks with nothing inside.
<img src="flourish.png" alt="">What Empty alt Does
An empty alt marks the image as decorative, so screen readers skip it completely and never announce it.
Empty Is Not Missing
Empty alt and a missing alt are totally different. Empty means skip me on purpose; missing means the author forgot.
What Missing alt Causes
With no alt at all, many screen readers fall back to reading the file name aloud, like IMG underscore 4823 dot jpg.
Always Include the Attribute
The rule is simple: every img needs an alt attribute. The only question is whether it is empty or filled.
Spacers and Dividers
Visual spacers, lines, and dividers carry no meaning, so they are textbook cases for an empty alt.
<img src="line.png" alt="">Avoid Whitespace Inside
Do not put a space between the quotes. A real empty alt has nothing inside, not even a single blank character.
Better Yet, Use CSS
If an image is truly decorative, often the cleanest fix is a CSS background image, which the accessibility tree ignores entirely.
Hiding With aria-hidden
You can also hide a decorative graphic with aria-hidden set to true, common for inline SVG icons beside visible text.
<svg aria-hidden="true"><use href="#star"></use></svg>Do Not Hide Real Content
Be careful: never put an empty alt or aria-hidden on an informative image, or you silently delete it for some users.
When Decoration Is a Link
If a decorative image sits inside a link, the link still needs accessible text somewhere, or it becomes unnamed.
Quick Check
Spot the difference that matters.
Recap
Well done! Empty alt intentionally hides decoration, missing alt is a bug, and aria-hidden or CSS backgrounds also keep ornament quiet.
Sıkça Sorulan Sorular
“Boş alt ve Gizli Dekoratif Görsel” dersi ücretsiz mi?
Evet — “Boş alt ve Gizli Dekoratif Görsel” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Web Accessibility Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Web Accessibility Academy kursu toplamda 4 dersten oluşur.
“Boş alt ve Gizli Dekoratif Görsel” dersinde ne öğreneceğim?
Ekran okuyucuların atlaması için alt değerini boş bırakın. Web Accessibility Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Web Accessibility Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Web Accessibility Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.
“Boş alt ve Gizli Dekoratif Görsel” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Web Accessibility Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Web Accessibility Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Bilgilendirici ve Dekoratif: İlk Karar
- Pikselleri Değil Amacı İfade Eden Alt Metin Yazma
- Boş alt ve Gizli Dekoratif Görsel
- Karmaşık Görseller: Grafikler, Haritalar ve Uzun Açıklamalar