Kecepatan Loading Blog Menjadi Salah Satu Faktor SEO.

Kecepatan loading blog menjadi salah satu faktor SEO. Blog ini mungkin dapat dikategorikan sebagai blog yang cukup berat karena banyak sekali menggunakan javascript terutama pada sidebar Oleh sebab itu saya seringkali berusaha melakukan kompresi untuk sedikit mempercepat loading blog tanpa merubah tampilan blog ini. Dibawah ini ada beberapa online tools yang sering saya pakai untuk melakukan kompresi pada blog ini:


1. CSS Compessor - Situs: CSS Drive
CSS compressor sebenarnya sudah pernah saya bahas pada postingan sebelumnya. Fungsi CSS compessor adalah untuk merapihkan dan menghilangkan spasi yang tidak terpakai pada kode CSS, hal ini dilakukan agar kode CSS lebih mudah dibaca saat blog kita dibuka. Untuk lebih jelasnya silahkan baca di postingan "Mempercepat Loading Page Pada Blogger".

2. HTML Compressor - Situs: Boryi.com
Fungsi dari HTML compressor tidak jauh berbeda dari CSS compressor, HTML compressor digunakan untuk merapihkan kode HTML pada blog kita.

3. JavaScript Compressor - Situs: Dean Edwars
Memasang JavaScript pada blog seringkali membuat loading blog menjadi berat, hal ini disebabkan biasanya kode javascript di hosting di luar blogger. Tapi, salah satu faktor lain kenapa kode javascript sering membuat loading blog menjadi berat adalah penyusunan kode javascript yang acak-acakan. Mungkin teman-teman sering memasang kode javascript dari penyedia widget seperti widget recent post, popular post dan sebagainya. Tapi pernahkah teman-teman memeriksa kode javascriptnya? coba perhatikan code javascript "menu tabview" pada sidebar blog ini sebelum di kompres:

function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);

// ----- Tabs -----

var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;

var Tab = Tabs.firstChild;
var i = 0;

do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);

// ----- Pages -----

var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;

var Page = Pages.firstChild;
var i = 0;

do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}

// ----- Functions -------------------------------------------------------------

function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }

function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }


Dibawah ini kode javascript setelah di kompres:

function tabview_aux(TabViewId,id){var TabView=document.getElementById(TabViewId);var Tabs=TabView.firstChild;while(Tabs.className!="Tabs")Tabs=Tabs.nextSibling;var Tab=Tabs.firstChild;var i=0;do{if(Tab.tagName=="A"){i++;Tab.href="javascript:tabview_switch('"+TabViewId+"', "+i+");";Tab.className=(i==id)?"Active":"";Tab.blur()}}while(Tab=Tab.nextSibling);var Pages=TabView.firstChild;while(Pages.className!='Pages')Pages=Pages.nextSibling;var Page=Pages.firstChild;var i=0;do{if(Page.className=='Page'){i++;if(Pages.offsetHeight)Page.style.height=(Pages.offsetHeight-2)+"px";Page.style.overflow="auto";Page.style.display=(i==id)?'block':'none'}}while(Page=Page.nextSibling)}function tabview_switch(TabViewId,id){tabview_aux(TabViewId,id)}function tabview_initialize(TabViewId){tabview_aux(TabViewId,1)}
Hampir semua kode javascript yang ada di blog ini saya compress dan saya hosting ulang agar sedikit mempercepat loading javascript yang saya pasang. Untuk tips gratis menghosting javascript akan saya bahas pada postingan berikutnya.

4. Image Compressor - Situs: Dynamic Drive
Image compressor berfungsi untuk mengkompres ukuran gambar, sebenarnya saya lebih sering menggunakan Photoshop untuk mengkompres gambar, tapi buat teman-teman yang tidak terbiasa dengan Photoshop silahkan menggunakan layanan dari Dynamic Drive.

Mudah-mudahan beberapa online tools di atas bisa bermanfaat buat teman-teman blogger semua..

22 komentar:

  1. Info yang bermanfaat sob
    langsung coba
    makasih ya

    BalasHapus
  2. Saya suka gunakan Situs: Dynamic Drive

    BalasHapus
  3. dicoba deh biar lebih ringan lagi...

    BalasHapus
  4. Selama ini ane baru nyoba CSS Compressor. thanks informasi nya gan. berguna banget nih buat tweaking loading blog biar wass wuss :D

    BalasHapus
  5. Artikel yg bermanfaat. selain itu juga bisa mengurangi berbagai widget yg bisa memberatkan loading blog.

    Visit back ya disini.

    BalasHapus
    Balasan
    1. Benar Bos..widget memang memberatkan namun ada perlunya juga

      Hapus
  6. Wah bagus nih... perlu dicoba nih. Balik dari sini mau nimbang blog trus mau berkompres ria ah :)
    Makasih ya bos :)

    BalasHapus
  7. Alhamdulillaah ini sudah saya lakukan sob kalo nggak salah di awal 2012, sebelumnya blog saya bikin sebel untuk dubuka,
    tapi sekarang maknyus,,,

    wilujeng ngeblog

    BalasHapus
    Balasan
    1. Ya,,setelah saya BW ke blog sobat sangat ringan sekarang

      Hapus
  8. bener banget, kecepata loading sebuah blog akan membuat pembaca betah, karena tidak perlu menunggu lama. kala apa yang dicari lama keluarnya, akhirnya akan ditutup

    BalasHapus
  9. Alhamdulillah Blog saya gak berat ukurannya sobat, jadi memudahkan pengunjung untuk mengaksesnya

    BalasHapus
  10. Terimakasih ilmunya guru, saya perlu cek juga berat blog nih biar diet kalau berat :)
    Nice post

    BalasHapus
  11. Memang pada saat saya check seo blog fotografi saya di suatu tools, disana saya disarankan mengkompres CSS dan htmlnya, solusinya ada di artikel ini, thx.

    BalasHapus
  12. terima kasih sob atas saran-sarannya

    BalasHapus
  13. oh gitu ya gan baru tau nih... makasih ya

    BalasHapus