QUOTE
Yang umum diyakini, membuat blog itu susah.
Apalagi menjadikannya untuk mencari uang di internet.
Tapi ketahuilah, itu hanya mitos!
Temukan inspirasi dan semangat baru di sini
terbaru

Cara Meringankan Gambar dg Encode Base64

: Senin, April 04, 2016

Beginilah cara meringankan gambar dengan Encode Base64. Hasilnya, benar-benar diluar perkiraan anda. Meski blog anda banyak gambar tapi tetap akan ringan dibuka

Setelah anda pahami Apa Itu Base64 dan Fungsinya untuk Blog Anda, maka sekarang mari kita praktekkan pada salah satu gambar blog anda sebagai demo. Bagaimana caranya?

Jika kemampuan anda berpikir coding sudah encer, maka anda bisa lakukan sendiri secara manual dengan menerapkan algoritma enkripsi dan deskripsi. Atau yang dikenal dengan kriptografi. Tapi jika tidak, maka lebih baik gunakan layanan online yang kini sudah banyak tersedia di internet. Cara kerjanya sangat praktis. Hanya dengan mengupload gambar anda ke sebuah situs convert image to base64, maka hasilnya akan langsung muncul begitu gambar tersebut berhasil terkirim ke situs penyedian layanan tersebut.

Lalu dimana situs yang menyediakan layanan ini? Sangat banyak. Tapi sebagai contoh, saya akan menggunakan layanan gratis dari situs Base64 Image Encoder. Untuk melakukannya sekarang silahkan anda buka situs resminya dengan alamat https://www.base64-image.de


Cara Meringankan Gambar dengan Encode Base64

Setelah halaman depannya terbuka seperti ini maka langsung saja klik tombol OR CLIK HERE



Cara Meringankan Gambar dengan Encode Base64

Sekarang carilah dimana gambar anda tersimpan di komputer atau laptop anda lalu klik file gambar tersebut. Selanjutnya klik tombol Open. Lalu tunggu proses upload tersebut sampai selesai, hingga akhirnya muncul tampilan seperti dibawah ini.


Cara Meringankan Gambar dengan Encode Base64

Klik gambar untuk tampilan lebih besar

Nah jika sudah muncul tampilan seperti ini, berarti proses encoding gambar anda menjadi Base64 sudah berhasil. Selanjutnya anda tinggal ambil kode base64-nya. Caranya kliklah pada menu Show Code(lihat no.4) sehingga terbuka jendela yang berisi detail file gambarnya seperti ini:


Cara Meringankan Gambar dengan Encode Base64

Nah itulah gambar tampilan dari file original gambar yang saya gunakan pada contoh ini. Selanjutnya anda tinggal mengambil script atau kodenya. Caranya kliklah pada tombol selected all. Lalu paste dimana gambar itu ingin anda sisipkan atau ditampilkan di bog ada. Sebagai contoh inilah hasil copy paste dari gambar diatas yang sudah diencode ke base64.

data:image/png;base64,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


Panjang amat ya kodenya?
Soal keluhan nanti akan saya tanggapi. Jika semua kode diatas anda copykan ke kotak adress browser lalu ENTER, maka yang akan terbuka adalah sebuah gambar. Persis gambar aslinya. Dan loadingnya, jauh lebih cepat dibanding gambar hasil upload ke halaman Entri Postingan atau situs sharing file image. Kecepatannya sama dengan kecepatan anda membuka halaman yang hanya berisi teks.

Jika anda cermati kode diatas, ciri yang bisa anda kenali adalah, setiap kode base64, betapapun panjangnya, selalu diawali dengan data:image/png;base64 dan diakhiri dengan karakter ==

Sebagai tambahan, tulisan yang berwarna merah diatas, adalah ekstensi file gambar. Karena itu tulisan merah tersebut tidak akan sama, tergantung jenis file gambar yang anda gunakan. Bisa PNG, JPEG, gif dan seterusnya.

Selanjutnya bagaimana cara menyisipkan kode yang panjang tersebut ke blog anda? Baik ke halaman posting, header, footer maupun sidebar? Mari kita lanjutkan di ruangan ini: Cara Menggunakan Script Base64 pada Blog.

Komentar yang tidak relevan, jorok, spamming dan promosi link akan dihapus

Copyrights @ blogernas ■ Desember 2015 - Erianto Anas