Setelah tahu bahwa alt wajib, pertanyaan berikutnya lebih sulit: apa yang sebaiknya ditulis di dalamnya. Menulis alternative text adalah keahlian menulis, bukan sekadar keahlian sintaks. Aturan praktisnya satu: deskripsikan fungsi atau makna gambar pada konteks halaman — bukan penampilan pikselnya.
Deskripsikan Fungsi, Bukan Tampilan #
Cara kerjanya berpangkal pada pertanyaan: apa tujuan gambar ini berada di halaman? Logo menjawab identitas, jadi alt yang tepat adalah nama situsnya — “Kedai Kopi Siti”, bukan “lingkaran cokelat bertuliskan putih”. Grafik penjualan menjawab tren, jadi isinya “Penjualan naik tiga bulan berturut-turut”, bukan “diagram batang warna biru”. Foto orang dalam artikel menjawab siapa dan sedang melakukan apa — “Siti menuangkan susu ke gelas espresso”, bukan “foto orang”.
Alasannya melekat pada mekanisme pembaca layar: alat itu membacakan halaman berurutan seperti teks. Pengguna alt yang mendeskripsikan penampilan memaksa mereka mendengar detail yang tidak relevan, sementara informasi yang sebenarnya dicari — nama, tren, aksi — tidak pernah disebut.
Konteks Menentukan Isi alt #
Jenis gambar yang sama bisa membutuhkan isi alt yang berbeda bergantung perannya. Tabel berikut memetakan pertanyaan kunci per jenis:
| Jenis gambar | Pertanyaan kunci | Contoh alt yang tepat |
|---|---|---|
| Logo kedai | Siapa pemilik identitasnya? | Kedai Kopi Siti |
| Foto orang | Siapa dan sedang melakukan apa? | Siti menuangkan susu ke gelas espresso |
| Grafik penjualan | Tren apa yang ditunjukkan? | Grafik penjualan naik tiga bulan berturut-turut |
| Ikon pada tombol | Aksi apa yang tersedia? | Cari |
| Garis dan ornamen hias | Apakah membawa informasi? | alt="" — sengaja kosong |
Panjang yang Wajar #
Aturan panjangnya: ringkas, secara praktik di bawah 125 karakter. Sejumlah pembaca layar memotong bacaan yang lebih panjang, dan pengunjung yang mendengarkannya kehilangan arah di tengah kalimat yang berlarat.
Diagram kompleks adalah pengecualian yang perlu strategi khusus: grafik dengan banyak seri tidak muat dalam satu kalimat. Ringkas tren utamanya di alt — “Grafik tren penjualan tiga cabang selama 2025” — lalu letakkan deskripsi lengkapnya sebagai teks atau tabel terdekat pada halaman, sehingga pembaca yang membutuhkan detail tetap menjangkaunya.
Latihan Memperbaiki alt yang Kurang Tepat #
Empat kasus berikut adalah pola yang paling sering kita temui. Bandingkan versi kurang tepat dengan perbaikannya:
alt kurang tepat | Perbaikan | Alasan |
|---|---|---|
IMG_2041.jpg | Seduh kopi tubruk dalam gelas bening | Nama berkas bukan deskripsi |
foto orang | Dewi menimbang biji kopi di meja sortasi | Tidak menjawab siapa dan sedang apa |
gambar panah | Rute bus menuju Kedai Kopi Siti | Fungsi panah adalah menunjukkan rute |
grafik | Penjualan Desember tertinggi sepanjang tahun | Trennya adalah informasinya |
Bentuk penulisan yang keliru dan perbaikannya dalam kode:
<img src="assets/latihan.jpg" alt="IMG_2041.jpg"><img src="assets/latihan.jpg" alt="Dewi menimbang biji kopi di meja sortasi">Kedua variasi berikut sengaja memakai berkas yang sama-sama gagal termuat — perhatikan bahwa hanya gambar pertama yang masih menyampaikan informasinya:
Saat gambarnya sehat, keduanya tampil sama persis — perbedaannya baru terasa pada momen gagal termuat seperti di atas, dan saat pembaca layar membacakan halamannya. Ingat pembatasnya: alt="" yang sengaja kosong tepat untuk gambar dekoratif; pada gambar informatif seperti latihan ini, alt kosong berarti informasinya hilang sepenuhnya.
Ringkasan #
- Isi
altmendeskripsikan fungsi dan makna gambar pada konteksnya, bukan penampilan visualnya. - Konteks menentukan isi: logo berisi nama, grafik berisi tren, foto orang berisi siapa dan aksinya.
- Jaga panjang di bawah 125 karakter; diagram kompleks memakai deskripsi panjang di teks terdekat.
- Gambar hias memakai
alt=""agar dilewati pembaca layar.
Kualitas teks pengganti sudah kita urus; chapter berikutnya kembali ke urusan tampilan — menyiapkan ruang gambar sebelum berkasnya tiba.