Cara Optimasi Gambar Untuk SEO Dan Performa

Di website atau blog optimasi gambar atau lebih populer disebut dengan image optimization adalah trik pengoptimalan gambar di mesin pencari dan performanya (waktu yang di butuhkan untuk memuat gambar). Spesifiknya optimasi gambar pada website adalah mengoptimalkan performa gambar di mesin pencari dan mengoptimalkan pengalaman pengguna dengan cara mengecilkan size, file dan memilih rasio kompresi gambar yang terbaik.

Semua blogger mungkin sudah tau 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 atau konten 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 lah yang paling diuntungkan.

Terlepas dari semua itu gambar yang tidak dioptimalkan ternyata juga menghancurkan reputasi dan ranking website dan konten anda. Mengapa demikian?

Jawabannya adalah karena gambar yang tidak dioptimalkan dengan benar secara perlahan akan menimbulkan lonjakan bounce rate halaman, mengurangi performa website hingga core web vitals juga dihancurkan oleh gambar yang tidak dioptimalkan dan semua itu akan berdampak pada pengalaman pengguna yang buruk di situs web.

Oleh karena itu disini saya akan menjelaskan cara mengoptimalkan gambar konten website agar konten visual (gambar) memberikan kontribusi yang baik untuk konten dan website anda.

Dalam mengoptimalkan gambar (image optimization) ada dua tipe pengoptimalan yang secara fungsi berbeda tetapi kedua jenis pengoptimalan gambar ini sama pentingnya untuk website dan konten anda.

1. Optimasi Gambar Untuk SEO

   Adalah mengoptimalkan gambar agar mudah ditemukan di mesin pencari seperti google, bing dan lain-lain.

2. Optimasi Gambar Untuk Performa

   Adalah pengoptimalan gambar untuk performa (pagespeed) dan web vitals untuk tujuan pengalaman pengguna yang lebih baik (user experience).

Kedua aspek tersebut sangat penting untuk dioptimalkan 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.

1. Cara Optimasi Gambar Untuk SEO

Mengoptimalkan gambar dimesin telusur (SEO - Image 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 teks title harus sesuai dengan gambar dan berisi kata kunci yang dapat mendeskripsikan gambar dan konten anda contoh:

<div class="cordialblogger-images">

<figure><img alt="Optimasi Gambar Untuk SEO" data-original-height="370" data-original-width="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeBFsMNQ767fQUEg_5TgkDnl2q9oIwZKpGghEeRdhp5L2n3FlFvAdQslf9NdklEh9MJZormofwpsKmDlbV37fv3oFgpA86Gezl6UmF686cAfuGcVCahtHztKegk7cDcZIBqummthtYozg/s640/optimasi-gambar-seo.jpg" title="Optimasi Gambar Untuk SEO"/>

<figcaption>Trik SEO pada elemen gambar di website</figcaption>

</figure>

</div>

2. Cara Optimasi Gambar Untuk Performa

SEO saja tidak cukup untuk mensukseskan konten dan website anda, performa (pagespeed) juga harus dioptimalkan dengan sebaik mungkin terutama pada gambar. Rata-rata gambar memberikan kontribusi 21% dari total bobot halaman web dan biasanya gambar mengonsumsi lebih banyak byte daripada elemen lain, tentu saja itu sangat memengaruhi kinerja halaman konten dan situs web itu sendiri.

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

2.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 4 format 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.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).

2.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.

2.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.

Berapa Ukuran Dan File Size Yang Baik Untuk Performa Website?

Seperti yang saya jelaskan diatas bahwa ukuran menentukan file size pada gambar. Ukuran gambar yang terbaik untuk performa website adalah ukuran sedang. Saya menggunakan ukuran 640x370 dan 640x360 dalam satuan pixel dengan rata-rata bobot gambar dibawah 30kb bahkan beberapa gambar bisa lebih kecil dari itu.

Tetapi untuk kebutuhan website anda ukuran gambar sebaiknya disesuaikan dengan halaman konten agar terlihat proporsi. Ukuran gambar yang lebih kecil dari biasanya akan mempengaruhi resolusi gambar (tergantung kondisi gambar).

Jika diperlukan saya juga mungkin akan menggunakan ukuran gambar yang lebih besar dari itu dengan syarat gambar harus dioptimalkan dengan benar.

Contoh: Saya memiliki halaman yang sedikitnya memiliki 11 gambar tetapi total page size hanya sekitar 351kb saja. Inilah yang membuat website saya dapat dimuat dengan cepat bahkan dalam kondisi internet yang lambat.

Dengan semua trik di atas saya berhasil memangkas waktu muat halaman menjadi lebih singkat, lihat hasil analiasa GT-Metrix untuk halaman saya.

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 jangan masukkan gambar yang tidak bermanfaat untuk konten dan pengguna. Kemudian konsisten untuk mengoptimasi gambar yang disisipkan ke konten web anda dengan trik yang saya bagikan ini agar tidak membenani performa halaman.

Membaca saja tidak bisa meningkatkan performa website anda, lakukan tindakan nyata untuk mengoptimasi gambar dari segala aspek yang memungkinkan untuk dilakukan.