Coba lihat gambar di bawah ini.
Sekarang, coba anda disable load images pada browser anda, dan refresh halaman ini.
Apa yang terjadi? Ya, gambar di atas tetap tampil. Kenapa bisa begitu? Bagi kamu yang sudah tahu, pasti akan mengatakan, "itulah CSS". Lohh, itu CSS? Apa sih sebenarnya CSS?
CSS merupakan singkatan dari Cascading Style Sheets, yaitu salah satu bahasa pemrograman web untuk mengendalikan komponen-komponen dalam sebuah web agar testruktur dan seragam serta rapi.
Contohnya, jika kita ingin menentukan letak atau posisi widget agar terlihat ideal, seperti jarak tepi, jarak widget dari tepi kanan atau kiri halaman browser, dll.
Selain untuk menentukan tata letak, CSS juga dapat digunakan untuk menggambar obyek. Dan kelebihan obyek yang digambar dibandingkan dengan obyek gambar yang biasa kita upload adalah CSS akan lebih ringan source memory dan lebih cepat loadingnya. Kenapa bisa begitu? Ya balik lagi, karena CSS merupakan bahasa pemrograman web yang sudah support pada banyak browser.
Misalkan kita ingin membuka sebuah gambar .jpg di web, maka yang dilakukan browser adalah mendownloadnya kemudian menampilkannya di layar browser. Tidak dengan CSS, jika kita ingin menampilkan gambar yang dihasilkan dengan CSS, maka yang dilakukan browser hanya membaca kode CSS tersebut, kemudian menerjemahkannya dan menampilkannya di layar browser.
Kelebihan lainnya adalah, jika kita disable load images pada browser kita, maka gambar .jpg tidak akan tampil sedangkan gambar yang dibangun dengan CSS akan tetap tampil. Kenapa bisa begitu? Ya balik lagi, yang dilakukan browser hanya membaca kode tersebut, dan browser tidak mengenalinya sebagai suatu gambar, tapi hanya sebuah kode CSS.
Dengan perkembangan CSS sampai sekarang ini, CSS telah support pada banyak browser seperti Firefox, Chrome, Opera, dll.
Kekurangannya adalah, beberapa browser seperti Internet Explorer belum support fitur dan kode CSS sepenuhnya, sehingga tidak dapat membaca seluruh kode CSS yang mengakibatkan gambar CSS tidak tampil sebagai mana mestinya.
Tapi, apa hari gini masih ada yang setia memakai Internet Explorer? Jarang sekali. Jika dilihat dari statistik blog saya, mayoritas pengunjung menggunakan Firefox dan Chrome, sedangkan pengguna IE kurang dari 3%.
Pernahkah anda mengunjungi blog atau situs yang dibangun mayoritas dengan kode-kode CSS? Lihatlah betapa ringannya blog tersebut. Contohnya, tengoklah indaam.com, hanya homepage blog ini yang penuh dengan gambar, selebihnya? Mayoritas dibangun dengan CSS. Blog inilah yang memperkenalkan saya dengan kode-kode CSS, dan banyak sekali gambar atau logo yang dibuat murni dengan CSS di sana. Dan logo Sampoerna mild di atas berasal dari blog indaam.com.
Inilah halaman tempat logo Sampoerna Mild yang dibuat murni dengan CSS http://www.indaam.com/2011/11/bikin-sampoerna-a-mild-logo-dengan-css3/
Cobalah kunjungi dan disable Load Images pada halaman itu, lihat betapa cepat loading halaman tersebut namun tampilan tetap tampak rapi seperti halaman yang diload sempurna beserta gambar-gambarnya :)
Sekarang, coba anda disable load images pada browser anda, dan refresh halaman ini.
Apa yang terjadi? Ya, gambar di atas tetap tampil. Kenapa bisa begitu? Bagi kamu yang sudah tahu, pasti akan mengatakan, "itulah CSS". Lohh, itu CSS? Apa sih sebenarnya CSS?
Contohnya, jika kita ingin menentukan letak atau posisi widget agar terlihat ideal, seperti jarak tepi, jarak widget dari tepi kanan atau kiri halaman browser, dll.
Selain untuk menentukan tata letak, CSS juga dapat digunakan untuk menggambar obyek. Dan kelebihan obyek yang digambar dibandingkan dengan obyek gambar yang biasa kita upload adalah CSS akan lebih ringan source memory dan lebih cepat loadingnya. Kenapa bisa begitu? Ya balik lagi, karena CSS merupakan bahasa pemrograman web yang sudah support pada banyak browser.
Misalkan kita ingin membuka sebuah gambar .jpg di web, maka yang dilakukan browser adalah mendownloadnya kemudian menampilkannya di layar browser. Tidak dengan CSS, jika kita ingin menampilkan gambar yang dihasilkan dengan CSS, maka yang dilakukan browser hanya membaca kode CSS tersebut, kemudian menerjemahkannya dan menampilkannya di layar browser.
Kelebihan lainnya adalah, jika kita disable load images pada browser kita, maka gambar .jpg tidak akan tampil sedangkan gambar yang dibangun dengan CSS akan tetap tampil. Kenapa bisa begitu? Ya balik lagi, yang dilakukan browser hanya membaca kode tersebut, dan browser tidak mengenalinya sebagai suatu gambar, tapi hanya sebuah kode CSS.
Dengan perkembangan CSS sampai sekarang ini, CSS telah support pada banyak browser seperti Firefox, Chrome, Opera, dll.
Kekurangannya adalah, beberapa browser seperti Internet Explorer belum support fitur dan kode CSS sepenuhnya, sehingga tidak dapat membaca seluruh kode CSS yang mengakibatkan gambar CSS tidak tampil sebagai mana mestinya.
Tapi, apa hari gini masih ada yang setia memakai Internet Explorer? Jarang sekali. Jika dilihat dari statistik blog saya, mayoritas pengunjung menggunakan Firefox dan Chrome, sedangkan pengguna IE kurang dari 3%.
Pernahkah anda mengunjungi blog atau situs yang dibangun mayoritas dengan kode-kode CSS? Lihatlah betapa ringannya blog tersebut. Contohnya, tengoklah indaam.com, hanya homepage blog ini yang penuh dengan gambar, selebihnya? Mayoritas dibangun dengan CSS. Blog inilah yang memperkenalkan saya dengan kode-kode CSS, dan banyak sekali gambar atau logo yang dibuat murni dengan CSS di sana. Dan logo Sampoerna mild di atas berasal dari blog indaam.com.
Inilah halaman tempat logo Sampoerna Mild yang dibuat murni dengan CSS http://www.indaam.com/2011/11/bikin-sampoerna-a-mild-logo-dengan-css3/
Cobalah kunjungi dan disable Load Images pada halaman itu, lihat betapa cepat loading halaman tersebut namun tampilan tetap tampak rapi seperti halaman yang diload sempurna beserta gambar-gambarnya :)
info yang bagus kawan
BalasHapusterima kasih
thanks sob, sama-sama
HapusNice info sob
BalasHapus