Gambar merupakan bagian penting dari hampir setiap website modern. Website perusahaan, blog, toko online, portal berita, hingga landing page menggunakan gambar untuk membantu pengguna memahami informasi dengan lebih cepat.

Namun, gambar bukan hanya elemen visual.

Jika dioptimalkan dengan benar, gambar juga dapat membantu SEO, pengalaman pengguna, performa website, accessibility, dan image search visibility.

Google juga dapat memahami gambar berdasarkan berbagai konteks, seperti teks di sekitar gambar, nama file, alt text, struktur halaman, dan data lain yang tersedia.

Inilah yang disebut Image SEO.

Lalu, apa itu Image SEO? Mengapa gambar penting untuk SEO? Bagaimana cara mengoptimalkan gambar di website? Apakah alt text wajib diisi? Format gambar apa yang sebaiknya digunakan? Dan bagaimana agar gambar memiliki peluang muncul di Google Images?

Mari kita bahas secara lengkap.

Apa Itu Image SEO?

Image SEO adalah proses mengoptimalkan gambar pada website agar lebih mudah dipahami oleh search engine, lebih mudah diakses pengguna, memiliki performa yang baik, dan memiliki peluang mendapatkan visibility melalui pencarian gambar.

Image SEO mencakup beberapa aspek:

  • Nama file.
  • Alt text.
  • Format gambar.
  • Ukuran file.
  • Resolusi.
  • Kompresi.
  • Dimensi.
  • Konteks gambar.
  • Caption.
  • Struktur halaman.
  • Lazy loading.
  • Responsive images.
  • Structured data untuk jenis konten tertentu.

Jadi, Image SEO bukan sekadar mengganti nama file gambar.

Image SEO merupakan bagian dari strategi On-Page SEO dan Technical SEO.

Mengapa Image SEO Penting?

Ada beberapa alasan mengapa gambar perlu diperhatikan.

Membantu Search Engine Memahami Gambar

Search engine tidak melihat gambar seperti manusia.

Sistem perlu menggunakan berbagai sinyal untuk memahami apa yang ditampilkan dalam sebuah gambar.

Mendukung Google Images

Gambar yang relevan dan teroptimasi memiliki peluang muncul dalam pencarian gambar.

Meningkatkan User Experience

Gambar dapat membantu pengguna memahami produk, tutorial, data, atau konsep tertentu.

Meningkatkan Accessibility

Alt text membantu pengguna yang menggunakan screen reader memahami konteks gambar.

Membantu Performa Website

Gambar yang terlalu besar dapat membuat halaman menjadi lambat.

Karena itu, Image SEO juga berkaitan dengan performa dan Core Web Vitals.

Bagaimana Google Memahami Gambar?

Google dapat menggunakan berbagai sinyal untuk memahami gambar dan konteksnya.

Beberapa di antaranya:

  • Nama file.
  • Alt text.
  • Teks di sekitar gambar.
  • Caption.
  • Heading.
  • Konten halaman.
  • URL gambar.
  • Structured data dalam konteks tertentu.
  • Informasi visual yang diproses oleh sistem Google.

Karena itu, gambar tidak seharusnya berdiri sendiri.

Konteks halaman sangat penting.

Misalnya sebuah gambar bernama:

sepatu-running-pria.jpg

diletakkan dalam artikel yang membahas sepatu running.

Konteksnya lebih jelas dibandingkan jika gambar yang sama berada pada halaman yang tidak berhubungan dengan sepatu.

Gunakan Nama File yang Deskriptif

Salah satu optimasi sederhana adalah menggunakan nama file yang menjelaskan isi gambar.

Contoh yang kurang baik:

IMG_92831.jpg

DSC00192.png

image-final-new2.jpg

Contoh yang lebih baik:

sepatu-running-pria.jpg

website-company-profile-modern.jpg

dashboard-aplikasi-mobile.jpg

Nama file sebaiknya:

  • Deskriptif.
  • Ringkas.
  • Relevan.
  • Menggunakan kata yang mudah dipahami.

