7 ways to optimize images for your blog and website

7 Tips Mengoptimalkan Foto dan Gambar untuk Blog

7 ways to optimize images for your blog and website

Satu gambar mewakili ribuan kata; ungkapan ini berlaku juga untuk blog post. Postingan blog kamu akan jauh lebih menarik jika ada paling enggak satu gambar di situ. Dengan gambar yang bagus dan relevan, pembaca juga jadi lebih tertarik untuk membaca konten blog. Kali ini saya akan share 7 tips mengoptimalkan gambar blog untuk menunjang readership dan SEO blog post kamu.

1. Gunakan gambar / foto yang relevan

Gunakan gambar yang relevan dengan konten post. Kamu bisa pakai foto sendiri, stock photo (perhatikan lisensinya ya!) atau gambar ilustrasi.

Beberapa website yang menyediakan free stock photos :

2. Optimalkan Featured Image dengan judul post + URL blog

Untuk featured image (pada platform WordPress) sebaiknya gunakan kombinasi foto/gambar dengan teks judul post (tidak harus sama persis kata-katanya) dan url blog kamu. Kenapa? Karena featured image ini yang akan muncul saat blog post kamu di-share di media sosial; dengan adanya judul post + url memudahkan orang untuk langsung ngeh tentang konten postingan sekaligus sebagai branding untuk blog kamu.

My First Blog Post

3. Kurangi ukuran gambar – physical & file size

Sesuaikan ukuran file dengan kebutuhan. Sebaiknya lebar gambar sama dengan lebar konten post / body content. Jika lebar konten post kamu 1000px maka resize gambar supaya lebarnya juga 1000px dengan resolusi 72 DPI (karena high resolution 200-300 DPI hanya berguna untuk keperluan cetak). Kamera jaman sekarang kan resolusinya besar-besar, jadi hasil fotonya hampir selalu harus di-resize dulu supaya ukuran file-nya lebih reasonable untuk diupload di blog.

Ukuran file yang terlalu besar selain menghabiskan tempat di server juga membuat waktu loading yang lebih lama. Padahal search engine seperti Google lebih suka dengan website yang loadingnya cepat. Bagaimana caranya? Kalau saya resize gambar pakai Photoshop. Untuk alternatif program yang gratis dan mudah ada PicMonkey, Pixlr atau Canva. Nanti saya buat tutorialnya ya 😀

Me-resize Gambar dan Foto dengan PicMonkey Me-resize Gambar dan Foto dengan Pixlr

By the way lebar blog saya saat ini 600px; tapi ada kemungkinan di masa mendatang saya ganti WordPress themes dengan lebar blog yang berbeda; jadi untuk amannya saya resize gambar saya ke lebar 1000px. Kalau kamu pakai Photoshop, ada langkah tambahan yang bisa dilakukan untuk mengecilkan ukuran file yaitu dengan Save for Web.

Me-resize Gambar dan Foto dengan Photoshop Save For Web

4. Gunakan Nama File yang Deskriptif

Rename file gambar dengan kata kunci yang deskriptif. Jangan menggunakan filename bawaan kamera seperti DSC01235.jpg atau IMG_1359.jpg; karena search engine nggak akan ngerti DSC1235 itu apa; bandingkan kalau kamu pakai keyword yang deskriptif seperti piknik-kebun-raya-bogor.jpg atau bahan-resep-makaroni-panggang.com. Satu tips tambahan, gunakan hypen “-” untuk memisahkan keyword; karena kalau pakai underscore “_” bisa jadi Google akan membacanya sebagai 1 kata.

5. Beri Watermark

Beri watermark pada foto kamu. Selain sebagai langkah pencegahan foto kamu disalahgunakan orang, juga sebagai branding untuk blog kamu. Beberapa tipe watermark yang bisa digunakan misalnya nama blog, url blog atau logo. Nggak perlu segede gaban di tengah foto karena bisa merusak keindahan fotonya itu sendiri, yang penting cukup terbaca dan warnanya cukup kontras dengan backgroundnya. Gunakan jenis, penempatan dan styling watermark yang sama untuk semua gambar supaya terlihat konsisten.

6. Optimasi dengan plugin

Setelah gambar diupload ke WordPress, gunakan plugin untuk optimasi gambar supaya ukuran file-nya lebih kecil, seperti smush.it atau ewww-image-optimizer. Kalau filesize makin kecil kualitas gambarnya jadi makin turun juga dong? Tenang aja, berikut klaim dari plugin tersebut : “EWWW Image Optimizer uses lossless optimization techniques, so your image quality will be exactly the same before and after the optimization. The only thing that will change is your file size.

Wordpress plugin WP Smush.it Wordpress plugin EWWW Image Optimizer

7. Gunakan Title dan Alt Text

