Optimalisasi HTML ~ Rippons Birdwing

Bermula dari pertanyaan kawan, "Mbel, kandangku ko' abot yo.?". Waduuh.. kerjaan lagi nih. Mendingan kalo di bayar.. Maka dengan berat hati kita ngoprekin blog-nya dia. Uuuh sirahku jadi cekot-cekot, soalnya waktu kita anjurkan buat ganti templatenya.. katanya, "Jangan doonk.. rugi tau..!". Aseeeeemmm...

Salah satu penyebab lambatnya loading blog/web adalah besarnya ukuran template blog/web.

Jika ukuran templatenya saja sudah besar, gimana nanti kalau sudah di isi postingan ? Mungkin bagi beberapa blogger yang sudah susah-payah membangun sebuah blog, akan merasa sayang untuk mengganti template-nya. Iya doonk.. emangnya nyewa warnet ga' pake duit..!

Bila kita merasa sayang untuk mengganti template, maka salah satu cara agar loading blog lebih baik adalah dengan meng-optimalkan template. salah satu caranya adalah dengan menghilangkan baris kosong pada template.

Caranya :

1. Login ke blogger, masuk dashboard, rancangan, edit HTML

2. Klik download template lengkap sebagai backup.

3. copy template xml script ke notepad.

contoh xml sebelum di edit:

<?xml version="1.0" encoding="UTF-8" ?>-baris
<!DOCTYPE html>-baris
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>-baris
<head>-baris
    <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>-baris
    <b:if cond='data:blog.isMobile'>-baris
      <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>-baris
    <b:else/>-baris
      <meta content='width=1100' name='viewport'/>-baris
    </b:if>-baris
    <b:include data='blog' name='all-head-content'/>-baris
    <title><data:blog.pageTitle/></title>-baris

    <b:skin><![CDATA[
/* Variable definitions
   ====================
   <Variable name="keycolor" description="Main Color" type="color" default="#ffffff" value="#ffffff"/>-baris

   <Group description="Page" selector="body">-baris
     <Variable name="body.font" description="Font" type="font"
         default="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>-baris
     <Variable name="body.background.color" description="Background Color" type="color" default="#000000" value="#000000"/>-baris
     <Variable name="body.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>-baris
   </Group>-baris
-----------------------------------------------
</html>

Tampak diatas, setiap syntax di pisahkan dengan baris

4. Dengan notepad atau secara langsung di halaman edit HTML, kita akan menghilangkan baris kosong pada template.

5. Ganti setiap syntax yang dipisahkan oleh baris dengan spasi sehingga setiap syntax hanya di pisahkan oleh spasi. Sehingga jadinya seperti ini:

<?xml version="1.0" encoding="UTF-8" ?>spasi<!DOCTYPE html>spasi<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>spasi<head>spasi<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>spasi<b:if cond='data:blog.isMobile'>spasi<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>spasi<b:else/>spasi<meta content='width=1100' name='viewport'/>spasi</b:if>spasi<b:include data='blog' name='all-head-content'/>spasi<title><data:blog.pageTitle/></title>spasi<b:skin><![CDATA[/* ----------------------------------------------- </html>

6. Setelah selesai mengganti semua baris syntax dengan spasi, klik pratinjau. Jika terjadi kesalahan parse cari kesalahannya lalu perbaiki. Kalo soal beginian cari sendiri, ya.. sekalian belajar gitu..

7. Jika hasil pengeditan dapat di tampilkan dalam hasil pratinjau, maka save template.
8. Buka blog dan test hasilnya, jika ada kesalahan dan ada yang tidak beres pada blog, upload template yang tadi kita download.

Dengan cara ini, maka gap pengeksekusian setiap syntax lebih dekat. Sehingga dapat mengurangi sedikit waktu loading.

Selamat mencoba, dan selamat berpusing ria..^_^

3 Comments:

om_dela said...: wah ... mas perlu dicoba ini... belajar ahhhh; April 5, 2011 at 9:45 PM
Iwan-author said...: @om_dela, Monggo di coba om..
Kalo ada kesalahan, tolong laporkan yoo.. biar kita dapat mengoreksinya, jadinya postingan kita bisa di pertanggung jawabkan gitu..
tengkyu..^_^; April 5, 2011 at 10:38 PM
Nasrullah said...: ooo gt ya..trims; November 27, 2012 at 2:50 PM

Pages

Rippons Birdwing

Optimalisasi HTML

3 Comments:

Post a Comment

Recent Posts