Gunakan tanda hubung untuk memisahkan kata jika diperlukan.

Jangan Memasukkan Keyword Berlebihan

Nama file bukan tempat untuk keyword stuffing.

Contoh buruk:

seo-seo-seo-google-seo-website-seo.jpg

Gunakan nama yang natural:

optimasi-seo-website.jpg

Tujuannya adalah memberikan konteks, bukan memanipulasi search engine.

Apa Itu Alt Text?

Alt text atau alternative text adalah teks alternatif yang menjelaskan isi atau fungsi sebuah gambar.

Alt text memiliki fungsi penting untuk accessibility.

Jika gambar tidak dapat ditampilkan, alt text dapat menjadi representasi tekstual dari gambar tersebut.

Screen reader juga dapat membacakan alt text kepada pengguna.

Selain itu, alt text dapat membantu search engine memahami konteks gambar.

Contoh Alt Text yang Baik

Misalnya gambar menampilkan dashboard aplikasi e-commerce.

Alt text:

Dashboard aplikasi e-commerce dengan grafik penjualan dan daftar produk

Lebih baik daripada:

gambar dashboard

atau:

dashboard aplikasi e-commerce terbaik murah

Alt text seharusnya deskriptif dan natural.

Apakah Semua Gambar Wajib Memiliki Alt Text?

Tidak selalu.

Gambar yang memiliki fungsi informasional sebaiknya memiliki alt text yang sesuai.

Namun, gambar dekoratif yang tidak memberikan informasi penting dapat menggunakan alt attribute kosong:

alt=""

Tujuannya agar screen reader dapat melewati gambar tersebut.

Jangan memasukkan keyword ke semua gambar hanya karena ingin mendapatkan manfaat SEO.

Alt Text Bukan Caption

Alt text dan caption memiliki fungsi berbeda.

Alt text terutama membantu accessibility dan memberikan representasi tekstual gambar.

Caption merupakan teks yang terlihat oleh pengguna dan memberikan konteks tambahan.

Contohnya:

Alt text:

Grafik perkembangan traffic organik website dari Januari hingga Juni

Caption:

Traffic organik meningkat setelah strategi content cluster diterapkan.

Keduanya dapat digunakan secara bersamaan jika memang relevan.

Gunakan Gambar yang Relevan dengan Konten

Jangan memasukkan gambar hanya untuk memenuhi jumlah visual.

Gambar sebaiknya membantu pengguna:

  • Memahami konsep.
  • Melihat contoh.
  • Membandingkan sesuatu.
  • Mengikuti tutorial.
  • Memahami data.
  • Mengenali produk.

Jika artikel membahas:

Apa Itu Technical SEO?

gambar dapat memperlihatkan ilustrasi struktur website, crawling, indexing, sitemap, atau dashboard SEO.

Gambar yang relevan memiliki nilai lebih besar daripada sekadar gambar dekoratif.

Letakkan Gambar Dekat dengan Konten yang Relevan

Konteks sangat penting.

Misalnya Anda membahas:

Internal Link

kemudian menampilkan screenshot struktur internal link tepat setelah pembahasannya.

Pengguna dan search engine mendapatkan konteks yang lebih jelas.

Jangan meletakkan gambar yang tidak berkaitan jauh dari pembahasan yang seharusnya menjelaskannya.

Gunakan Format Gambar yang Tepat

Format gambar memengaruhi kualitas, ukuran file, dan performa website.

Beberapa format yang umum digunakan:

JPEG

Cocok untuk:

  • Foto.
  • Gambar dengan banyak warna.
  • Photography.

PNG

Cocok untuk:

  • Transparansi.
  • Grafik tertentu.
  • Screenshot.
  • Gambar yang membutuhkan lossless quality.

Namun, PNG sering memiliki ukuran file lebih besar.

WebP

WebP dapat memberikan kompresi yang baik dengan dukungan browser modern yang luas.

Format ini cocok untuk banyak kebutuhan website modern.

AVIF

AVIF merupakan format gambar modern yang dapat memberikan kompresi sangat baik.

