Apa Itu Alt Text? Panduan Lengkap Optimasi Gambar untuk SEO

Alt text adalah deskripsi teks pada gambar yang krusial untuk SEO dan aksesibilitas. Pelajari cara menulis alt text yang benar…

Pernahkah Anda mengunjungi sebuah website, namun gambarnya tidak muncul karena koneksi internet yang lambat? Di posisi gambar tersebut, biasanya muncul sebaris teks singkat yang menjelaskan isi gambar. Teks itulah yang kita kenal sebagai Alt Text.

Bagi pemilik website atau blogger, memahami apa itu alt text adalah langkah fundamental dalam optimasi SEO. Alt text (singkatan dari Alternative Text) bukan sekadar label formalitas. Atribut ini merupakan jembatan komunikasi antara konten visual Anda dengan mesin pencari seperti Google, serta alat bantu aksesibilitas bagi penyandang disabilitas netra.

Tanpa alt text yang dioptimasi dengan baik, gambar-gambar estetik di artikel Anda hanyalah "ruang kosong" di mata bot Google. Sebaliknya, dengan penggunaan teks alternatif yang tepat, Anda tidak hanya meningkatkan peluang gambar muncul di Google Images, tetapi juga memperkuat peringkat artikel secara keseluruhan di halaman hasil pencarian (SERP).

Dalam artikel ini, kita akan mengupas tuntas mulai dari pengertian, fungsi pentingnya bagi SEO, hingga panduan praktis cara menulis deskripsi gambar yang efektif agar website Anda lebih ramah bagi pengguna dan mesin pencari.

Apa itu Alt Text?

Alt text adalah teks deskriptif yang disematkan pada kode HTML sebuah gambar untuk menjelaskan isi atau fungsi gambar tersebut di dalam sebuah halaman web.

Nama resminya adalah alt attribute, namun di kalangan praktisi SEO dan pengembang web, ia lebih sering disebut sebagai alt tag atau teks alternatif.

Tidak seperti caption (keterangan gambar) yang muncul tepat di bawah foto dan bisa dibaca oleh semua pengunjung, alt text umumnya "tersembunyi" di balik layar. Anda hanya bisa melihatnya secara langsung jika:

Gambar gagal dimuat (error atau koneksi lambat).
Anda mengarahkan kursor (pada beberapa browser lama).
Anda memeriksa kode sumber (inspect element) halaman tersebut.

Bagaimana Bentuk Alt Text dalam Kode HTML?

Jika Anda melihat struktur kode sebuah website, alt text diletakkan di dalam tag gambar (<img>). Berikut adalah perbandingannya:

Tag gambar tanpa Alt Text: <img src="kopi-pagi.jpg"> (Mesin pencari hanya tahu ada file gambar, tapi tidak tahu itu gambar apa).
Tag gambar dengan Alt Text: <img src="kopi-pagi.jpg" alt="Secangkir kopi hitam panas dengan uap mengepul di pagi hari"> (Mesin pencari dan screen reader memahami konteks visual gambar tersebut secara detail).

Perbedaan Alt Text, Title Text, dan Caption

Sering kali pengguna tertukar antara ketiga istilah ini saat mengunggah gambar ke website. Agar optimasi Anda tidak keliru, berikut adalah perbedaan mendasarnya:

Alt Text (Teks Alternatif)

Ini adalah elemen yang paling penting untuk SEO dan aksesibilitas. Alt text memberikan deskripsi tekstual tentang apa yang ada di dalam gambar.

Teks ini tidak terlihat secara langsung oleh pengunjung normal, kecuali jika gambar gagal dimuat atau jika pengguna menggunakan alat bantu screen reader.

Title Text (Judul Gambar)

Title text adalah atribut yang memberikan informasi tambahan saat pengunjung mengarahkan kursor (hover) ke atas gambar.

Biasanya akan muncul kotak kecil berisi teks singkat. Meskipun berguna untuk pengalaman pengguna (User Experience), atribut ini tidak memiliki dampak sebesar alt text dalam hal peringkat SEO di Google.

Caption (Keterangan Gambar)

Berbeda dengan alt text, caption adalah teks yang terlihat jelas oleh semua orang tepat di bawah atau di samping gambar.

Fungsinya adalah memberikan konteks langsung atau mencantumkan sumber gambar kepada pembaca artikel. Caption membantu pembaca memahami hubungan gambar dengan isi tulisan secara keseluruhan.

Fungsi Utama Alt Text untuk Website

Menambahkan alt text mungkin terlihat seperti detail kecil yang menyita waktu, terutama jika Anda memiliki banyak gambar dalam satu artikel.

Namun, alt text adalah elemen yang memiliki fungsi vital bagi performa website Anda. Berikut adalah tiga fungsi utamanya:

