Optimasi File Gambar Agar SEO Dan Fast Loading

Di dunia blogging optimasi file gambar atau lebih populer disebut dengan "image optimization" adalah trik pengoptimalan file gambar agar mudah dikenali oleh mesin pencari, pembaca layar dan UX (user experience) atau dalam bahasa indonesia adalah pengalaman pengguna.

Optimasi File Gambar bertujuan untuk meningkatkan efisiensi indexing oleh mesin pencari terhadap gambar tersebut menjadi lebih mudah, selain itu optimasi bertujuan agar file image dapat dimuat dengan cepat (fast loading) dan dikenali oleh pembaca layar.

Semua blogger umumnya mengetahui bahwa konten visual seperti gambar sangat membantu dalam mengembangkan situs web. Berdasarkan analisa pakar, konten yang memiliki gambar menerima 94% lebih banyak view daripada halaman yang hanya berbasis teks saja.

Hal itu dikarenakan konten visual (gambar) mampu menjelaskan apa yang tidak bisa dijelaskan oleh teks, selain itu pencarian mode gambar di mesin telusur juga sangat populer dan hampir dipastikan website/blog dengan nice konten yang mengunggulkan gambar yang paling diuntungkan.

Terlepas dari semua itu gambar yang tidak dioptimalkan ternyata juga berpotensi mengurangi reputasi halaman dan ranking website, mengapa demikian?

Jawabannya: Karena gambar yang tidak dioptimalkan dengan benar secara perlahan dapat menimbulkan lonjakan bounce rate halaman, mengurangi performa website dan core web vitals, yang akhirnya semua itu akan berdampak pada pengalaman pengguna yang buruk di situs web.

Oleh karena itu disini saya akan menjelaskan cara mengoptimalkan gambar agar lebih ramah mesin pencari (SEO-Friendly) dan ramah pengguna (User Friendly), sehingga keberadaan file gambar di halaman anda, memberikan kontribusi yang baik untuk website dan halaman.
Optimasi File Image (Gambar)
Dalam mengoptimalkan gambar (image optimization) ada dua tipe pengoptimalan yang secara fungsi berbeda tetapi kedua jenis pengoptimalan gambar ini sama pentingnya untuk halaman web.
  1. Optimasi Gambar Untuk Mesin Telusur

    Adalah pengoptimalan file image (gambar) agar mudah dikenali oleh mesin pencari atau search engine seperti google, bing dan lain-lain.

  2. Optimasi Gambar Untuk UX (user experience)

    Adalah pengoptimalan file gambar untuk tujuan pengalaman pengguna yang lebih baik (user experience), menghasilkan gambar yang dapat dimuat dengan cepat (fast loading).

Kedua pengoptimalan tersebut sangat penting untuk dilakukan demi perkembangan website dan konten anda. Lalu bagaimana cara mengoptimalkan gambar dengan baik dan benar? Silahkan ikuti langkah-langkah pengoptimalan gambar berikut ini untuk mendapatkan jawaban-nya.

Cara Optimasi File Gambar Agar SEO

Mengoptimalkan gambar untuk mesin telusur (Search Engine Optimization) sebanarnya tidak terlalu rumit, meskipun demikian sedikitnya ada 6 aspek yang harus dioptimalkan agar gambar anda mudah ditemukan oleh mesin pencari.
  1. Pastikan desain gambar benar-benar memberikan dukungan yang tepat untuk konten anda.
  2. Sesuaikan gambar dan nama file gambar.
  3. Tambahkan tag alt (alternatif teks) pada gambar.
  4. Tambahkan caption pada gambar.
  5. Tambahkan tag title.
  6. Dan gunakan data terstruktur di konten website anda
Keterangan: Desain gambar yang ditampilkan di dalam konten website harus dapat mengilustrasikan konten anda dengan tepat, menambahkan gambar yang tidak ada kaitannya dengan konten merupakan hal sia-sia.

Kemudian nama file, alternatif teks, caption dan title teks harus sesuai dengan gambar yang ditampilkan, berisi kata kunci dan kalimat yang dapat mendeskripsikan gambar dengan jelas contoh;
<div class="cordialblogger-images">
<figure><img alt="Optimasi Gambar Untuk SEO" data-original-height="370" data-original-width="640" src="https://1.bp.blogspot.com/-XDWGf4zaZNY/YERkqx2XImI/AAAAAAAAA44/nALnoh2WPpIz45BzlAOczW4S3gyzD7BcwCLcBGAsYHQ/s640/optimasi-gambar-seo.jpg" title="Optimasi Gambar Untuk SEO"/>
<figcaption>Trik SEO pada elemen gambar di website</figcaption>
</figure>
</div>