Namun, workflow dan kompatibilitas implementasinya perlu diperhatikan sesuai kebutuhan website.

Tidak ada satu format yang wajib digunakan untuk semua gambar.

Pilih berdasarkan jenis gambar dan kebutuhan kualitas.

Kompresi Gambar

Gambar beresolusi tinggi yang tidak dikompresi dapat memiliki ukuran beberapa megabyte.

Jika satu halaman memiliki banyak gambar besar, loading dapat menjadi lambat.

Kompresi membantu mengurangi ukuran file tanpa mengorbankan kualitas secara berlebihan.

Perhatikan keseimbangan:

Quality ↔ File Size ↔ Performance

Jangan mengejar file sekecil mungkin sampai gambar terlihat buruk.

Gunakan Ukuran Gambar yang Sesuai

Jangan mengunggah gambar berukuran:

5000 × 5000 px

jika hanya ditampilkan:

500 × 500 px

Ukuran file dan dimensi yang terlalu besar dapat membuang bandwidth.

Sediakan gambar dengan dimensi yang sesuai dengan kebutuhan tampilan.

Gunakan Responsive Images

Pengguna desktop dan mobile tidak selalu membutuhkan gambar dengan ukuran yang sama.

Website modern dapat menggunakan responsive images agar browser memilih sumber gambar yang sesuai dengan viewport dan kebutuhan perangkat.

Ini membantu:

  • Performance.
  • Bandwidth.
  • Mobile experience.

WordPress modern juga memiliki dukungan responsive image melalui atribut seperti srcset dan sizes.

Apa Itu Lazy Loading?

Lazy loading adalah teknik yang menunda pemuatan resource sampai resource tersebut mendekati area yang akan dilihat pengguna.

Untuk gambar yang berada jauh di bawah halaman, lazy loading dapat membantu mengurangi beban awal.

Namun, jangan menerapkan lazy loading secara sembarangan pada gambar yang berada di bagian paling atas halaman.

Jangan Lazy Load Gambar Utama Secara Berlebihan

Gambar utama atau hero image yang menjadi bagian dari Largest Contentful Paint (LCP) perlu mendapatkan prioritas loading yang tepat.

Jika gambar LCP justru ditunda terlalu lama, performa halaman dapat memburuk.

Jadi:

Below-the-fold image → lazy loading biasanya cocok

Critical above-the-fold image → perlu diprioritaskan

Optimalkan Hero Image

Hero image sering menjadi elemen visual terbesar pada halaman.

Karena itu, perhatikan:

  • Dimensi.
  • Format.
  • Kompresi.
  • Preload jika memang diperlukan.
  • Responsive image.
  • Fetch priority.
  • Rendering.

Jangan menggunakan gambar hero 5 MB jika halaman sebenarnya dapat menggunakan gambar dengan ukuran jauh lebih kecil.

Perhatikan Core Web Vitals

Image optimization sangat berkaitan dengan Core Web Vitals.

Tiga metrik utama:

  • LCP — Largest Contentful Paint
  • INP — Interaction to Next Paint
  • CLS — Cumulative Layout Shift

Gambar dapat memengaruhi terutama LCP dan CLS.

Bagaimana Gambar Mempengaruhi LCP?

Jika elemen terbesar pada halaman adalah gambar hero, gambar tersebut dapat menjadi LCP element.

Jika gambar terlalu besar atau lambat dimuat, nilai LCP dapat memburuk.

Bagaimana Gambar Menyebabkan CLS?

Jika dimensi gambar tidak ditentukan dengan benar, layout dapat bergeser ketika gambar selesai dimuat.

Contohnya:

Pengguna mulai membaca → gambar muncul → konten di bawahnya terdorong ke bawah.

Untuk mengurangi masalah ini, browser perlu mengetahui dimensi atau aspect ratio gambar sejak awal.

Gunakan Width dan Height

Memberikan dimensi gambar membantu browser menyediakan ruang sebelum gambar selesai dimuat.

Contohnya sebuah gambar memiliki rasio:

16:9

Browser dapat menyiapkan ruang sesuai rasio tersebut.