1. Meningkatkan Aksesibilitas Web (Web Accessibility)

Fungsi yang paling mulia dari alt text adalah menciptakan internet yang inklusif. Bagi tunanetra atau individu dengan gangguan penglihatan, mereka menjelajahi internet menggunakan perangkat lunak yang disebut screen reader.

Alat ini akan membacakan teks yang ada di layar. Ketika screen reader menjumpai gambar, alat tersebut akan membacakan isi alt text-nya.

Tanpa alt text, pengguna tersebut hanya akan mendengar kata "image" atau nama file yang tidak jelas (seperti "IMG_123.jpg"), sehingga mereka kehilangan konteks penting dari konten Anda.

2. Sebagai "Penyelamat" Saat Gambar Gagal Dimuat

Ada kalanya gambar di website Anda tidak muncul. Hal ini bisa terjadi karena beberapa alasan, seperti:

Koneksi internet pengguna yang tidak stabil.
Kesalahan pada server penyimpanan gambar.
File gambar yang terhapus atau tautannya rusak.

Dalam kondisi ini, browser akan menampilkan ikon gambar rusak beserta alt text yang Anda tulis.

Dengan begitu, pembaca tetap bisa memahami informasi apa yang seharusnya ada di posisi tersebut tanpa harus merasa bingung.

3. Membantu Optimasi SEO Gambar

Mesin pencari seperti Google memang semakin pintar, namun mereka tetaplah algoritma komputer yang tidak bisa "melihat" gambar dengan cara yang sama seperti manusia. Google mengandalkan alt text untuk memahami subjek visual dalam sebuah halaman.

Dengan memberikan deskripsi yang relevan, Anda membantu Google mengindeks gambar tersebut dengan benar.

Hal ini membuka peluang besar agar konten Anda muncul di hasil pencarian Google Images, yang sering kali menjadi sumber trafik organik tambahan yang sangat potensial bagi sebuah website.

Mengapa Alt Text Sangat Penting untuk SEO?

Jika Anda bertanya-tapa apakah alt text benar-benar memengaruhi peringkat website, jawabannya adalah ya.

Google secara terang-terangan menyebutkan bahwa alt text digunakan sebagai faktor penentu dalam memahami isi konten.

Berikut adalah alasan teknis mengapa alt text adalah elemen yang tidak boleh dilewatkan dalam strategi SEO On-Page Anda:

1. Membantu Google Memahami Konteks Halaman

Google tidak hanya memeringkat halaman berdasarkan teks yang Anda tulis, tetapi juga berdasarkan relevansi seluruh elemen di dalamnya, termasuk gambar.

Ketika Anda memberikan alt text yang relevan, Anda memberikan sinyal tambahan kepada algoritma Google bahwa konten Anda memang membahas topik tersebut secara mendalam.

Sebagai contoh, jika Anda menulis artikel tentang "Resep Rendang Daging" dan semua gambar Anda memiliki alt text yang mendeskripsikan langkah-langkah memasak rendang, Google akan menganggap halaman Anda jauh lebih kredibel dan relevan.

2. Menjadi Sumber Trafik dari Google Images

Google Images menyumbang porsi besar dalam total pencarian di internet. Banyak pengguna yang mencari solusi atau produk langsung melalui tab gambar.

Tanpa alt text, gambar Anda hampir tidak mungkin muncul di sana. Dengan optimasi yang tepat, gambar Anda bisa menjadi "pintu masuk" kedua bagi pengunjung baru selain melalui pencarian teks biasa.

3. Meningkatkan Struktur Data dan Topikal Authority

Dalam SEO modern, Google mencoba memahami keterkaitan antar kata (semantics). Alt text yang mengandung kata kunci (LSI) membantu memperkuat struktur data halaman Anda.

Catatan Penting: Alt text yang baik membantu Google menghubungkan gambar dengan teks di sekitarnya, sehingga meningkatkan nilai Topical Authority (otoritas topik) website Anda di mata mesin pencari.

4. Berperan dalam Link Building (Khusus Image Link)

Jika Anda menggunakan gambar sebagai tautan (link) ke halaman lain, alt text adalah pengganti anchor text.

Google akan memperlakukan alt text tersebut sebagai teks jangkar yang menjelaskan isi dari halaman tujuan. Ini sangat krusial untuk struktur internal linking yang sehat.

Cara Menulis Alt Text yang Benar dan Efektif

Menulis deskripsi gambar mungkin terlihat sepele, namun ada seni tersendiri untuk membuatnya disukai oleh Google sekaligus berguna bagi pengguna.

Berikut adalah panduan langkah demi langkah agar alt text adalah senjata rahasia SEO Anda:

1. Jadilah Deskriptif dan Spesifik

