Pengertian CSS "Cascading Style Sheet"

Biasanya CSS digunakan untuk mendesain sebuah halaman HTML dan XHTML, tetapi sekarang CSS bisa diaplikasikan untuk segala dokumenXML, termasuk SVG dan XUL bahkan ANDROID.

CSS dibuat untuk memisahkan konten utama dengan tampilan dokumen yang meliputi layout, warna dan font. 

Pemisahan ini dapat meningkatkann daya akses konten pada web, menyediakan lebih banyak fleksibilitas dan kontrol dalam spesifikasi darisebuah karakteristik dari sebuah tampilan.

Memungkinkan untuk membagi halaman untuk sebuah formatting dan mengurangi kerumitan dalam penulisan kode dan struktur dari konten, contohnya teknik tableless pada desain web.

CSS juga memungkinkan sebuah halaman untuk ditampilkan dalam berbagai style dengan menggunakan metode pembawaan yang berbeda pula, seperti on-screen, in-print, by voice, dan lain-lain. Sementara itu, pemilik konten web bisa menentukan link yang menghubungkan konten dengan file CSS.

Jika teman-teman sudah mengenal yang namanya HTML tidak dipungkiri lagi bahwa teman-teman tidak mungkin tidak tahu sahabatnya HTML atau temannya yaitu CSS. HTML dan CSS jarang sekali pisah jika saat membuat peformatan web dan lain-lainnya.

CSS dan HTML ?

Lalu, apa hubungannya HTML dengan CSS? Keduanya sangat berhubungan erat. CSS adalah kode-kode yang dipakai untuk mendesain sebuah laman HTML. 

Jika HTML diibaratkan sebagai seorang manusia, maka CSS adalah pakaian yang membuat penampilan menjadi semakin menarik. 

CSS akan membantu para web designer untuk mengubah tampilan teks (baik dari bentuk dan ukuran font maupun warnanya), menambahkan gambar, hingga mengubah latar belakang sebuah halaman HTML.

Keberadaan CSS bisa terlihat dengan adanya atribut warna teks. Di sini CSS memberi perintah berupa teks berwarna biru melalui tag <span> dengan atribut class=”warna”. 

Jadi setiap tag <span> muncul, teks yang mengikutinya akan berwarna biru. Pun demikian saat kamu ingin mengganti warnanya. 

Tinggal mengganti CSS pada tag <style> dari “blue” ke warna lain, maka teks yang awalnya berwarna biru akan berubah warna.

Setelah memahami hubungan antara CSS dengan HTML, mari lanjutkan belajar CSS ke poin selanjutnya yaitu tentang fungsi.

Fungsinya CSS ?

Sebenarnya untuk fungsi CSS kamu sudah bisa mengetahuinya dari penjelasan sebelumnya. Pada dasarnya, CSS berfungsi untuk mendesain, membentuk, serta mengubah tampilan halaman sebuah website. CSS dapat bekerja dan berlaku melalui tag HTML. 

Dengan adanya CSS, tag HTML yang sederhana dapat diubah sehingga tampilan laman website pun menjadi terlihat lebih menarik dan efisien.

Teman-teman bisa mendesain berbagai macam tampilan menggunakan CSS sehingga sesuai dengan kebutuhan. Selain itu, ada beberapa keuntungan yang bisa Teman-teman dapatkan ketika menggunakan CSS, seperti:

1. Mempercepat Proses Desain

Apa yang akan Teman-teman lakukan jika menggunakan desain yang sama di beberapa halaman HTML? Teman-teman mungkin akan menyalin satu per satu ke setiap file halaman.

Sesuai dengan pengertian CSS, jika menggunakan CSS, Teman-teman tidak perlu melakukan itu lagi. CSS apa yang akan Teman-teman lakukan jika menggunakan desain yang sama di beberapa halaman HTML? Teman-teman mungkin akan menyalin satu per satu ke setiap file halaman. Jika menggunakan CSS, Teman-teman tidak perlu melakukan itu lagi.

Ketika menggunakan CSS, Teman-teman cukup mengetikkan satu kali fungsi CSS kemudian menggunakannya di berbagai halaman HTML. 

Fungsi CSS yang Teman-teman buat dalam satu file dapat Teman-teman panggil ke berbagai halaman web tanpa harus menyalin baris kode fungsi berkali-kali.

2. Halaman Lebih Cepat Dimuat

Jika menggunakan CSS, Teman-teman tidak perlu menuliskan atribut tag HTML di setiap file. 

