Cara menggunakan Pengecek Alt Gambar
- Masukkan URL halaman lalu klik Cek gambar.
- Baca ringkasannya: gambar tanpa alt text, file berukuran besar, dimensi yang belum diisi, dan URL yang rusak.
- Gunakan filter untuk menampilkan hanya gambar bermasalah, lalu perbaiki di CMS atau kode kamu.
- Klik Ekspor CSV untuk memberikan daftar ini ke tim konten atau pengembang.
Apa itu pengecek alt gambar?
Pengecek alt gambar memindai halaman web untuk elemen <img> dan menampilkan atribut alt dari setiap gambar, beserta detail teknis yang memengaruhi SEO dan performa. Alt text (teks alternatif) dibacakan oleh pembaca layar, ditampilkan saat gambar gagal dimuat, dan dipakai mesin pencari untuk memahami isi gambar. Hal ini penting untuk Google Images dan relevansi halaman itu sendiri.
Alt hilang vs. alt kosong
Kedua kasus ini tampak mirip tetapi artinya sangat berbeda:
| Markup | Arti | Penilaian |
|---|---|---|
<img src="team.jpg"> | Tidak ada atribut alt. Pembaca layar mungkin membacakan nama file sebagai gantinya. | Error — selalu tambahkan atribut alt. |
<img src="divider.svg" alt=""> | Alt kosong: gambar bersifat dekoratif dan pembaca layar melewatinya. | Benar untuk gambar murni dekoratif. |
<img src="team.jpg" alt="Tim dukungan kami yang beranggotakan lima orang di kantor Berlin"> | Alt text deskriptif. | Benar untuk gambar informatif. |
Ini mengikuti kriteria keberhasilan WCAG 1.1.1 (Non-text Content). Alt text yang baik menjelaskan fungsi gambar dalam konteksnya, singkat (sekitar 125 karakter adalah pedoman umum), dan tidak diawali dengan “gambar dari”. Jangan memasukkan kata kunci secara berlebihan; jelaskan apa yang ditampilkan, dan kata-kata yang relevan biasanya muncul dengan sendirinya.
Cek performa
- Ukuran file: kami mengirim permintaan HEAD untuk hingga 40 gambar dan membaca
Content-Length-nya. Gambar di atas 200 KB ditandai karena memperlambat Largest Contentful Paint, terutama di perangkat seluler. Kompres dengan Image Compressor atau ubah ukurannya dengan Image Resizer. - Atribut lebar dan tinggi: tanpa atribut ini browser tidak bisa menyiapkan ruang sebelum gambar dimuat, sehingga konten bergeser. Ini diukur sebagai Cumulative Layout Shift (CLS), salah satu Core Web Vitals.
- Format modern: WebP dan AVIF biasanya jauh lebih kecil daripada JPEG atau PNG pada kualitas serupa; SVG ideal untuk logo dan ikon.
- Lazy loading:
loading="lazy"menunda gambar yang berada di luar layar. Jangan gunakan lazy-load pada gambar utama di bagian atas halaman karena itu memperlambat LCP. - Gambar rusak: URL yang merespons 4xx/5xx membuang crawl budget dan menampilkan ikon rusak kepada pengguna.
Pengecek ini membaca tag <img> di HTML hasil render server; gambar latar CSS dan gambar yang disisipkan JavaScript tidak disertakan. Untuk gambaran on-page yang lengkap, jalankan SEO Checker.
Juga dicari sebagai: cek alt text gambar, alt tag checker, alt text hilang, seo gambar, audit gambar, aksesibilitas gambar, cek ukuran gambar, atribut alt.
Tool yang cocok dipakai bersama Pengecek Alt Gambar
- Uji Kecepatan Halaman — Jalankan Google Lighthouse pada URL apa pun untuk tampilan mobile atau desktop.
- Heading Checker — Lihat outline heading dari halaman mana pun.
- Penjelas robots.txt — Aturan robots.txt memang pendek, tapi mudah salah dibaca.
- IndexNow Submitter — Beri tahu mesin pencari tentang halaman baru dan yang diperbarui secara instan.
Pertanyaan yang sering diajukan
Apakah semua gambar perlu alt text?
alt. Gambar informatif membutuhkan teks deskriptif; gambar murni dekoratif (spacer, hiasan latar) sebaiknya memakai alt="" kosong agar pembaca layar melewatinya.Apakah alt text membantu SEO?
Mengapa ukuran file hanya ditampilkan untuk sebagian gambar?
Berapa ukuran file gambar yang ideal?
Apakah atribut title bisa menggantikan alt?
title menampilkan tooltip saat kursor diarahkan dan tidak selalu dibacakan oleh pembaca layar. Selalu gunakan alt.