Tingkatkan Kecepatan Halaman Web dengan Minify CSS dan JS - Rumah IT

Baru

recent

Tingkatkan Kecepatan Halaman Web dengan Minify CSS dan JS

Tingkatkan Kecepatan Halaman Web dengan Minify CSS dan JS

Apa yang dimaksud dengan Minify CSS ?

Minify CSS atau Meminimalkan CSS adalah meminimalisir kode CSS dengan cara membuat baris program CSS Anda lebih kecil. Karena semua file CSS membuat pemblokiran secara default, sangat penting untuk memiliki CSS teringan terkecil  sehingga laman Anda dapat dimuat dengan lebih cepat.

Jika anda membuka sebuah template blog, disitu akan ada ribuan baris kode CSS yang memanjang ke bawah. Kode CSS dalam template blog umumnya terletak sebelum kode </b:skin> .
Cara gampangnya, minify CSS adalah membuat kode CSS yang tadinya memanjang ke bawah menjadi memanjang ke samping sehingga secara struktur akan mengurangi jumlah baris program yang tadinya berjumlah 1000 baris program CSS, setelah dilakukan minify CSS mungkin bisa menjadi 200-300 baris kode saja.
Dalam mengeksekusi sebuah halaman web, browser akan membaca berdasarkan baris program dalam templete blog anda. Sehingga semakin banyak baris kode yang terbentuk maka semakin lama waktu yang dibutuhkan browser dalam mengeksekusi sebuah halaman web. Maka dilakukanlah metode minify CSS untuk memperkecil baris program dalam template blog anda ?

Tingkatkan Kecepatan Halaman Web dengan Minify CSS
Contoh CSS yang belum dilakukan Minify
Bagaimana Cara Minify CSS ?

Untuk melakukan Minify CSS ada dua cara, yaitu cara manual dan cara otomatis (menggunakan tools).

Cara Minify CSS secara manual :

Untuk melakukan minify CSS secara manual caranya sangat mudah. anda hanya perlu mengganti format penulisan CSS dari format vertikal (memanjang kebawah) menjadi format horizontal (memanjang ke samping). Berikut adala contoh penulisan CSS agar menjadi minify.


body
{
background-color:#d0e4fe;
}
h1
{
color:orange;
text-align:center;
} 

Kode diatas adalah penulisan CSS biasa.

body {background-color:#d0e4fe;}
h1 {color:orange;text-align:center;}

Sedangkan kode diatas adalah CSS yang sudah di minify. Mudah bukan ?

Cara Minify CSS secara otomatis:

Untuk melakukan minify CSS secara otomatis, yaitu menggunakan layanan tool . Banyak website yang menyediakan layanan minify CSS secara online seperti www.cssminifier.com . Caranya sangat mudah, cukup copy CSS pada template blog yang akan di minify lalu pastekan pada form input CSS selanjutnya klik tombol Minify. Maka akan tampil Form disebelah kanan yang berisi kode CSS yang sudah di minify

Tingkatkan Kecepatan Halaman Web dengan Minify CSS

Demikian tutorial blog tentang Tingkatkan Kecepatan Halaman Web dengan Minify CSS. Jika ada pertanyaan dan saran silahkan tinggalkan jejak di komentar. Salam Informatika.
All Rights Reserved by Rumah IT - Rumah Teknologi Informasi © 2013 - 2022
Powered By Blogger

Contact Form

Name

Email *

Message *

Powered by Blogger.