Apa Itu CSS, Fungsi, Cara Kerja, Jenis Hingga Keuntungan Menggunakannya
Dalam membuat sebuah website, para web developer dan desainer harus mengetahui CSS. Sebab dengan CSS akan mendukung website yang Anda ciptakan lebih teratur dan baik.
Lalu apa itu CSS dan mengapa ia penting dalam dunia web designer?
CSS atau Cascading Style Sheets adalah kumpulan perintah yang digunakan untuk menjelaskan tampilan sebuah halaman situs web dalam mark-up language.
Mark-up language atau bahasa markah tersebut sendiri ialah bahasa pemrograman yang biasanya digunakan membuat website.
Dalam membuat website, pasti Anda mengenal HTML yang merupakan bahasa pemrograman di balik layar sebuah website.
CSS sendiri juga adalah bahasa pemrograman untuk website.
Namun ia berbeda dengan HTML. Perumpamaannya adalah HTML adalah manusia sedangkan CSS adalah pakaian yang dikenakannya. Tujuannya adalah untuk membuat tampilan lebih 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.
Dalam HTML, keberadaan CSS bisa terdeteksi 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.
Begitu juga saat pengguna ingin mengganti warnanya. Tinggal mengganti CSS pada tag <style> dari “blue” ke warna hijau misalnya, maka teks yang awalnya berwarna biru akan berubah menjadi warna hijau.
Jadi, dengan CSS ini, tag HTML yang sederhana dapat diubah sehingga tampilan laman website pun menjadi terlihat lebih menarik dan efisien.
Dari sini Anda 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 Anda cuma dapat bergantung pada HTML untuk membuat sebuah situs. Bukan cuma tampilan situsnya akan “hambar” tapi kamu juga butuh waktu lebih lama karena harus berulang kali mengetikkan perintah.
Cara Kerja CSS
Dalam bahasa pemrograman, CSS beroperasi melalui tag <style> dengan atribut class warna. Dengan adanya CSS pada HTML tersebut maka pengaturan warna teks akan menjadi lebih mudah.
KEtika Anda hendak 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.
Keuntungan Menggunakan CSS
Ada beberapa keuntungan yang bisa Anda dapatkan ketika menggunakan CSS yakni:
1. Proses Desain jadi Lebih Cepat
Dengan menggunakan CSS, Anda tidak perlu menyalin satu per satu perintah. Sehingga proses desain website akan lebih efisien.
Ketika menggunakan CSS, Anda cukup mengetikkan satu kali fungsi CSS kemudian menggunakannya di berbagai halaman HTML. Fungsi CSS yang Anda buat dalam satu file dapat Anda panggil ke berbagai halaman web tanpa harus menyalin baris kode fungsi berkali-kali.
2. Halaman Lebih Cepat Dimuat
Jika menggunakan CSS, Anda tidak perlu menuliskan atribut tag HTML di setiap file. Anda hanya cukup menulis satu aturan CSS dan menerapkannya di berbagai file yang membutuhkannya hanya dengan memanggilnya.
3. Proses Pemeliharaan Mudah
Dengan menggunakan CSS, mengubah tampilan di berbagai halaman akan jadi lebih mudah. 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? Anda mempunyai lebih banyak pilihan tampilan halaman website.
5. Kompatibel Dengan Berbagai Macam Perangkat
Keuntungan lainnya adalah CSS memungkinkan konten Anda dapat dioptimasi di lebih dari satu perangkat. Contohnya saat memproses sebuah dokumen. Jika menggunakan CSS, Anda bisa menyesuaikan tampilan dokumen di perangkat versi lama sekaligus di versi yang baru.
6. CSS Menjadi Standar Pengembangan Website
Selain tampilannya yang lebih menarik, kebanyakan browser populer saat ini juga mendukung CSS, sehingga CC jadi standar pengembangaan website saat ini.
Jenis – Jenis CSS
Terdapat tiga macam CSS yang sering digunakan oleh web designer. Antara lain adalah:
– Inline style sheet, yakni CSS dengan perintah pemrograman yang letaknya ada pada objek.
Contohnya saat Anda ingin mengubah sebuah tulisan pada laman tertentu di website milikmu, inline style sheet CSS harus menempel pada elemen tulisan tersebut. Kamu cukup menambahkan tag <style> saja untuk menerapkan CSS ini.
– External style sheet, yakni CC yang letaknya berbeda dengan laman yang akan diubah. Cara ini lebih praktis daripada inline style sheet karena bisa menghemat ruang dan bisa digunakan berulang-ulang untuk laman web yang berbeda.
Kamu bisa mengenali CSS tipe ini lewat tag <link rel>. Tag ini akan menghubungkan halaman coding pada external style sheet CSS yang terpisah.
– Embedded style sheet, yakni CSS yang berada pada satu laman coding dengan inline style sheet. Maka tidak mengherankan jika embedded style sheet terkadang disebut dengan internal style sheet. Biasanya CSS ini diapit oleh tag <head> </head> dan diawali dengan tag <style>.
Demikian ulasan mengenai apa itu CSS, bagaimana cara kerjanya, apa fungsinya dan apa keuntungan menggunakan CSS. Semoga bermanfaat. (*)