Ini membantu mengurangi layout shift.

Optimalkan Gambar untuk Mobile

Jangan hanya memeriksa gambar di desktop.

Periksa juga:

  • Smartphone.
  • Tablet.
  • Desktop.

Gambar harus:

  • Tidak terlalu besar.
  • Tidak pecah.
  • Tidak terpotong secara tidak sengaja.
  • Tidak menyebabkan horizontal scrolling.
  • Tidak memperlambat loading.

Image SEO untuk E-Commerce

Image SEO sangat penting untuk toko online.

Calon pembeli perlu melihat:

  • Produk.
  • Detail produk.
  • Warna.
  • Material.
  • Ukuran.
  • Sudut pandang.
  • Kondisi produk.

Gunakan gambar yang:

  • Jelas.
  • Berkualitas.
  • Konsisten.
  • Relevan.

Optimalkan juga:

  • File name.
  • Alt text.
  • Image size.
  • Format.
  • Structured data jika relevan.

Image SEO untuk Blog

Blog dapat menggunakan gambar untuk:

  • Menjelaskan konsep.
  • Memberikan ilustrasi.
  • Menampilkan screenshot.
  • Menjelaskan tutorial.
  • Menampilkan diagram.
  • Memberikan contoh.

Jangan hanya menggunakan stock photo dekoratif jika tidak memberikan nilai tambahan.

Gambar yang benar-benar membantu pembaca lebih berguna.

Image SEO untuk Website Jasa

Website jasa dapat menggunakan:

  • Portfolio.
  • Screenshot project.
  • Diagram proses.
  • Before-after.
  • Infografis.
  • Foto tim.
  • Foto kantor.

Contohnya website agency dapat menampilkan screenshot:

Dashboard aplikasi web yang dirancang untuk manajemen penjualan.

Alt text tersebut lebih informatif daripada:

portfolio 1

Gunakan Original Image Jika Memungkinkan

Gambar original dapat memberikan nilai lebih dibandingkan menggunakan stock image yang sama dengan banyak website lain.

Contohnya:

  • Foto produk sendiri.
  • Screenshot aplikasi.
  • Foto project.
  • Diagram buatan sendiri.
  • Infografis original.
  • Studi kasus visual.

Namun, stock image tetap dapat digunakan jika memang sesuai.

Yang penting adalah gambar memiliki fungsi dan konteks yang jelas.

Optimalkan Google Images

Jika ingin mendapatkan visibility melalui Google Images, pastikan gambar berada pada halaman yang:

  • Relevan.
  • Terindeks.
  • Memiliki konten berkualitas.
  • Memiliki konteks yang jelas.

Kemudian perhatikan:

  • File name.
  • Alt text.
  • Caption jika relevan.
  • Surrounding text.
  • Image quality.
  • Structured data jika relevan.

Jangan menganggap Google Images hanya membaca alt text.

Konteks halaman secara keseluruhan tetap penting.

Image SEO dan Structured Data

Untuk jenis konten tertentu, structured data dapat membantu search engine memahami halaman dan entitas yang ada di dalamnya.

Contohnya pada:

  • Product.
  • Recipe.
  • Article.
  • Video.

Structured data bukan sekadar “schema untuk gambar”.

Penggunaannya harus disesuaikan dengan jenis konten dan pedoman search engine.

Image SEO dan Image Sitemap

Website dengan jumlah gambar yang besar dapat mempertimbangkan strategi discovery yang sesuai.

Image dapat direferensikan dalam sitemap menggunakan struktur yang didukung.

Hal ini dapat membantu search engine menemukan resource visual tertentu.

Namun, sitemap bukan jaminan bahwa semua gambar akan muncul di Google Images.

Kualitas, relevansi, aksesibilitas, dan konteks tetap penting.

Jangan Memblokir Gambar yang Penting

Pastikan resource gambar yang ingin diproses search engine tidak diblokir secara tidak sengaja.

Periksa:

  • Robots.txt.
  • HTTP response.
  • URL gambar.
  • CDN.
  • Hotlink protection.
  • Authentication.