Teman-teman hanya cukup menulis satu aturan CSS dan menerapkannya di berbagai file yang membutuhkannya hanya dengan memanggilnya.

Jadi satu file hanya mengandung sedikit baris kode yang dimuat. Nah, sedikit baris kode inilah yang akan membuat proses download menjadi lebih cepat.

3. Proses Pemeliharaan Mudah

CSS memudahkan teman-teman untuk mengubah tampilan di berbagai halaman. Hanya dengan mengubah fungsi style di file CSS maka seluruh tampilan yang menggunakan fungsi tersebut akan berubah secara otomatis.

4. Style Lebih Beragam Dibanding HTML

CSS mempunyai atribut lebih beragam dibandingkan dengan HTML. Apa keuntungannya? teman-teman mempunyai lebih banyak pilihan tampilan halaman website.

5. Kompatibel Dengan Berbagai Macam Perangkat

CSS memungkinkan konten teman-teman dapat dioptimasi di lebih dari satu perangkat. Misal ketika memproses sebuah dokumen. 

Jika menggunakan CSS, teman-teman bisa menyesuaikan tampilan dokumen di perangkat versi lama sekaligus di versi yang baru.

6. CSS Menjadi Standar Pengembangan Website

Hampir seluruh website yang ada di internet menggunakan CSS di dalamnya. Selain tampilannya yang lebih menarik, kebanyakan browser populer saat ini juga mendukung CSS. 

Jadi jika Teman-teman ingin mengembangkan website yang sesuai standar browser populer, sebaiknya gunakan CSS. Teman-teman pasti juga ingin website dapat kompatibel dengan berbagai macam browser kan?.

Cara kerja CSS

Untuk cara kerjanya sendiri kamu bisa melihat pada Gambar 1. CSS beroperasi melalui tag <style> dengan atribut class warna. 

Dengan adanya CSS pada HTML tersebut maka pengaturan warna teks akan menjadi lebih mudah. Saat kamu ingin mengganti warna teks cukup mengetikkan tag <span> tanpa harus menulis ulang perintah.

Jadi bisa disimpulkan bahwa CSS akan menghemat waktumu dengan perintah-perintah yang efisien.

Hal ini bisa terjadi karena CSS sendiri dikembangkan untuk bisa mengubah tampilan laman website tanpa harus mengganti isi konten. 

Jika kembali pada perumpamaan manusia dan pakaian di poin sebelumnya, dengan CSS kamu tidak mengubah bentuk manusianya tapi hanya mengganti pakaiannya. 

Dengan begitu untuk mengubah dan memprogram ulang tampilan website pun bisa dilakukan dalam waktu cepat.

Peran CSS

Dari sini kamu bisa menyimpulkan bahwa peran CSS untuk website sangatlah penting. 

Tanpa adanya CSS, tampilan website akan membosankan atau bahkan membutuhkan waktu lama untuk loading. 

Bayangkan saja kamu hanya bisa bergantung pada HTML untuk membuat sebuah situs. Bukan cuma tampilan situs akan “hambar” tapi kamu juga butuh waktu lebih lama karena harus berulang kali mengetikkan perintah.

Keuntungan belajar CSS

Dengan belajar CSS kamu (sebagai seorang web designer) bahkan bisa lebih mudah mengendalikan website. 

Kamu tidak harus pusing-pusing mengutak-atik HTML saat harus memprogram ulang tampilan laman. Bahkan pada CSS tingkat lanjut, kamu bisa mengatur website lewat medium yang lain seperti suara.

Keuntungan lain dari belajar CSS adalah tingkat compatibility yang tinggi. CSS kompatibel dengan kebanyakan browsers dan sangat user-friendly.

Kesimpulan :

Meskipun bahasa pemrograman CSS mudah dipelajari, tapi bisa memberikan efek yang sangat besar bagi pengembangan website. 

CSS memudahkan Anda untuk mengatur berbagai tampilan yang di dalam website dengan tidak mengesampingkan user experience. 

Anda bisa mengatur warna, ukuran font, jenis layout, dan berbagai macam pengaturan tampilan sehingga bisa sesuai dengan kebutuhan yang diinginkan.

Jadi, ketika HTML merupakan pondasi, kerangka, tembok, atau bahan baku semen untuk mendukung pembangunan website, CSS merupakan cat, desain jendela, dan berbagai macam pengaturan setelahnya.

CSS adalah solusi dari pengambangan tampilan bangunan website Anda.

Terima kasih sudah berkunjung di himang.my.id semoga ilmu dan materi diatas bermanfaat...

See You Again...