,
Headlines News :
Home » » Cara Mengkompres Code HTML,JavaScript , & CSS

Cara Mengkompres Code HTML,JavaScript , & CSS

Written By Nanda Journey on Senin, 05 Desember 2011 | 21.42

ok kali ini saya akan Posting tentang cara mengkompres HTML, Java Script, & CSS



Perlu anda ketuhui kecepatan loading blog menjadi salah satu faktor SEO dan penilaian search engine kepada situs kita jika anda ingin memiliki posisi yang bagus di mesin pencari maka buanglah segala pernak-pernik yang membuat situs menjadi lama untuk di buka, seperti widget flash, atau fotodengan size yang besar dan kurangi penggunaan javascript.


Blog orizaman.co.cc ini mungkin dapat dikategorikan sebagai blog yang cukup berat, sebab banyak sekali menggunakan javascript terutama pada bagian "Halaman Home". 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:
textfixer
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

sekedar masukan dari saya sebelum mengkompres HTML, cobalah kelola HTML shobat terlebih dahulu, siapa tahu ingin menambah dan mengubah menu, label, icon dan semacamnya, kemudian kalau sudah siap langsung ke TKP, coz, HTML kalau udah dikompres akan beda dengan yang sebelumnya, kalau ingin tau silahkan coba. 


2. HTML Compressor - Situs: Boryi.com
Fungsi dari HTML
compressor tidak jauh berbeda dari CSS compressor, HTML compressordigunakan 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 kodejavascript 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 saya selain ini di 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 denganPhotoshop silahkan menggunakan layanan dari Dynamic Drive.




Anda sedang membaca artikel tentang Cara Mengkompres Code HTML,JavaScript , & CSS dan anda bisa menemukan artikel Cara Mengkompres Code HTML,JavaScript , & CSS ini dengan url http://hy-hack.blogspot.com/2011/12/cara-mengkompres-code-htmljavascript.html,Dilarang menduplikat artikel ini Cara Mengkompres Code HTML,JavaScript , & CSS jika sangat bermanfaat hanya boleh sebagai artikel refrensi atau harus mengulas nya dengan bahasa / kalimat yang berbeda dan memberi link ini : Cara Mengkompres Code HTML,JavaScript , & CSS


Artikel Terkait:

Share this post :

Poskan Komentar

Blog Dofolow , Tapi Tolong jangan nyepam dan ada kata kata yang tidak baik

 
Support : Abaut Us | Contact Us | Privacy Policy | Term of Use | Redaksi | Advertise | Lowongan Kerja | Forum | Tabloit | Mobile Version | Hy Hack Toolbar
Copyright © 2011. HY hack - All Rights Reserved Template Created by Heykhend
Published by Heykhend Corp. Developed by PT Heykhend Publik Media (HPM)