CSS adalah singkatan dari Cascading Style Sheet. Adalah standar pembuatan dan pemakaian style untuk dokumen terstruktur. CSS digunakan untuk mempersingkat penulisan tag HTML \ seperti font,color,text, dan table menjadi lebih ringkas sehingga tidak terjadi pengulangan tulisan. Penggunaan yang paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan HTML maupun XHTML. Meskipun demikian, bahasanya sendiri dapat dipergunakan untuk semua jenis dokumen XML termasuk juga SVG dan XUL. Spesifikasi CSS diatur oleh Word Wide Web Consortium (W3C).
CSS pertama kali bermula sejak munculnya SGML pada tahun 1970an. Sejak kemunculannya tersebut, CSS mengalami perkembangan yang sangat pesat. Format dasar CSS yang banyak kita gunakan sekarang ini merupakan ide dari seoang programmer bernama Håkon Wium Lie yang tertuang dalam proposalnya mengenai Cascading HTML Style Sheet (CHSS) pada bulan Oktober 1994 (dalam konferensi W3C di Chicago, Illinois). Kemudian, beliau bersama-sama dengan seorang temannya yang bernama Bert Bos mengembangkan suatu standard CSS. Pada akhir tahun 1996, CSS telah resmi dipublikasikan (dan menyusul kemudian CSS Level 1 pada bulan Desember). Pengerjaan proyek ini juga didukung oleh seorang programmer bernama Thomas Reardon dari perusahaan software ternama, Microsoft.
CSS digunakan oleh penulis maupun pembaca halaman web untuk menentukan warna, jenis huruf, tata letak, dan berbagai aspek tampilan dokumen. CSS digunakan terutama untuk memisahkan antara isi dokumen (yang ditulis dengan HTML atau bahasa markup lainnya) dengan presentasi dokumen (yang ditulis dengan CSS). Pemisahan ini dapat meningkatkan aksesibilitas isi, memberikan lebih banyak keleluasaan dan kontrol terhadap tampilan, dan mengurangi kompleksitas serta pengulangan pada stuktur isi. CSS memungkinkan halaman yang sama untuk ditampilkan dengan cara yang berbeda untuk metode presentasi yang berbeda, seperti melalui layar, cetak, suara (sewaktu dibacakan oleh browser basis-suara atau pembaca layar), dan juga alat pembaca braille. Halaman HTML atau XML yang sama juga dapat ditampilkan secara berbeda, baik dari segi gaya tampilan atau skema warna dengan menggunakan CSS.
Sekarang penggunaan CSS telah semakin meluas dan terus dikembangkan. Hal ini juga akan mempermudah seorang web designer dalam mengembangkan suatu halaman web (situs).
Ada 3 cara untuk memasang Script CSS pada dokumen HTML yaitu :
Sedikit saran lebih baik menggunakan cara External Style Sheet karena lebih mudah pengelolanya.
Sejarah CSS
CSS 1
Pada tanggal 17 Agustus 1996 World Wide Web Consortium (W3C) menetapkan CSS sebagai bahasa pemrograman standard dalam pembuatan web. Tujuannya adalah untuk mengurangi pembuatan tag-tag baru oleh Netscape dan Internet Explorer, karena kedua browser tersebut sedang bersaing mengembangkan tag sendiri untuk mengatur tampilan web.
CSS 1 mendukung pengaturan tampilan dalam hal :
CSS 2
Pada tahun 1998, W3C menyempurnakan CSS tahap awal dengan menciptakan standard CSS 2 yang menjadi standard hingga saat ini. Pada level CSS 2 ini, dimasukkan semua atribut dari CSS 1 dan diperluas dengan penekanan pada International Accessibiality and Capacibilty kususnya media-specific CSS. CSS 2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di printer.
CSS 3
CSS 3adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam mendesain website. CSS 3 dapat melakukan animasi pada halaman website, diantaranya animasi warna dan animasi 3D. Dengan CSS 3 desaigner dimudahkan dalam hal kompatibilitas websitenya pada smartphone dengan dukungan fitur baru yakni media query. Selain itu, banyak fitur baru pada CSS 3 yaitu : Multiple background, border-radius, drop-shadow, border-image, CSS-Math dan CSS Object Model.
Fitur terbaru CSS 3 :
Keunggulan CSS
Sebelum kehadiran CSS, seorang webmaster harus bekerja ekstra keras menuliskan tag-tag HTML baik untuk mendesain layout ataupun untuk memberi gaya tampilan (style) pada bagian-bagian tertentu dari situ web yang akan dibuatnya. Pekerjaan ini tentu semakin berat apabila situs web tersebut terdiri dari puluhan atau bahkan ratusan halaman dengan tampilan yang berbeda-beda, karena setiap tampilan membutuhkan penulisan tag-tag yang secara mandiri unik. Untuk bagian-bagian dengan tampilan yang sama pun seorang webmaster harus direpotkan dengan penulisan tag-tag HTML secara berulang-ulang. Hadirnya CSS, pekerjaan seorang webmaster menjadi jauh lebih ringan. CSS mampu menghindarkan pengulangan dalam penulisan tag HTML, sehingga ukuran file pun akan jauh lebih kecil. Dengan ukuran file yang kecil, proses loading situs web juga akan jauh lebih cepat.
Meskipun sebuah file CSS bisa diintegrasikan langsung dengan file HTML, namun umumnya file CSS dibuat secara terpisah, sehingga memungkinkan kita mendekorasi tampilan bagian-bagian tertentu dari halaman web secara serempak.
Inilah manfaat paling penting dari CSS! Mempelajari CSS bisa jadi bukan pekerjaan mudah. Namun, ada banyak keuntungan lain yang akan kita peroleh dengan menggunakan CSS ini, yaitu:
1. Update tampilan lebih mudah
Mengupdate tampilan situs web yang terdiri dari beberapa halaman saja tentu jauh lebih mudah daripada untuk situs dengan ratusan atau ribuan halaman. Dengan CSS, kita akan dapat mengupdate tampilan halaman-halaman web dalam jumlah banyak dengan mudah, karena semua tag untuk style ini berada pada satu file CSS saja.
2. Beban bandwidth lebih kecil
Dengan CSS, ukuran file web akan menjadi “langsing” karena tag-tag style dipisahkan secara mandiri. Hal ini secara signifikan akan berdampak pada proses loading yang lebih cepat. Selain itu, CSS hanya akan di-load satu kali oleh browser dan akan terus diterapkan pada halaman-halaman lain. Hal ini berbeda dengan situs yang menggunakan table karena harus di-load berulang-ulang.
3. Modifikasi web template lebih mudah
Cara paling cepat membangun situs web ialah dengan menggunakan template. Namun terkadang template tersebut tidak sesuai dengan keinginan dan keperluan kita. Dengan CSS, kita akan lebih mudah melakukan “vermak” pada template tersebut, misalnya mengganti warna latar atau mengubah jenis huruf.
4. Lebih mudah digunakan pada mobile phone
Sekarang, orang melakukan browsing tidak hanya melalui browser di PC, tetapi juga melalui mobile phone atau PDA. Situs web yang menggunakan CSS akan jauh lebih mudah digunakan oleh mereka yang browsing melalui gadget-gadget tersebut.
5. Seacrh engine friendly
Sebuah situs web yang dilayout dengan CSS akan lebih search engine friendly daripada situs-situs web yang menggunakan table sebagai pondasi layoutnya.
Kekurangan Penggunaan CSS
Tidak semua browser mengartikan kode CSS dengan cara yang sama. Jadi kadang-kadang, tampilan web dengan CSS terlihat baik di browser yang satu, tapi berantakan di browser yang lain. Jadi anda harus memeriksa tampilan supaya terlihat baik di semua browser dan menambahkan kode-kode khusus browser tertentu jika memang dibutuhkan agar tampilan web anda terlihat baik di semua browser.
CSS pertama kali bermula sejak munculnya SGML pada tahun 1970an. Sejak kemunculannya tersebut, CSS mengalami perkembangan yang sangat pesat. Format dasar CSS yang banyak kita gunakan sekarang ini merupakan ide dari seoang programmer bernama Håkon Wium Lie yang tertuang dalam proposalnya mengenai Cascading HTML Style Sheet (CHSS) pada bulan Oktober 1994 (dalam konferensi W3C di Chicago, Illinois). Kemudian, beliau bersama-sama dengan seorang temannya yang bernama Bert Bos mengembangkan suatu standard CSS. Pada akhir tahun 1996, CSS telah resmi dipublikasikan (dan menyusul kemudian CSS Level 1 pada bulan Desember). Pengerjaan proyek ini juga didukung oleh seorang programmer bernama Thomas Reardon dari perusahaan software ternama, Microsoft.
CSS digunakan oleh penulis maupun pembaca halaman web untuk menentukan warna, jenis huruf, tata letak, dan berbagai aspek tampilan dokumen. CSS digunakan terutama untuk memisahkan antara isi dokumen (yang ditulis dengan HTML atau bahasa markup lainnya) dengan presentasi dokumen (yang ditulis dengan CSS). Pemisahan ini dapat meningkatkan aksesibilitas isi, memberikan lebih banyak keleluasaan dan kontrol terhadap tampilan, dan mengurangi kompleksitas serta pengulangan pada stuktur isi. CSS memungkinkan halaman yang sama untuk ditampilkan dengan cara yang berbeda untuk metode presentasi yang berbeda, seperti melalui layar, cetak, suara (sewaktu dibacakan oleh browser basis-suara atau pembaca layar), dan juga alat pembaca braille. Halaman HTML atau XML yang sama juga dapat ditampilkan secara berbeda, baik dari segi gaya tampilan atau skema warna dengan menggunakan CSS.
Sekarang penggunaan CSS telah semakin meluas dan terus dikembangkan. Hal ini juga akan mempermudah seorang web designer dalam mengembangkan suatu halaman web (situs).
Ada 3 cara untuk memasang Script CSS pada dokumen HTML yaitu :
- External Style Sheet (file CSS berbeda dari file HTML),
- Internal Style Sheet (Kode CSS dipasang di dalam tag head HTML)
- Inline Style Sheet (Kode CSS langsung dipasang di tag HTML, tidak direkomendasikan)
Sedikit saran lebih baik menggunakan cara External Style Sheet karena lebih mudah pengelolanya.
Sejarah CSS
CSS 1
Pada tanggal 17 Agustus 1996 World Wide Web Consortium (W3C) menetapkan CSS sebagai bahasa pemrograman standard dalam pembuatan web. Tujuannya adalah untuk mengurangi pembuatan tag-tag baru oleh Netscape dan Internet Explorer, karena kedua browser tersebut sedang bersaing mengembangkan tag sendiri untuk mengatur tampilan web.
CSS 1 mendukung pengaturan tampilan dalam hal :
- Font (Jenis ketebalan).
- Warna, teks, background dan elemen lainnya.
- Text attributes, misalnya spasi antar baris, kata dan huruf.
- Posisi teks, gambar, table dan elemen lainnya.
- Margin, border dan padiing.
CSS 2
Pada tahun 1998, W3C menyempurnakan CSS tahap awal dengan menciptakan standard CSS 2 yang menjadi standard hingga saat ini. Pada level CSS 2 ini, dimasukkan semua atribut dari CSS 1 dan diperluas dengan penekanan pada International Accessibiality and Capacibilty kususnya media-specific CSS. CSS 2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di printer.
CSS 3
CSS 3adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam mendesain website. CSS 3 dapat melakukan animasi pada halaman website, diantaranya animasi warna dan animasi 3D. Dengan CSS 3 desaigner dimudahkan dalam hal kompatibilitas websitenya pada smartphone dengan dukungan fitur baru yakni media query. Selain itu, banyak fitur baru pada CSS 3 yaitu : Multiple background, border-radius, drop-shadow, border-image, CSS-Math dan CSS Object Model.
Fitur terbaru CSS 3 :
- Animasi, sehingga pembuatan animasi tidak memerlukan program sejenis Adobe Flash dan Microsoft Silverlight.
- Beberapa efek teks, seperti teks berbayang, kolom koran dan "Word-Wrap".
- Beberapa efek pada kotak, seperti kotak yang ukurannya dapat diubah-ubah, transformasi 2 dimensi dan 2 dimensi, sudut-sudut yang tumpul dan bayangan.
Keunggulan CSS
Sebelum kehadiran CSS, seorang webmaster harus bekerja ekstra keras menuliskan tag-tag HTML baik untuk mendesain layout ataupun untuk memberi gaya tampilan (style) pada bagian-bagian tertentu dari situ web yang akan dibuatnya. Pekerjaan ini tentu semakin berat apabila situs web tersebut terdiri dari puluhan atau bahkan ratusan halaman dengan tampilan yang berbeda-beda, karena setiap tampilan membutuhkan penulisan tag-tag yang secara mandiri unik. Untuk bagian-bagian dengan tampilan yang sama pun seorang webmaster harus direpotkan dengan penulisan tag-tag HTML secara berulang-ulang. Hadirnya CSS, pekerjaan seorang webmaster menjadi jauh lebih ringan. CSS mampu menghindarkan pengulangan dalam penulisan tag HTML, sehingga ukuran file pun akan jauh lebih kecil. Dengan ukuran file yang kecil, proses loading situs web juga akan jauh lebih cepat.
Meskipun sebuah file CSS bisa diintegrasikan langsung dengan file HTML, namun umumnya file CSS dibuat secara terpisah, sehingga memungkinkan kita mendekorasi tampilan bagian-bagian tertentu dari halaman web secara serempak.
Inilah manfaat paling penting dari CSS! Mempelajari CSS bisa jadi bukan pekerjaan mudah. Namun, ada banyak keuntungan lain yang akan kita peroleh dengan menggunakan CSS ini, yaitu:
1. Update tampilan lebih mudah
Mengupdate tampilan situs web yang terdiri dari beberapa halaman saja tentu jauh lebih mudah daripada untuk situs dengan ratusan atau ribuan halaman. Dengan CSS, kita akan dapat mengupdate tampilan halaman-halaman web dalam jumlah banyak dengan mudah, karena semua tag untuk style ini berada pada satu file CSS saja.
2. Beban bandwidth lebih kecil
Dengan CSS, ukuran file web akan menjadi “langsing” karena tag-tag style dipisahkan secara mandiri. Hal ini secara signifikan akan berdampak pada proses loading yang lebih cepat. Selain itu, CSS hanya akan di-load satu kali oleh browser dan akan terus diterapkan pada halaman-halaman lain. Hal ini berbeda dengan situs yang menggunakan table karena harus di-load berulang-ulang.
3. Modifikasi web template lebih mudah
Cara paling cepat membangun situs web ialah dengan menggunakan template. Namun terkadang template tersebut tidak sesuai dengan keinginan dan keperluan kita. Dengan CSS, kita akan lebih mudah melakukan “vermak” pada template tersebut, misalnya mengganti warna latar atau mengubah jenis huruf.
4. Lebih mudah digunakan pada mobile phone
Sekarang, orang melakukan browsing tidak hanya melalui browser di PC, tetapi juga melalui mobile phone atau PDA. Situs web yang menggunakan CSS akan jauh lebih mudah digunakan oleh mereka yang browsing melalui gadget-gadget tersebut.
5. Seacrh engine friendly
Sebuah situs web yang dilayout dengan CSS akan lebih search engine friendly daripada situs-situs web yang menggunakan table sebagai pondasi layoutnya.
Kekurangan Penggunaan CSS
Tidak semua browser mengartikan kode CSS dengan cara yang sama. Jadi kadang-kadang, tampilan web dengan CSS terlihat baik di browser yang satu, tapi berantakan di browser yang lain. Jadi anda harus memeriksa tampilan supaya terlihat baik di semua browser dan menambahkan kode-kode khusus browser tertentu jika memang dibutuhkan agar tampilan web anda terlihat baik di semua browser.
