mengkompres gambar PNG dengan PngGauntlet. Hasilnya tidak mengecewakan untuk menghemat besar gambar tanpa menghemat kualitasnya. Selain itu, dijalankan pula beberapa langkah lain, salah satunya: melakukan perampingan CSS. Mudah-mudahan di sekarang ini loadtime sudah menyusut walaupun belum optimal (mudah-mudahan ga kelamaan ya).Kembali ke CSS. File CSS yaitu seluruh isi hukum style CSS yang ada di dalam template HTML, XML, maupun yang lainnya. Seluruh hukum tersebut kemudian dirangkum menjadi satu selaku suatu file yang dibaca oleh browser. Nah, pada bab ini, ada banyak hukum tidak perlu yang dapat kita hapus biar tidak mengambil space alasannya yaitu kian banyak space makin besar ukuran file.
Lalu bagaimana cara menghemat ukuran file CSSnya?
1. Lakukan Editing CSS Secara Manual.
Ada beberapa teladan hukum berikut ini:
Misalnya hukum pada header-wrapper,
#header-wrapper {background: url(http://www.freeimagehosting.net/uploads/e439563253.jpg) no-repeat #000;
height: 150px;
margin-top: padding: 0px 0px 0px 0px;
text-align: center;
border: 1px solid #000;
}
Contoh di atas yaitu penataan CSS secara standar, dimaksudkan biar browser sanggup membaca hukum dengan baik dan urut. Namun pada di saat ini, semua browser sudah memiliki kecepatan dan kesanggupan baca yang tinggi (anda sudah tidak pake IE 6 yang antik itu lagi kan?), sehingga hukum menyerupai di atas tidak menjadi hal wajib. Aturan di atas memiliki white space (sisa ruang) dan juga spasi. Kita sanggup melakukan perampingan pada ruang-ruang tersebut. Contoh:
#header-wrapper{background:url(http://www.freeimagehosting.net/uploads/e439563253.jpg) no-repeat #000;height:150px;margin-top:padding:0px 0px 0px 0px;text-align:center;border:1px solid #000;}Pada teladan styling berikut:
{Margin-top: 15px;
Margin-right: 10px;
Margin-bottom: 15px;
Margin-left: 15px; }
Style margin di atas sanggup kita rampingkan dengan CSS short-hand dan menghemat spacenya:
{Margin:15px 10px;}
Karena nilai margin atas dan bawah sama serta nilai kanan dan kiri sama, kita sanggup merampingkan dengan cara di atas, dimana 15px mewakili ukuran atas-bawah dan 10px mewakili kanan-kiri. Jika semua nilai margin sama, misalnya 15px, kita tinggal tuliskan: {margin:10px}. Perhatikan bahwa semua hukum nilai dimulai dari atas dan berlangsung searah jarum jam: atas, kanan, bawah, dan kiri.
Ehm, sudah mulai pusingkah? Tidak kan? Bukankah menuntut ilmu itu menyenangkan? ^^ Untuk melakukan cara-cara lain dan kalau terpesona anda sanggup mendatangi W3 School.
2. Gunakan Layanan Situs-situs Penyedia Tool Kompres CSS Secara Online
Nah ini bab yang lebih mudah. Anda sanggup menggunakan beberapa tool layanan kompresi CSS dan dalam sekejap anda pribadi memperoleh hasilnya. Silahkan kunjungi:
Atau anda sanggup mencari situs yang lain lewat googling dengan keyword "css compression tool".
Langkah-langkahnya:
a. Copy semua hukum CSS dari template HTML/XML.
b. Setelah masuk ke situs layanan kompresi CSS yang anda pilih, paste semua aba-aba tersebut dan klik 'compress', 'optimize', dan lains ebagainya.
c. Tunggu beberapa di saat dan karenanya akan keluar lengkap dengan hasil ukuran file terakhir sehabis kompresi dan perbandingannya. Perbedaan yang kecil sekalipun akan sungguh besar lengan berkuasa kepada berkurangnya loadtime halaman.
d. Download backup template apalagi dulu pada halaman edit HTML.
e. Hapus bab dimana anda mengkopi aturanCSS tadi dan masukkan hasil kompresi ke bab tersebut.
f. Preview dan kalau tidak ada dilema lagi, save.
Clue:
Seluruh code CSS terletak di bab head. Lebih tepatnya, semua code CSS pengatur penampilan terletak di antara <b:skin> dan ]]></b:skin>.
Pilih jenis/opsi kompresi 'standard' atau sejenisnya pada tool kompresi CSS yang anda gunakan.
Semoga berharga dan Good luck.
mencuri yaitu pekerjaan pengecut! © buka-rahasia.blogspot.com