Bayangkan Anda sedang menjelaskan gambar tersebut kepada seseorang yang tidak bisa melihatnya. Hindari kata-kata umum seperti "gambar" atau "foto".

Sebaliknya, jelaskan apa yang terjadi di dalam gambar tersebut secara mendetail.

Terlalu Umum: alt="kucing"
Lebih Baik: alt="kucing persia putih sedang tidur di sofa biru"

2. Perhatikan Panjang Teks (Usahakan di Bawah 125 Karakter)

Sebagian besar alat bantu screen reader akan berhenti membaca alt text setelah mencapai sekitar 125 karakter.

Oleh karena itu, pastikan deskripsi Anda padat dan jelas. Jangan menulis paragraf panjang di dalam kolom alt text; simpan detail tersebut untuk badan artikel atau caption.

3. Gunakan Kata Kunci Secara Alami (Tanpa Spamming)

Memasukkan kata kunci utama ke dalam alt text sangat disarankan untuk SEO. Namun, jangan melakukan keyword stuffing (memasukkan terlalu banyak kata kunci secara paksa).

Google bisa mendeteksi jika Anda hanya ingin memanipulasi peringkat.

Salah (Spam): alt="sepatu lari murah sepatu lari terbaik jual sepatu lari lari"
Benar: alt="sepatu lari pria merk X warna merah untuk maraton"

4. Hindari Frasa "Gambar dari..." atau "Foto..."

Google dan screen reader sudah tahu bahwa elemen tersebut adalah gambar dari kode HTML-nya (<img>).

Memasukkan kata "gambar" hanya akan membuang-buang kuota karakter Anda. Langsung saja ke inti deskripsinya.

5. Kapan Harus Mengosongkan Alt Text?

Tidak semua gambar butuh deskripsi. Jika sebuah gambar hanya berfungsi sebagai dekorasi (seperti garis pembatas, latar belakang pola, atau ikon hiasan yang tidak menambah informasi), Anda bisa mengosongkan atribut alt-nya atau mengisinya dengan alt="".

Hal ini bertujuan agar screen reader melewati gambar tersebut dan tidak membingungkan pengguna.

Contoh Alt Text yang Baik vs Buruk

Untuk membantu Anda memahami perbedaan antara deskripsi yang ala kadar dengan deskripsi yang dioptimasi untuk SEO, mari kita ambil contoh sebuah gambar yang menunjukkan "Seseorang sedang mengetik di laptop sambil minum kopi".

1. Contoh yang Buruk (Terlalu Singkat)

Alt Text: alt="laptop"

Mengapa Buruk? Deskripsi ini terlalu samar. Ada jutaan gambar laptop di internet, dan teks ini tidak membantu Google maupun pengguna screen reader memahami konteks spesifik dari gambar Anda.

2. Contoh yang Buruk (Keyword Stuffing)

Alt Text: alt="laptop murah laptop terbaik kerja dari rumah kopi enak meja kerja minimalis"

Mengapa Buruk? Ini adalah teknik SEO jadul yang sangat dibenci Google. Mengumpulkan kata kunci tanpa membentuk kalimat yang jelas dianggap sebagai spam dan bisa berisiko buruk bagi reputasi website Anda.

3. Contoh yang Cukup Baik (Deskriptif)

Alt Text: alt="orang mengetik di laptop di samping cangkir kopi"

Mengapa Ini Baik? Ini sudah cukup deskriptif dan memberikan konteks yang jelas tentang apa yang terjadi di dalam gambar.

4. Contoh Terbaik (SEO-Friendly & Informatif)

Alt Text: alt="seorang penulis sedang mengetik artikel di laptop MacBook di atas meja kerja kayu minimalis dengan secangkir kopi hitam"

Mengapa Ini Terbaik? Kalimat ini sangat spesifik, menggunakan kata kunci secara alami ("mengetik artikel", "laptop", "meja kerja"), dan tetap di bawah batas karakter yang disarankan. Deskripsi ini memberikan gambaran visual yang sempurna bagi screen reader dan sinyal relevansi yang kuat bagi Google.

Cara Menambahkan Alt Text di Berbagai Platform

Setelah memahami teorinya, sekarang saatnya mempraktikkannya. Setiap platform memiliki cara yang sedikit berbeda untuk mengakses kolom alt text. Berikut adalah panduan langkah demi langkah untuk platform yang paling banyak digunakan:

1. Cara Menambahkan Alt Text di WordPress

WordPress adalah platform yang sangat ramah SEO, dan mereka memudahkan pengisian alt text melalui dua cara:

