Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang
Tangani gambar yang membutuhkan lebih dari frasa singkat.
Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang adalah pelajaran Web Accessibility Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Web Accessibility Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Web Accessibility Academy mencakup 4 pelajaran total.
Saat Alt Tidak Cukup
Beberapa gambar memuat terlalu banyak informasi untuk dirangkum dalam frasa singkat. Bagan, peta, dan diagram memerlukan rencana deskripsi yang lebih panjang.
Mulailah dengan Alt Singkat
Gambar yang kompleks pun tetap mendapatkan alt singkat yang menyebutkan namanya, seperti bagan batang penjualan bulanan tahun 2024.
<img src="chart.png" alt="Bar chart of monthly sales for 2024">Lalu Tambahkan Detailnya
Alt singkat menyebutkan nama gambar; kemudian deskripsi panjang di dekatnya menyampaikan data atau hubungan yang sebenarnya ditampilkan.
Jelaskan Inti Informasinya
Deskripsi panjang yang baik menyampaikan inti informasi, seperti penjualan mencapai puncaknya pada bulan Desember, bukan daftar kering setiap nilai.
Alternatif Berupa Tabel Data
Untuk bagan, alternatif yang sering kali paling kuat adalah tabel HTML sungguhan dengan angka yang sama tepat di bawah grafik.
Menautkan ke Deskripsi
Anda dapat menempatkan deskripsi panjang di halaman dan menghubungkannya dengan aria-describedby yang menunjuk ke id elemennya.
<img src="map.png" alt="Store map" aria-describedby="mapdesc">Figure dan Figcaption
Bungkus gambar dan penjelasan yang terlihat dalam figure dan figcaption agar hubungan keduanya jelas bagi semua orang.
<figure><img src="flow.png" alt="Checkout flow"><figcaption>Three-step checkout</figcaption></figure>Peta Memerlukan Datanya
Gambar peta tidak berguna tanpa fakta yang mendasarinya, jadi sediakan alamat, petunjuk arah, atau daftar sebagai padanan teksnya.
Diagram dan Alur
Untuk diagram alir, jelaskan langkah-langkah dan urutannya dalam prosa agar logikanya tetap dapat dipahami tanpa tata letak visual.
Pastikan Mudah Ditemukan
Pastikan deskripsi panjang mudah ditemukan. Padanan teks tersembunyi yang tidak dapat diakses pengguna sama sekali tidak membantu.
Sesuaikan Upaya dengan Kompleksitas
Semakin kaya informasi dalam gambar, semakin banyak hal yang harus dilakukan oleh padanan teksnya. Biarkan kompleksitas gambar menentukan seberapa banyak Anda menulis.
Pemeriksaan Singkat
Pilih rencana terbaik untuk bagan yang kompleks.
Rangkuman
Anda berhasil! Gambar kompleks mendapatkan alt singkat ditambah padanan teks yang sebenarnya, tabel data, figcaption, atau aria-describedby yang menyampaikan inti informasinya.
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang” gratis?
Ya — teks lengkap “Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Web Accessibility Academy, upgrade ke CoddyKit PRO. Kursus Web Accessibility Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang”?
Tangani gambar yang membutuhkan lebih dari frasa singkat. Kamu berlatih Web Accessibility Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai Web Accessibility Academy?
Tidak diperlukan pengalaman sebelumnya. Web Accessibility Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.
Berapa lama pelajaran “Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran Web Accessibility Academy ini?
Ya. Setiap pelajaran Web Accessibility Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Informatif vs Dekoratif: Keputusan Pertama
- Menulis Alt yang Menyampaikan Tujuan, Bukan Piksel
- alt Kosong dan Gambar Dekoratif Tersembunyi
- Gambar Kompleks: Bagan, Peta, dan Deskripsi Panjang