Para web developer pasti sudah paham betul dalam membuat sebuah situs agar situs berjalan dengan optimal dan sesuai dengan tujuan pembuatannya. Tapi, tidak jarang juga developer melakukan kesalahan pada CSS, contohnya seperti salah penulisan kode, kode yang terlalu panjang, dan kesalahan lainnya. Sebelum kita membahas apa saja kesalahan yang sering terjadi, mari kita cari tahu terlebih dahulu “Apa sih CSS itu?”
Cascading Style Sheet atau yang lebih dikenal dengan CSS adalah aturan yang biasanya digunakan untuk mengatur tampilan elemen yang tertulis dalam HTML. CSS ini berfungsi sebagai pemisah antara konten dengan tampilan visualnya pada situs. CSS ini dibuat dan dikembangkan oleh World Wide Web Consortium (W3C) pada tahun 1996 untuk alasan yang sederhana, yakni untuk pemformatan halaman situs. Jadi sudah tahu kan apa itu CSS? Mari kita lanjutkan. Berikut adalah kesalahan pada CSS yang sering terjadi:
Redundant properties
Yang pertama ada redundant properties. Redundant properties adalah penggabungan dua rule styling yang memiliki properti dan value yang sama. Hal ini dilakukan untuk memperpendek kode. Kesalahan yang sering terjadi adalah terkadang para web developer jarang menerapkan redundant properties ini. Berikut adalah contoh penggunaan yang benar dari redundant properties.
💻 Mulai Belajar Pemrograman
Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.
Daftar Sekarang
Tidak memanfaatkan shorthand properties
Yang kedua ada shorthand properties. Shorthand properties adalah properti CSS yang memungkinkan kamu mengatur beberapa value dari properti CSS lainnya secara bersamaan. Dengan menggunakan shorthand properties ini menulis CSS menjadi lebih ringkas sehingga dapat menghemat waktu dan energi. Terkadang web developer tidak memanfaatkan shorthand properties ini, yang mengakibatkan kode menjadi agak panjang.
Tetapi untuk kamu yang baru mempelajari CSS, penggunaan shorthand properties ini dapat membuat kamu kebingungan karena agak sulit untuk menentukan top, right, bottom, dan left dari margin dan padding. Berikut adalah contoh pemanfaatan yang benar dari shorthand properties.
Tidak menyiapkan fallback fonts
Selanjutnya ada fallback fonts. Fallback fonts ini dapat dikatakan sebagai cadangan font, jika font pertama tidak tersedia maka akan menggunakan font cadangan yang sudah ditulis dalam kode CSS.
Contohnya seperti kamu sudah menyiapkan beberapa font pada CSS kamu, jika font pertama tidak dapat digunakan maka system akan memeriksa font kedua, jika font kedua tidak dapat digunakan maka sistem akan memeriksa font ketiga, begitu seterusnya sampai sistem dapat menggunakan font yang ada dalam baris kode, jika semua font yang ada dalam baris kode tidak dapat digunakan, sistem akan menggunakan generic font.
Terkadang para web developer tidak menyiapkan fallback fonts sebagai font cadangan untuk digunakan. Berikut adalah contoh dari pengaplikasian yang benar fallback fonts dalam CSS.
Tidak menyiapkan print stylesheet
Yang terakhir ada print stylesheet. Print stylesheet adalah style khusus yang digunakan untuk mencetak halaman, jadi ketika halaman situs akan dicetak bisa disesuaikan terlebih dahulu style-nya menggunakan media print.
Menurut para pengguna CSS, print stylesheet ini tidak harus selalu digunakan. Print stylesheet ini digunakan jika kamu ingin mencetak halaman sebuah situs dengan kustomisasi pada halaman, seperti menghilangkan warna background, dan sebagainya kamu perlu menuliskan print stylesheet ini dalam HTML kamu. Berikut adalah contoh dari penggunaan stylesheet.
Jadi itulah beberapa kesalahan pada CSS yang sering terjadi. Kesalahan mana yang pernah kamu buat? Apakah penggunaan redundant properties, shorthand properties, fallback fonts, dan menyiapkan print stylesheet sangat berpengaruh pada efektifitas pekerjaan? Semoga dengan kamu membaca artikel ini kamu dapat mengurangi kesalahan-kesalahan yang sering terjadi dalam penulisan CSS.
Kesalahan Pada CSS yang Sering Terjadi – end
Simak juga beberapa artikel di antaranya:
