0Pricing
Web Accessibility Academy · Ders

Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır

Önemli bulguyu piksellerle değil, sözcüklerle özetleyin.

Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır, CoddyKit'te ücretsiz bir Web Accessibility Academy dersidir. Bu, 4 dersinin 1. 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.

A Chart Is Just Pixels

To a screen reader, a chart is often a silent image. The insight lives in the picture, so blind users get nothing unless you spell it out in text.

Describe the Point, Not the Paint

Nobody needs to hear about gridlines and axes first. Lead with the takeaway: what does this chart actually tell the reader?

Alt Text for an img Chart

If your chart is an image, its alt attribute should state the conclusion, not say chart. 📊

<img src="sales.png" alt="Sales rose 40% from Q1 to Q4, peaking in December.">

Short Alt, Long Description

A short alt gives the headline. When the data is rich, pair it with a longer description nearby for the full story.

Inline SVG Charts Need Naming

SVG charts are not images by default. Add role="img" plus a name so assistive tech treats the whole graphic as one labeled unit.

<svg role="img" aria-label="Revenue doubled over five years."> ... </svg>

title Inside SVG

A title element as the first child of an SVG also names it. Reference it with aria-labelledby for solid support across screen readers.

<svg role="img" aria-labelledby="t1"><title id="t1">Visitors per month</title></svg>

State the Trend

Most charts exist to show a trend or comparison. Write it in plain words: rising, falling, flat, or one bar towering over the rest.

Name the Extremes

Call out the high and low points by name and value. That single sentence often carries the chart's whole meaning for a listener.

Give Real Numbers

Vague words like a lot help nobody. Include the actual figures so a listener can reason about the data the way a sighted reader does.

A Visible Caption Helps Everyone

Put a short text summary right under the chart as a visible caption. Sighted users skim it too, so it is never wasted effort. ✨

<figure><svg>...</svg><figcaption>Sales climbed steadily all year.</figcaption></figure>

Skip Decorative Sparklines

A tiny decorative spark beside a number adds no new meaning. Hide it with aria-hidden so it does not clutter the listening experience.

<span aria-hidden="true"><svg>...spark...</svg></span> 1,204 users

Quick Check

What should a chart's text alternative lead with?

Recap: Words Over Pixels

You learned that every chart needs a text alternative that states the insight, names extremes with real numbers, and hides purely decorative graphics. 🎯

Sıkça Sorulan Sorular

“Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır” dersi ücretsiz mi?

Evet — “Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır” 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.

“Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır” dersinde ne öğreneceğim?

Önemli bulguyu piksellerle değil, sözcüklerle özetleyin. 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 1. dersidir.

“Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır” 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

  1. Her Grafiğin Bir Metin Alternatifine İhtiyacı Vardır
  2. Veri Tablosu Geri Dönüşü
  3. Renk, Desen ve Doğrudan Etiketler
  4. Klavyeyle Gezinilebilen Etkileşimli Grafikler
← Web Accessibility Academy Sayfasına Dön