Jika crawler tidak dapat mengakses gambar, kemampuan search engine untuk memahami atau menampilkannya dapat terpengaruh.

Hindari Menggunakan Teks Penting Hanya di Dalam Gambar

Jangan menempatkan informasi penting hanya di dalam gambar jika informasi tersebut seharusnya dapat dibaca sebagai teks HTML.

Contohnya:

Harga Rp10.000.000

lebih baik tersedia sebagai teks pada halaman, bukan hanya tertulis dalam gambar banner.

Teks HTML lebih mudah diakses, diproses, dan digunakan oleh berbagai teknologi.

Jangan Menggunakan Gambar sebagai Pengganti Konten

Infografis sangat berguna.

Tetapi jangan membuat seluruh artikel hanya berupa satu gambar berisi ribuan kata.

Jika informasi penting hanya berada di dalam gambar:

  • Accessibility menjadi buruk.
  • Search engine lebih sulit memahami konten.
  • Pengguna mobile dapat kesulitan membaca.
  • Konten tidak fleksibel.

Gunakan kombinasi:

Text HTML + Image

bukan:

Image sebagai seluruh konten.

Image SEO dan Accessibility

SEO dan accessibility dapat saling mendukung.

Alt text yang baik membantu:

  • Screen reader.
  • Pengguna dengan gangguan penglihatan.
  • Search engine.
  • Situasi ketika gambar gagal dimuat.

Namun, jangan menulis alt text untuk search engine saja.

Pertanyaan terbaik:

“Jika saya tidak dapat melihat gambar ini, informasi apa yang perlu saya ketahui?”

Jawaban tersebut biasanya menjadi dasar alt text yang baik.

Kapan Alt Text Tidak Perlu Panjang?

Alt text tidak perlu menjadi paragraf panjang.

Contohnya gambar logo:

Logo Ziezan Digital

sudah cukup.

Gambar dekoratif:

alt=""

Gambar informasional:

Dashboard penjualan dengan grafik pendapatan bulanan

Pilih panjang sesuai kebutuhan informasi.

Bagaimana Image SEO untuk Logo?

Logo biasanya perlu:

  • Nama file yang jelas.
  • Alt text yang sesuai ketika menjadi link atau elemen informasional.
  • Ukuran optimal.
  • Format yang tepat.
  • Structured data Organization jika relevan.

Jika logo hanya dekorasi dan sudah dijelaskan oleh teks lain, pendekatan accessibility dapat berbeda.

Bagaimana Image SEO untuk Screenshot?

Screenshot sangat berguna untuk:

  • Tutorial.
  • Dokumentasi.
  • Review.
  • Studi kasus.

Gunakan:

  • File name deskriptif.
  • Alt text.
  • Caption jika diperlukan.
  • Kompresi.
  • Dimensi yang sesuai.

Contoh:

File:

google-search-console-performance-report.jpg

Alt text:

Laporan performa website di Google Search Console yang menampilkan clicks dan impressions

Ini memberikan konteks yang jauh lebih baik.

Bagaimana Image SEO untuk Infografis?

Infografis dapat menjadi konten visual yang sangat informatif.

Namun, informasi penting dalam infografis sebaiknya juga tersedia dalam teks HTML.

Misalnya infografis membahas:

Proses SEO: Crawling → Indexing → Ranking

Tambahkan penjelasan tekstual di bawah atau di sekitar gambar.

Dengan begitu, informasi tetap dapat diakses tanpa harus bergantung sepenuhnya pada gambar.

Kesalahan Image SEO yang Sering Terjadi

Menggunakan Nama File Acak

Contoh:

IMG_001.jpg

Keyword Stuffing pada Alt Text

Membuat alt text tidak natural.

Mengunggah Gambar Terlalu Besar

Ukuran file tidak sesuai kebutuhan.

Tidak Menggunakan Dimensi Gambar

Dapat menyebabkan layout shift.

Lazy Loading Semua Gambar

Gambar kritis bisa terlambat dimuat.

Menggunakan Format yang Tidak Efisien

