Catatan dan kumpulan tutorial dari akumaru.com, semoga bermanfaat

Tips Memanipulasi Gambar Untuk Mempercepat Loading

5 comments
Tips Memanipulasi Gambar Untuk Mempercepat Loading Speed - Terkadang ada orang yang sangat memperhatikan keindahan blognya, tanpa memikirkan kecepatan loading blognya nanti. Tips ini juga termasuk dalam tutorial SEO, yaitu bagaimana cara mempercepat loading web atau blog. Cara ini sudah saya terapkan dan hasilnya sangat memuaskan sekali.

Size awal 1.5MB (gambar kiri), Size akhir (32KB)
Size awal 1.5MB (gambar kiri), Size akhir (32KB)
Sebenarnya cara ini sederhana, dan mungkin sobat sudah pernah mengenalnya. Namun sebelumnya saya ingin bercerita sebentar tentang asalmuasal saya menemukan cara ini. Awalnya adalah ketika saya menemukan sebuah template yang sangat bagus menurut saya, yang tampilan homepagenya memiliki banyak fitur dan berisi banyak gambar tentunya. Saya lalu mengecek kecepatan loadingnya di gtmetrix.com, dan hasilnya memuaskan, template tersebut bisa dibilang cepat dengan tampilan yang full picture.

Keanehan terjadi ketika saya yang menggunakan template tersebut, selang seminggu saya memakainya, saya mengecek kecepatan loading web saya, dan hasilnya buruk sekali. 40-50 detik dan total halaman mencapai belasan MB. Dengan hasil ini saya cukup terkejut, aneh sekali dalam hati saya berkata. Selidik punya selidik, ternyata ini semua terjadi karena gambar yang dimuat dalam postingan saya berukuran besar.

Penyebab Loading Lambat

Bagi sobat yang tampilan homepagenya menampilkan postingan terbaru dengan gambar, sebaiknya cek size dari gambar yang ada di postingan sobat. Usahakan jangan sampai melebihi 100KB (lebih kecil lebih baik), mengapa demikian? Karena setiap postingan yang mengandung gambar nantinya akan ditampilkan dihomepage sobat, dan tentunya akan menampilkan gambar pertama dari postingan tersebut. Dengan kata lain pengunjung nanti harus meloading gambar yang ada di homepage, sobat bisa saja kehilangan pengunjung sobat, hanya gara-gara loading yang lambat. Bila sobat ingin membuktikannya, coba saja download gambar yang ada di facebook, saya pernah mencoba mendownload gambar yang saya upload di facebook, dan hasilnya downloadnya tidak pernah melebihi 100KB, itu karena facebook otomatis mengkompres setiap gambar yang kita upload, tujuannya untuk mempercepat proses loading.

Jangan Asal Copy Image Url

Dulu saya sangat malas untuk re-upload gambar (download lalu mengupload ulang). Karena yang saya takutkan adalah, takut kuota dari googleyang 15 GB akan habis, yah alasan yang tidak masuk akal, namun saya memikirkan bagaimana kedepannya nanti. Selain itu juga agar praktis dan lebih cepat, mungkin sebagian sobat blogger setuju dengan alasan ini.

Mulai sekarang hindari copy image url, sebenarnya boleh saja, namun perhatikan juga size gambarnya. Bila sizenya kecil, boleh saja sobat gunakan. Namun kalau sizenya besar? akan mempengaruhi kecepatan loading nantinya.

Cara Memanipulasi Gambar Untuk Mempercepat Loading

Caranya sebenarnya simple, sobat tinggal menyesuaikan saja sizenya agar tidak terlalu besar, usahakan dibawah 100KB. Cara yang saya gunakan ini menggunakan aplikasi bawaan dari Microsoft Office, sewajarnya mengkompresi, pasti resolusi gambar akan menjadi kecil dan kualitasnya tidak sebagus yang asli. Disini saya juga akan memberikan tips sederhana supaya size gambar sobat kecil namun tidak mengurangi kualitas gambar.

  • Buka gambar dengan microsoft office picture, lihat gambar :
Buka Gambar Dengan Microsoft Office Picture
Buka Gambar Dengan Microsoft Office Picture
  • Pilih edit pictures lalu pilih compress pictures
Edit Pictures - Compress pictures
Edit Pictures - Compress pictures
  • Pilih Web Pages
Pilih Web Pages
Pilih Web Pages
  • Lihat hasilnya ukurannya, sekarang sobat tinggal upload ke postingan sobat.
Hasil Kompresi
Hasil Kompresi
  • Karena gambar yang di kompres kualitasnya rendah, dan sobat ingin dengan size yang mini tapi kualitas bagus. Kita memanipulasinya dengan jasa upload gambar gratis seperti photobucket. Lalu sobat upload gambar kualitas baik (yang size besar) tersebut disana.
  • Setelah itu nantinya sobat akan mendapatkan image url, lalu ganti link url gambar sobat dengan image url dari photobucket, lihat gambar :
Mengganti link gambar ketika diklik
Mengganti link gambar ketika diklik

  • Tujuan dari langkah diatas adalah, ketika pengunjung mengklik gambar, dia akan dialihkan pada gambar kualitas tinggi yang sobat upload di photobucket atau jasa upload lainnya.


Sekian tutorial pada kali ini, semoga bermanfaat, dan bisa diterapkan selalu :)

regards
Admin akumaru.com

5 comments :