Melalui Gutenberg Editor (Blok):
1. Klik pada gambar yang sudah Anda masukkan ke dalam postingan.
2. Di sisi kanan layar, Anda akan melihat panel "Image Settings" (Pengaturan Gambar).
3. Cari kolom bertajuk "Alt Text (Alternative Text)".
4. Masukkan deskripsi gambar Anda di kolom tersebut.
5. Klik "Update" atau "Save".
Melalui Media Library:
1. Klik menu Media > Library di dashboard WordPress Anda.
2. Pilih gambar yang ingin dioptimasi.
3. Di panel rincian gambar sebelah kanan, isi kolom "Alternative Text".
4. WordPress akan menyimpan perubahan ini secara otomatis. Keuntungan cara ini adalah alt text akan muncul secara otomatis setiap kali Anda menggunakan kembali gambar tersebut di artikel lain.

2. Cara Menambahkan Alt Text di Blogger (Blogspot)

Meskipun tampilannya lebih sederhana, Blogger tetap memungkinkan Anda untuk optimasi gambar:

Masuk ke editor postingan Anda dan klik pada gambar yang dimaksud.
Klik ikon "Settings" (ikon roda gigi) yang muncul di menu melayang di bawah atau di atas gambar.
Akan muncul jendela pop-up "Image Settings".
Isi kolom "Alt Text" dengan deskripsi yang sudah Anda siapkan. (Tersedia juga kolom "Title Text" di bawahnya).
Klik "Update".

3. Cara Menambahkan Alt Text Secara Manual (HTML)

Jika Anda menggunakan website custom atau ingin menambahkan alt text langsung melalui kode, Anda hanya perlu menambahkan atribut alt di dalam tag <img>.

Struktur kodenya adalah sebagai berikut: $ <img src="nama-file-gambar.jpg" alt="Deskripsi gambar di sini"> $

Contoh Implementasi: $ <img src="kue-coklat.jpg" alt="Potongan kue coklat lumer dengan taburan kacang hazelnut"> $

Tips Tambahan untuk HTML: Pastikan atribut alt berada di dalam kurung siku tag gambar. Jika gambar tersebut murni dekoratif (seperti garis atau bayangan), gunakan atribut kosong: alt="". Ini memberitahu mesin pembaca layar untuk mengabaikan gambar tersebut.

4. Cara Menambahkan Alt Text di E-commerce (Shopify/Tokopedia/Shopee)

Bagi Anda pemilik toko online, alt text pada foto produk sangatlah krusial untuk mendatangkan pembeli dari Google Images.

Shopify: Klik pada gambar produk di halaman admin, lalu pilih "Add alt text".
Marketplace: Beberapa marketplace besar secara otomatis mengambil alt text dari Judul Produk. Oleh karena itu, pastikan judul produk Anda mengandung kata kunci yang deskriptif dan spesifik.

Dalam dunia SEO yang terus berkembang, detail-detail kecil sering kali menjadi penentu kemenangan di halaman hasil pencarian.

Alt text adalah salah satu detail kecil tersebut yang memiliki dampak besar, baik dari sisi aksesibilitas bagi sesama manusia maupun dari sisi teknis bagi mesin pencari seperti Google.

Dengan menerapkan alt text pada setiap gambar, Anda tidak hanya membantu penyandang disabilitas netra untuk memahami konten Anda, tetapi juga membantu Google mengindeks website Anda dengan jauh lebih baik.

Ingatlah prinsip utamanya: buatlah deskripsi yang jujur, spesifik, dan tetap ringkas.

Jangan biarkan gambar-gambar di website Anda menjadi elemen yang "bisu". Mulailah melakukan audit pada konten lama Anda dan pastikan setiap gambar sudah memiliki alt text yang dioptimasi.

Langkah sederhana ini bisa menjadi kunci untuk meningkatkan trafik organik dan memberikan pengalaman pengguna yang lebih inklusif.

Ingin Optimasi SEO Tanpa Ribet? Konsultasikan dengan Croloze!

Membangun website yang ramah SEO memang membutuhkan ketelitian, mulai dari hal teknis seperti alt text hingga strategi konten yang lebih kompleks.

Jika Anda merasa kewalahan atau tidak memiliki waktu untuk mengelola optimasi website sendirian, Anda tidak perlu khawatir.

Anda bisa mendapatkan bantuan profesional dari Croloze, sebuah digital marketing agency yang berpengalaman dalam membantu bisnis meningkatkan visibilitas mereka di mesin pencari.

Bersama Croloze, strategi SEO website Anda akan ditangani secara menyeluruh mulai dari audit gambar, riset kata kunci, hingga optimasi teknis lainnya untuk memastikan bisnis Anda tampil di baris terdepan hasil pencarian Google.

Jangan biarkan kompetitor mendahului Anda. Hubungi tim ahli di Croloze sekarang dan mulailah perjalanan transformasi digital Anda menuju peringkat teratas! Konsultasi Sekarang Gratis!

Konsultasi Gratis!