File menjadi lebih besar dari yang diperlukan.

Menggunakan Gambar Tidak Relevan

Tidak membantu pengguna maupun konteks halaman.

Mengandalkan Stock Image untuk Semua Hal

Website kehilangan peluang memberikan visual original.

Menempatkan Informasi Penting Hanya di Gambar

Kurang baik untuk accessibility dan SEO.

Tidak Memeriksa Mobile

Gambar dapat menyebabkan masalah layout dan performa.

Checklist Image SEO

Gunakan checklist berikut:

  • Nama file deskriptif.
  • Alt text relevan.
  • Alt text tidak keyword stuffing.
  • Gambar relevan dengan konten.
  • Format gambar sesuai kebutuhan.
  • File sudah dikompresi.
  • Dimensi gambar sesuai.
  • Responsive image diterapkan.
  • Width dan height tersedia.
  • Lazy loading digunakan secara tepat.
  • Gambar LCP tidak ditunda secara berlebihan.
  • Gambar tidak menyebabkan CLS.
  • Gambar mobile sudah diuji.
  • Informasi penting tidak hanya berada dalam gambar.
  • Gambar dapat diakses crawler.
  • Structured data digunakan jika relevan.
  • Sitemap diperhatikan jika dibutuhkan.
  • Gambar original digunakan jika memungkinkan.
  • Performa halaman dipantau.

Bagaimana Strategi Image SEO yang Ideal?

Strategi Image SEO dapat dibuat dalam beberapa tahap.

Tahap 1 — Content

Pastikan gambar memang relevan dengan topik.

Tahap 2 — Metadata

Optimalkan:

  • File name.
  • Alt text.
  • Caption jika diperlukan.

Tahap 3 — Technical

Optimalkan:

  • Format.
  • Compression.
  • Dimension.
  • Responsive image.
  • Lazy loading.

Tahap 4 — Performance

Pantau:

  • LCP.
  • CLS.
  • Loading time.
  • Page size.

Tahap 5 — Accessibility

Pastikan gambar dapat dipahami oleh pengguna dengan teknologi bantu.

Tahap 6 — Search Visibility

Pantau peluang muncul melalui:

  • Google Images.
  • Organic Search.
  • Rich Results jika relevan.

Kesimpulan

Jadi, apa itu Image SEO?

Image SEO adalah proses mengoptimalkan gambar agar mudah dipahami search engine, mudah diakses pengguna, memiliki performa yang baik, dan memiliki peluang mendapatkan visibility melalui pencarian gambar.

Image SEO tidak hanya tentang alt text.

Strategi yang baik mencakup:

Relevansi → File Name → Alt Text → Context → Format → Compression → Dimensions → Responsive Images → Performance → Accessibility

Hal yang paling penting adalah menggunakan gambar yang memang memberikan nilai bagi pengguna.

Optimalkan nama file secara natural, gunakan alt text yang deskriptif, kompres gambar, gunakan format yang sesuai, pastikan dimensi tersedia, dan terapkan lazy loading secara tepat.

Untuk gambar yang berada di area paling atas halaman, terutama jika menjadi elemen LCP, prioritaskan loading dengan benar. Sebaliknya, gambar yang berada jauh di bawah halaman dapat menggunakan lazy loading untuk mengurangi beban awal.

Jangan lupa bahwa Image SEO tidak berdiri sendiri. Gambar tetap menjadi bagian dari halaman secara keseluruhan. Konteks teks, heading, struktur halaman, kualitas konten, internal link, dan technical SEO semuanya dapat membantu search engine memahami hubungan antara gambar dan halaman.

Pada akhirnya, tujuan Image SEO bukan sekadar membuat gambar “ranking di Google Images”.

Tujuan yang lebih luas adalah membuat visual website lebih mudah ditemukan, lebih cepat dimuat, lebih mudah dipahami, lebih accessible, dan lebih berguna bagi pengguna.

Dengan optimasi yang tepat, gambar dapat menjadi bagian penting dari strategi SEO sekaligus meningkatkan kualitas pengalaman pengguna secara keseluruhan.