Cara Optimasi Gambar Agar Fast Loading

Rata-rata file image atau gambar memberikan kontribusi 21% dari total bobot halaman web dan biasanya gambar mengonsumsi lebih banyak byte daripada elemen lain, tentu saja itu sangat memengaruhi performa halaman dan situs web itu sendiri.

Untuk mengatasinya sedikitnya ada 4 tindakan yang harus dilakukan untuk meningkatkan performa pemuatan gambar yaitu:

1. Gunakan Format Gambar Dengan Rasio Kompresi Terbaik

Ini merujuk kepada jenis file atau format gambar yang dipilih, Kamu harus benar-benar paham format gambar apa yang paling tepat untuk konten anda. Ada 5 format file gambar yang memiliki rasio kompresi yang baik untuk situs web dan masing-masing mereka memiliki keunggulan dan karakteristik berbeda.
[ads id="ads1"] Sebelum memutuskan, kamu harus jeli mengenali konten anda dan target pengguna yang anda pilih, jika tidak meskipun rasio kompresi cukup baik untuk menghemat waktu muat halaman pengguna akan tetap meninggalkan halaman anda.

2. Ubah Ukuran Gambar

Untuk pengalaman pengguna yang baik pastikan aspek rasio gambar proporsi (memiliki lebar dan tinggi yang sesuai dengan halaman konten anda).

Tetapi harus diingat juga ukuran gambar menentukan besar dan kecilnya file size pada gambar, semakin besar ukuran maka semakin besar pula file size pada gambar tersebut begitu juga sebaliknya semakin kecil ukuran gambar maka semakin kecil pula file size pada gambar.

Logikanya file gambar yang besar membutuhkan waktu muat dan data yang besar juga untuk membuka gambar tetapi jika terlalu kecil juga tidak baik karena dikhawatirkan resolusi gambar tidak memadai untuk pengalaman pengguna.

Sebaiknya gunakan ukuran yang sedang saja misalnya 1080x608 atau 640x360 dalam satuan piksel (px).

3. Kompres File Gambar

Mengecilkan file size gambar sangat penting untuk performa rendering halaman anda, jika file gambar original adalah 300kb, gambar yang dikompres bisa 45% lebih kecil file sizenya dibandingkan gambar original.

Tindakan ini secara nyata akan meningkatkan performa halaman, menghemat waktu muat halaman dan data yang digunakan untuk membuka gambar. Sehingga memungkinkan halaman anda dapat dimuat dengan lebih cepat jika menggunakan gambar yang di kompres.

4. Sajikan Gambar Responsif dan Progresive

Gambar di halaman konten website harusnya ditampilkan dengan responsif (dapat menyesuaikan disemua ukuran layar) dan proses muat gambar harus progresif (Baca: artikel tentang gambar progresif).

Tujuanya supaya pengguna anda tidak perlu menghabiskan banyak waktu untuk melihat gambar anda selama proses muat halaman.

Hasil Pengoptimalan

Sedikitnya blog ini, menampilkan 12 - 16 gambar hampir pada setiap halaman, dengan kondisi itu, jika tidak melakukan pengoptimalan dengan tepat file size halaman saya tentu menjadi sangat besar apalagi ditambah dengan dokumen lainnya.

Tetapi, karena saya menggunakan gambar progresif dengan ukuran 640x370 dan 640x360 dalam satuan pixel, rata-rata bobot (file size) gambar yang dihasilkan hanya sekitar <30kb, sehingga file gambar seolah tidak membebani blog ini.

Dan saya telah berhasil memangkas waktu muat halaman menjadi lebih cepat, inilah hasil analiasa GT-Metrix untuk file size halaman saya.
Total page size setelah dilakukan peng-optimalan pada file image (gambar)

Kesimpulan

Menerapkan SEO dan meningkatkan performa gambar itu sama pentingnya, keduanya akan menjadi pondasi yang kokoh dalam perkembangan website anda.

Logikanya begini dengan menerapkan SEO pada gambar, gambar anda mungkin menempati posisi pertama, tetapi apa gunanya jika situs web sulit dibuka karena loading halaman yang berat?

Jika satu gambar memberikan kontribusi 21% dari total page size halaman bagaimana jika lebih dari satu? Coba fikirkan...! Maka dari itu saya sarankan agar jangan masukkan gambar yang tidak bermanfaat untuk konten dan pengguna. Kemudian konsisten untuk mengoptimasi file gambar yang disisipkan ke halaman agar performa blog tetap optimal.

Close