Image SEO: Tehnik Mengoptimalkan Gambar Tanpa Mengorbankan Kecepatan

Gambar memang dibutuhkan dalam blog, dan mungkin anda sering menampilkannya. Tetapi, kebanyakan orang SALAH dalam menggunakan gambar di Blog mereka. Mereka hanya mengupload gambar, lalu kemudian membiarkan apa adanya, dan selanjutnya diterbitkan.

Saya mengatakan bahwa itu adalah KESALAHAN, karena gambar memiliki banyak faktor yang beresiko bila tidak dioptimalkan. Ukuran yang tidak ditetapkan, size file gambar yang terlalu besar, semua itu merugikan bagi pengunjung, dan akhirnya memperburuk faktor SEO blog Anda.

Jadi, halaman ini hadir untuk mengatasi masalah itu. Saya akan terangkan dengan detail langkah demi langkah, agar gambar Anda benar-benar optimal di halaman blog, dan inilah praktik yang disebut Image SEO.

Apa Itu Image SEO?

Image SEO (SEO Gambar) adalah praktik untuk mengoptimalkan gambar dalam hasil pencarian. Pada akhirnya, praktik ini akan mengharapkan gambar dapat muncul di mesin pencari dengan peringkat yang baik. Jadi, ia harus dapat di index, render yang baik, kecepatan muat yang stabil, dan lain sebagainya.

Gambar itu ada dalam blog. Jadi, pada praktiknya tidak bisa terpisah. Keduanya saling berkaitan, dan saling mendukung. Bahkan kadang kala, gambar juga mampu memperkuat halaman artikel itu sendiri, dan mendongkrak peringkat.

Mengapa SEO Gambar itu Penting?

SEO Gambar bila dioptimalkan dengan baik, itu akan berpengaruh positif pada blog, baik dari sisi performa, maupun dari pembaca. SEO Gambar pada praktiknya, akan memperhatikan kecepatan, rendering, indexing, dan sebagainya. Semua praktik itu akan berpengaruh pada pengunjung dan itu adalah sisi PENTING dari praktik SEO Gambar. Biarkan saya menjelaskan lebih detail tentang ini.

1. Waktu Muat Halaman Lebih Optimal

Kecepatan halaman adalah hal yang menurut saya sangat penting, dan bahkan menjadi bagian dari sesuatu yang diprioritaskan. Sedangkan gambar, biasanya membutuhkan ukuran file yang lebih besar. Ketika ia tidak dioptimalkan, ukuran yang besar akan membutuhkan resource yang lebih besar, yang pada akhirnya akan mengorbankan kecepatan halaman Anda. Dengan mengoptimalkannya, resiko itu akan dapat diminimalisir.

2. Faktor Ranking

saya tidak tahu pasti. Tetapi beberapa halaman melaporkan bahwa indexing gambar membantu peringkat artikelnya. Artinya, gambar yang dioptimalkan, akan di index dalam pencarian gambar, dan akan membantu peringkat dari artikel tempat gambar berada. Ini bagus sebagai sinyal SEO untuk artikel itu sendiri.

Saya dulu berpikir, bahwa tanpa gambar akan membuat halaman lebih cepat memuat. Tetapi, itu tidak maksimal, karena gambar berfungsi untuk memberikan konteks yang lebih jelas dalam artikel.

3. Rasio Gambar Terbaca Dengan Baik

Gambar yang dioptimalkan, akan memperhatikan ukuran lebar dan tinggi gambar. Browser modern membutuhkan ukuran gambar yang jelas, bahkan ini bagian dari indikator Google Pagespeed untuk kecepatan.

Setiap menemukan gambar dihalaman blog, browser akan mengukur ulang gambar yang di render, dan membutuhkan atribut width & height. Gambar mungkin saja tampil bila kita mengabaikan atribut itu. Tetapi membuat browser membutuhkan waktu lebih banyak untuk menentukan ukurannya, dan tentu saja ini mengorbankan kecepatan waktu muat halaman Anda.

Disinilah praktik SEO Gambar memainkan perannya, dengan menentukan ukuran yang tepat untuk ditampilkan (baik dalam versi dekstop maupun mobile), dan itu semua akan kita bahas langkah detailnya dibagian selanjutnya.

4. Peluang Menerima Kunjungan

Google bahkan memiliki kolom tersendiri untuk pencarian gambar dalam keyword tertentu. Bila gambar anda ditemukan disana, tentu saja orang-orang harus membuka halaman untuk dapat melihat gambar dengan lebih jelas.

