Sebagai pengguna setia Blogspot, kita masih bisa optimalisasi dengan sederhana, Contohnya adalah : Optimize images, CSS Image Sprite (InsyaAllah saya akan muat postingannya suatu hari nanti), Minify CSS dan Compress HTML. Disini saya hanya akan mengulas tentang Compress HTML sesuai dengan tema kita Compress HTML – Bantu Mempercepat Loading Blog.
Langkah awal, uji kecepatan blog menggunakan PageSpeed Insights — Google Developers dimana layanan ini merupakan milik google yang disediakan agar para webmaster bisa mengetahui kenerja web atau blog yang sedang dioptimalisasi. Masukkan URL blog sobat dan Analyze lalu Lihat hasil dan scorenya.
Perhatikan gambar yang dilingkari warna merah itu berarti bahwa HTML dalam blog sobat masih perlu di Compress agar mengurangi berat dari loading blog sobat. Walaupun element ini masuk dalam kategori Low Priority.
Langkah kedua, Silahkan masuk ke dasbor blogger dan pilih tab Template, Lakukan Backup atau unduh Tamplate lengkap dan simpan, Nantinya jika terjadi error bisa kita kembalikan seperti semula.
Langkah ketiga, klik tombol Edit Template dan centang "Expand Template Widget" (perhatikan gambar)
Ini bertujuan agar semua struktur HTML yang ada dalam blog sobat bisa terlihat, baik berjenis Java Script CSS dan lain-lain.
Selanjutnya, copy/salin semua kode HTML yang ada dalam Template mulai dari: <?xml version="1.0" encoding="UTF-8" ?> Sampai </html>
Langkah keempat, Buka tool Compress HTML dan paste/tempel kode HTML tadi pada kolom tool Compress HTML. Kemudian klik tombol Compress. Jika ada pesan seperti ini,
Klik Change, ini berarti kode HTML merupakan kode untuk Blogger dan harus disesuaikan secara otomatis oleh tool agar tidak terjadi error XML pada saat diterapkan kembali ke Template sobat.
Tunggu sampai proses compress selesai.
Setelah proses selesai kita bisa melihat rasio dari hasil sebelum dan sesudah HTML sobat dicompress, dan gambar diatas adalah hasil dari compress HTML blog saya dimana sebelum di compress berukuran 69,740 bytes menjadi 54,966 bytes, Lumayan jauh bukan.
Langkah kelima, silahkan download/unduh dalam bentuk file XML, kemudian kembali ke dasbor blog sobat, lalu ganti Template sobat dengan Template hasil dari compress tadi.
Langkah Keenam, Cek ulang performa blog sobat melalui PageSpeed Insights — Google Developers, dan perhatikan apakah masih ada pesan Minify HTML?
Untuk hasil blog saya Alhamdulillah sudah tidak ada alias Done, tapi optimalisasi yang lain masih banyak.
Selesai!
Semoga bermanfaat dan jika ada yang kurang jelas, silahkan berinteraksi melalui form komentar dibawah ini. Maaf jika tulisannya sulit dipahami hehe, maklum masih nubie!
Happy Blogging
Idiiih keren deh sob.. ckckc.. ternyata ente bener-bener serius yaaaah dalam kecepatan loading blog.. tapi kalo gitu ntar susah lagi kalo mau ngedit heheh
ReplyDeleteYah dengan alasan diatas sob, SE sekarang mulai memperhatikan waktu muat web/blog, jd kenapa tidak kita mulai dari sekarang hehe...
DeleteJangan kebanyakan edit sob, ntar googlebot bingung ngcrawelnya :)
perbaikan pagespeed insight adalah info yg sedang saya cari. terutama utk high prirority. cara memanfaatkan penyimpanan tembolok peramban. saya cek blog agan ternyata masalah ini dimasukkan pada medium prirority. dan pointnya bagus=94. saya ingin bisa seperti itu, mungkin ada info yang bisa membantu saya? atau apakah ini masuk masalah yang belum bisa diperbaiki pengguna blogspot? adapun info ini lumayan utk perbaikan, terimakasih.
ReplyDeletekalau ingin mengecek blog saya: http://ittaqi-tafuzi.blogspot.com semoga ada tambahan. terimakasih
Terima kasih atas kunjungannya sob, mari kita sama2 mencari optimalisasi agar bisa lebih cepat hehe!
DeleteIya setelah saya cek blognya sobat, Leverage browser caching berada pada high priority, sedangkan saya di medium, untuk blogspot sih masalah itu blum bisa kita atasi!
Coba Anda test rubah struktur htmlnya jd html5 siapa tau bisa menjadi medium priority :) trus di cek ulang
Kayaknya saya harus meninjau kembali kecepatan loading blog saya dengan layanan tsb sob coz blog saya sdh mulai banyak lagi lemaknya nih. Dan setelah saya cek blog saya di layanan PageSpeed Insights — Google Developers tsb, medium priority-nya banyak amat... :D
ReplyDeleteMantap nih sob....kecepatan loadingnya lebih cepat. patut di coba nih sob pada blog percobaan dulu tentunya, sehingga bisa mendapatkan hasil yang baik pula.
ReplyDeleteSaya sudah praktekan sob,hasil kompress 82 persen,tapi setelah dicek ulang ko masih ada yah minify html nya itu-itu juga.
ReplyDeleteBerarti belum sempurna dan belum beruntung kang, coba di pres ulang dengan MiniWebTool! hanya, bagi yg sering utak atik HTML bakal sulit jika ada yang mau diedit lagi :)
DeleteSalam
kira2 pengaruh gk sob kalau kita masih ingin edit template,,so template kita kan sudah di kompres,maksudnya apakah script HTML kita yang di template berubah?
ReplyDeleteKalau udah dikompress dan ingin mengedit ulang mungkin akan agak susah mencari kodenya sob, tp kalau menggunakan F3 atau Ctrl + F akan memudahkan pencarian kode! Saran, agar jgn terlalu keseringan mengedit templatenya sob :)
DeleteHmmmm.... baru aja praktekkan cara di atas dan setelah dikompres, kode template saya memang berkurang tapi setelah saya coba upload ulang kode template yg sdh dikompres trus saya coba lihat lagi di PageSpeed Insights — Google Developers kok Minify HTML nda ilang2 juga ya sob,...?? Jadi galau tingkat dewa nih kalau begini terus hasilnya... :v
ReplyDeleteBerarti Anda belum beruntung Bro.. :) Hehe...
DeleteCoba klik Show Options nya, Lalu ganti Safe Minimization menjadi Aggressive Minimization
Kemudian Compress ulang, dijamin hilang bro :)
Selamat Mencoba!
Balik lagi nih bro, saya udah coba lagi cara di atas sesuai penjelasan bro dan tambahan setingan sesuai dengan yg bro sarankan pada komentar sebelumnya tapi Minify HTMLnya kok masih ada ya bro dan ada yang nggak berfungsi malah yaitu link teks GA di homepage blog saya nda berfungsi nih terpaksa saya kembalikan lagi ke template sebelumnya. Saya jadi bingung nih bro, apa maunya ini template. Udah nggak mau dioptimasi. Saya khawatir jgn sampe ini template blogq udah over optimasi... :D
Delete87 termasuk berat gak sob.?
ReplyDeleteklo di kompres apa tidak pa" dengan script" dan ccs lainnya.?
apa gak terjadi error nanti sob.?
dulu pernah coba kompres tp kok malah jadi banyak yang error ya.?
Masih kategori lambat sih.
DeleteDulu pake layanan apa sob?
Pernah dulu saya kompres malah JS untuk Comentar gak berfungsi, tapi setelah saya pake layanan yg diatas, Alhamdulillah lihat sendiri di blog saya ini... Full Compress tapi Aman terkendali :)
Tips ini saya coba dulu diblog saya lalu saya tuangkan melalui artikel
hati2 dalam kompres html pastikan lepas dulu java script sebelum di kompres berdasarkan penglaman aja, :D dan jangan Expand Template Widget kalo tidak pgn template anda rusak karena dalam struktur default html itu ada java scriptnya :D
ReplyDeleteTerima kasih udah ngingatin sob!
DeleteSaya berani membuat artikel ini karena sudah saya lakukan sendiri pada template blog saya ini, tidak percaya?
Silahkan cek sendiri! dan lihat hasilnya.
Semua blogger tau, didalam struktur xml blogspot ada tipe javascript, css dan html itu sendiri! Saya mencoba melakukan compress mulai dari kode paling atas dan bawah dengan keadaan Expand Template Widget, awalnya ragu tapi saya coba Preview, dan alhasil tidak ada masalah!
Maka dari itu saya berani melakukan Save perubahan!
Dan saya katakan Done :) Selamat tinggal Minify HTML
Mudah2an dengan menerapkan compress HTML ini pada kode template blog saya, bisa mempercepat waktu loading blog saya nantinya. Makasih atas informasinya sob dan sekalian mohon kunjungan baliknya ya di blog saya. Masih newbie nih.. :)
ReplyDeleteArtikel ini bagus banget, gan!
ReplyDeleteCuma masih sedikit bingung di pesan "Minify HTML" itu emang keluarnya sebelah mana ya gan?
Ane dah cek blog ane yang keluar tulisan "The page Free Submit Url | Direktori Web Blog ... got an overall PageSpeed Score of 82 (out of 100)."
Apa masih perlu di kompres juga gitu?
Trims sebelumnya.
Dibagian kiri pak pada kategori Low Priority
Deletesudah lumayan bagus untuk hasil 82 pak, sedikit lagi 90 atau 100 hehe
agar lebih perfect
terima kasih