Berikan Title dan Alt Text untuk gambar yang sudah diupload. Misalnya judul post kamu adalah Resep Makaroni Panggang Mudah dan Enak, maka filename foto kamu sebaiknya resep-makaroni-panggang-mudah-enak.jpg; Title dan Alt text-nya Resep Makaroni Panggang Mudah dan Enak. Title adalah teks yang muncul saat kamu hover mouse kamu pada gambar di web; sedangkan Alt text akan muncul jika karena satu dan lain hal gambar kamu nggak bisa loading di web.

Title dan Alt-Text untuk foto atau gambar blog

broken-img-alt-text title-popup-image

Ilustrasi Title dan Alt-Text dipinjam dari WP Beginner.

 

Demikian 7 tips untuk mengoptimalkan foto dan gambar blog kamu di mata mbah Google dan juga pembaca. Cara-cara di atas sebenarnya mudah dan bisa pakai aplikasi gratis, hanya butuh ketelatenan saja ^_^

 

 

Similar Posts

44 Comments

    1. Hi mbak, point 1-5 tetap bisa dilakukan semua karena di luar platform WordPress atau Blogspot. Untuk penambahan Title dan Alt Text bisa juga diterapkan di Blogspot. Salah satu caranya dengan klik gambar di Post Editor, pilih Properties. Nanti muncul text box, di situ bisa ditambahkan Title dan Alt Text-nya.

      Semoga membantu ^_^

  1. Sebagian dari tips di atas udah aku coba dan kubagikan kepada teman-teman yang mengikuti pelatihan ngeblog bersamaku. Salam kenal, Aku @kakdidik13 | Blogger Bojonegoro

  2. wah… baru tahu kalo di WP ada plugin untuk image optimizer, kira2 kalau untuk joomla ada gak mbak plugin yang sejenis?
    Terimakasih dan salam kenal

  3. Assalamualikum mba Al,
    salam kenal yaa..
    tulisannya menarik sekali. saya lagi belajar ngeblog nih mba hehee..
    gak kepikiran untuk rename file foto supaya bisa terbaca Google..langsung saya terapkan ini mba hehee
    makasi banyak sharingnya mba 🙂

    1. Hi mba Minda, salam kenal jugaa ^_^
      Sama saya jg lagi belajar ngeblog hehehe… Iya untuk rename file foto penting supaya Google-nya bisa baca, bagus untuk SEO. Dan penting juga dikecilin ukuran fotonya supaya ga berat pas loading di blog 😉

  4. Halo lagi mbak Alma .. Saya barusan visit site2 yang menyediakan free image dan sudah mendaftar sebagai anggotanya. Yang menjadi pertanyaan saya, sehubungan dengan watermark, apabila saya menggunakan foto dari website yang menyediakan free foto itu, apa saya mencantumkan watermark blog saya atau merefer ke blog pemberi image free tadi? kemudian kalau saya memberi sedikit editing bisakah kemudian saya memberi water mark atas nama blog saya di free image tsb? mohon share jawabannya ya mbak. Sukses terus dengan blognya yang kereeen 🙂

    1. Hai, salam kenal juga ^_^ Untuk watermark pada foto, kalau stock photo-nya dipakai as it is (kita tidak menambahkan elemen lain) tidak usah diberi watermark apa-apa. Kecuali bila kita misalnya menambahkan judul blog post pada foto tersebut sebagai “featured image”, boleh dikasi watermark atas nama blog kita. Btw perhatikan juga bahwa free image license-nya beda-beda, ada yang mengharuskan credit atau link-back, ada juga yang benar-benar bebas dipakai tanpa kewajiban apa2 🙂

  5. Mbak, postingan saya waktu ditelusur pake google kok kecil bgt, padahal waktu posting ukuran besar,,?

  6. Aku udah praktekin step-step seperti ini. Another time consuming activites in blogging but worth to try. Tiap image di kasih keterangan seperti judul artikel post hehehe

  7. Trims sharingnya. Baru tahu kalo foto jg perlu dinamain sesuai judul postingan. Biasanya suka2 aja namain fotonya. Mo dirapiin lagi ah…

    1. Sebenarnya bukan harus sama dengan judul postingan, tapi yg penting ada keyword di filename foto tsb, plug title, alt text dan description juga sebaiknya mengandung keyword, bagus untuk SEO 😉

  8. Hai Kak, langsung meluncur direkomendasiin teman waktu pertama kali setelah sekian lama ga ngutak ngatik WP dan akhirnya balik lagi ke WP. Terimakasih banyak Kak, sangat informatif. Bookmarked dulu, besok-besok belajar lagi xoxo

  9. Alma, mau nanya yg nomer 4 donk. Jadi itu waktu save foto, namainnya langsung dikasih tanda “-” ya? Kirain klo kita ngetik aja pas ngesave ntar dia namanya udah ketambahan hypen sendiri hihiii…

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.