Tidak sedikit orang yang hanya benar-benar mencari untuk melihat gambar. Mungkin untuk melihat desainnya, atau hanya sekedar menemukan inspirasi dari gambar yang ada. Membuat halaman anda berada dalam kolom pencarian gambar, tentu saja secara tidak langsung membuat orang mengunjungi halaman Anda.

Cara Membuat SEO Gambar

Sekarang kita ada di bagian inti, dan seperti yang saya katakan di awal, kita akan menemukan cara untuk membuat gambar SEO. Mari ikuti langkahnya.

1. Gunakan Tag IMG

Gambar sebaiknya menggunakan tag <img .. agar ia benar-benar terbaca sebagai gambar dalam semantik HTML. Saya selalu menggunakan seperti ini:

<img src="puppy.jpg">

Memang, tidak sedikit desain Blog yang menggunakan elemen DIV dan menggunakan gambar sebagai background seperti ini:

<div style="background-image:url(contoh-gambar.jpg)">

Gambar memang tampil, tetapi itu tidak akan terindex. Pasalnya, ia hanyalah pemanis yang digunakan sebagai elemen background dari DIV. Alih-alih menggunakannya, saya memilih untuk menggunakan tag <img .., untuk memperkuat indexing.

2. Gunakan Atribut Gambar SEO

Gambar membutuhkan detail informasi tambahan, agar ia dapat di index dengan baik. Ada beberapa atribut yang dapat digunakan di elemen IMG, dan beberapa yang paling penting seperti berikut:

1. src: atribut yang diperlukan untuk menampilkan gambar pada elemen IMG. Isinya berupa URL gambar.
2. alt: atribut WAJIB dalam sebuah gambar, dan digunakan sebagai teks alternatif yang akan ditampilkan jika pengunjung tidak bisa membuka gambar mungkin karena kesalahan src, atau koneksi yang lambat.
3. title: sebagai judul gambar, yang akan terlihat sebagai Toolip pada gambar saat di hover.
4. width: Ukuran lebar gambar yang dapat diisi dengan angka
5. height: Ukuran tinggi gambar yang diisi dengan angka
6. loading: atribut yang digunakan untuk menentukan perilaku browser pada gambar, apakah membuat lambat atau membuat di awal

Jika Anda menggunakan blogger, secara otomatis akan menghasilkan data-original-height & data-original-width. Itu adalah data awal dari blogger, dan itu bagus. Yang perlu dilakukan adalah menambahkan atribut pendukung lain untuk memperkuat deskripsi gambar.

Sampai pada tahapan ini, jika elemen gambar anda dalam HTML, akan terlihat lebih jelas:

<img src="gambar-saya.png" alt="gambar-saya" title="Gambar Saya" width="800" height="450" loading="lazy" data-original-height="450" data-original-width="800"/>

3. Gunakan Gambar Responsive

Gambar responsive adalah perilaku modern untuk menampilkan gambar. Ini akan membuat gambar selalu merubah ukuran sesuai tampilan browser dari pengunjung, dan itu praktik terbaik.

Dalam hal ini, menggunakan CSS mutlak dibutuhkan. Kemudian satu tambahan lain, saya terbiasa untuk menggunakan atribut srcset untuk mendefenisikan berbagai URL gambar sebagai mapping untuk ditampilkan.

Browser tidak lagi membutuhkan waktu lebih banyak untuk menghitung lebar untuk menampilkan gambar, karena kita sudah menyediakan daftar gambar yang akan ditampilkan, sesuai dengan spesifikasi tampilan browser.

Catatan tambahan: Belakangan ini, Gambar dari Blogger sering sekali sulit untuk di indeks. Tidak tahu pasti akar masalahnya, tetapi panduan ini berisi panduan yang layak untuk diikuti, karena juga tersedia di dokumen Google.

Penutup

Gambar dibutuhkan dalam posingan untuk memperjelas penyampaian dalam artikel. Tetapi anda dapat mengoptimalkannya dengan menerapkan tehnik SEO Gambar. Menggunakan elemen IMG, menambahkan atribut pendukung untuk SEO, serta menggunakan gambar responsive, adalah tindakan terbaik untuk mengoptimalkan gambar Anda, tanpa mengorbankan kecepatan situs.

Jika Anda memiliki pertanyaan tentang ini, jangan sungkan untuk menuliskannya di kolom komentar.