Home » » Kompres CSS, Javascript, HTML Lengkap untuk Loading Cepat Blog

Kompres CSS, Javascript, HTML Lengkap untuk Loading Cepat Blog

Gambar Cara Kompres CSS
Inabuy.com - Banyak blog yang sudah anda kunjungi soal cara kompres CSS, Javascript, atuapun kode HTML anda tapi saya yakin anda kurang puas karena hasil kompresnya tidak memuaskan disebabkan karena website penyedia tool kompres HTML, kompres CSS, dan kompres Javascript yang direferensikan tidak berkualitas ataupun karena artikel yang ditulis membingungkan dan hanya hasil copy-paste saja sehingga tidak memberikan anda solusi tepat cara kompres HTML, cara mengurangi ukuran Javascript serta trik melakukan kompres CSS.

Untuk membantu anda melakukan kompres html, css dan java script blog secara lengkap dan benar guna mempercepat loading blog anda untuk itu saya akan jelaskan satu persatu caranya secara rinci :

Cara Kompres kode CSS blog

Agar caranya benar dan tidak error maka anda harus tau kode css mana yang harus di kompress dari sederetan kode script yang ada di blog anda. Kode css yang harus anda kompres letaknya adalah antara kode <b:skin><![CDATA[/* sampai pada kode css sebelum ]]></b:skin>. Copy semua kode CSS yang ada antara kedua kode berwarna biru tersebut dengan terlebih dahulu mencarinya di blog anda dengan cara (ini untuk pemula bila anda tidak tahu sama sekali caranya):
  • Silahkan menuju ruang pengeditan HTML template blog anda, dari halaman Dasboard klik Desaign  atau tata letak loyout.
  • Kemudian klik Edit HTML
  • Selanjutnya dari kolom edit HTML/edit template, untuk memudahkan pencarian kode css anda tekan tombol Ctrl + F kemudian ketikkan kode <b:skin><![CDATA[/* dan tekan Enter.
Bila sudah silahkan copy semua code css yang saya maksud di atas dan kemudian kunjungi website penyedia layanan compress css yang sudah saya coba dan terbukti keakuratannya (Ingat! sangat banyak yang menyediakan layanan kompres css, tapi cuma ini yang diakui ke akuratannya karna dikelola oleh Yahoo sendiri. Silahkan kunjungi http://www.refresh-sf.com/yui/#output (copy-paste sendiri di browser anda karena ini tidak dibuat link langsung kealamatnya).

Bila sudah terbuka websitenya silahkan paste code css yang anda copy tadi dan ikuti petunjuk ini:
  • Pada bagian file tipe pilih 'CSS' (ini juga berlaku untuk file Javascript karena bila anda menggunakan pilihan 'JS' biasanya akan error hasilnya sekalipun yang akan anda kompres adalah Javascript)
  • Pada global option abaikan saja bila anda tidak menginginkannya.
  • Pada Javascript Option silahkan centang semua kolomnya jika anda ingin hasil yang maksimal.
  • Langsung klik 'Compress' dan abaikan dua kolom yang ada persis di atasnya.
  • Bila sudah ada hasilnya silahkan anda copy dan ikuti langkah selanjutnya.
Terakhir tinggal kembali ke halaman kode css blog anda. Bila keadaannya masih terblok langsung saja paste kode css hasil kompres yang anda copy tadi untuk menimpa kode css aslinya.

Ingat jangan langsung di save. Usahakan untuk melakukan 'preview' kode css-nya terlebih dahulu. Bila telah berhasil maka silahkan anda save, tapi bila tidak clik saja Ctrl + Z untuk membatalkannya.

Cara Kompres kode Javescript Blog

Untuk bagian ini caranya sama dengan cara di atas hanya saja yang perlu saya sampaikan kepada anda adalah mengenai kepastian kode Javascript yang harus anda kompress. Letak kode Javascript yang akan anda kompres letaknya ada antara kode <head> sampai pada kode javascript sebelum </head>

Sebelum memulai saya ingin sampaikan bahwa kode css pada penjelasan sebelumnya sebenarnya juga ada antara kode <head> dan </head> jadi anda seperti mengulang langkah sebelumnya tapi secara keseluruhan kodenya yang anda kompress.

Mengenai cara kompres dan sumber website yang menyediakan fasilitas kompres Javascript adalah sama dengan cara kompres kode css di atas. hanya saja yang perlu anda perhatikan adalah mengenai pemilihan toolnya yang saya jelaskan seperti di atas, yaitu pada "file tipe" tetap pilih 'CSS' sekalipun yang akan anda kompres adalah Javascript karena bila anda menggunakan pilihan 'JS' biasanya akan error hasilnya.

Cara Kompres kode HTML blog

Cara kompres kode html untuk keperluan mempercepat loading blog anda berbeda dengan cara di atas, baik mengenai kodenya maupun dengan website penyedia tool kompres html-nya.

Kode html yang anda kompres letaknya ada antara <body> sampai dengan kode html sebelum </body> caranya cukup lakukan hal yang sama seperti cara kompres css di atas. Hanya saja website penyedia layanan kompres html yang digunakan berbeda. Website yang dimaksud adalah http://www.miniwebtool.com/html-compressor/ (silahkan copy-paste sendiri di browser anda karena ini tidak dibuat link langsung kealamatnya).

Alamat website penyedia fasilitas kompres html yang saya tunjukkan di atas sudah saya coba keakuratannya dan sudah saya bandingkan dengan website fasilitas kompres html yang lainnya. jadi tidak usah khawatir soal hasil kerjanya.

Selamt mencoba !!! Untuk mengembangkan pengetahuan trik SEO anda silahkan lihat artikel terkait "Menuju Trik SEO 2012 yang Berubah Haluan" atau "Trik SEO yang Friendly Versi Google Panda" dan jangan lupa tinggalkan komentar anda untuk menambah backlink anda (Ingat! tanpa url dan promosi karena kami akan menghapus komentar anda).

Lihat juga 'Cara membangun backlink berkualitas'


Share this article :

22 comments:

Unknown said...

Thank's sob....Amazing tutornya....Cara ini yang saya cari....

Agung Purnomo said...

makasih info_a btw ane newbie bnget nih,,, kode2 html aj bru tw sedikit,, tpi bleh dicoba

ibnoe.info said...

terimakasih atas pencerahannya gan, sangat membantu untuk newbie seperti saya....

Unknown said...

sangat bermanfaat sob
tapi ko cara kompres javascript nya error ya

putra said...

tutorialnya sangat membantu
saya sudah mengkompress semua kode css dan js di salah satu blog saya, hasilnya loading blog saya lebih cepat.
terima kasih...

tips dan peluang bisnis said...

maaf gan saya mau tanya, kenapa tampilan setelah saya kompres tidak sesuai dengan tampilan awal, dalam artian saat di kompres malah merubah tampilan blog saya, jadi saya gak jadi comress, mohon bantuanya, terimaksaih sebelumnya

Ucup said...

Thanks gan

adhie said...

thankz info'a....bermnfaat bnged....

Agriculturproduct said...

makasih tutornya mas,sangat membantu.

badali_rextor said...

thank's infonya ya sob

ibnoe cahyadie said...

ga bisa bro..., pada template baru saya langsung ada pesan seperti ini:

Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.
Pesan error XML: The reference to entity "quot" must end with the ';' delimiter.

Seputar Informasi TIK said...

mantap gan caranya
blog gue jadi cepet baget loadingnya

HEXSA said...

saya masih gagal terus ntuk kompres javascript'a...
mohon pencerahan'a sobat...
http://hexsarash.blogspot.com/

Bebas Copy Blogspot said...

Mas kalau Compres Javascribt, tapi di server sendiri gmana..?
kalau format Css sudah berhasil tapi maslahnya di format .js , malah hancur template sya setelah di kompress... tolong bimbingan,a.!

http://jagocopy.blogspot.com/

ArWildo said...

Thank's sob, memang semua toolsnya bedah dari yang lain ~ ~ ~ ~ ~ ~ ~(ノ^_^)ノ

rico ade mandana said...

saya selalu memakai ini setiap ganti template..emang teruji kerennya

Unknown said...

salam sob, ini artikel yg menarik bagi saya. klo boleh tanya, setelah compressed code keluar dibawahnya ada dua pilhan "download compressed file" sama " download gzipped compressed file" perbedaanya apa sob, apakah yg pilihan kedua dgn gzipped jauh lebih ringan lagi? thanks

Artabez.Cam said...

punya saya ko' jd ga karuan sob?
apanya ya yg slh...?

Ben Nafi said...

Thanks sob sharenya.. :)

Rohmatullah said...

Artikelnya berbeda dari yang lainnya, sangat mendetail dan mempermudah Saya mempercepat loading blog Saya :) Terima kasih ya sudah berbagi :)

You'll Never Walk Alone said...

Terima kasih mas atas tutorialnya, sangat membantu saya :)

Kangeryu said...

mantap gan, setelah aku coba memang sih loadingnya cepet, tapi blogku jadi putih semua..:D
jadi, aku urungkan saja niatku, walau agak berat tapi gpp-lah yang penting tampilannya lumayan bagus, ada kepuasan tersendiri juga..
makasi banyak gan, aku sering belajar dr blog ini..
artikelnya bermanfaat banget bagi pemula seperti aku ini..

 
INABUY.COM | Dikelola Oleh ZutaMedia Publisher | Penyedia Ebook SEO - BloggerPro-Z1 - Ebook Tutorial SEO Terlengkap dan Terbaik Di Indonesia Jasa Buat Website | Toko Online | Dengan Bantuan Konsultasi lewat YM dan Email
Powered by Blogger.com | Template By Maskolis.com
Copyright © 2011. EBOOK INABUY - All Rights Reserved