Sebuah situs web dapat dibangun di atas beberapa bahasa web seperti HTML, CSS, JavaScript, dan PHP. Di antara bahasa-bahasa ini, kita semua mungkin setuju bahwa CSS adalah bahasa yang paling mudah. CSS mendefinisikan tata letak, warna, ukuran, dan tipografi situs web dengan cara yang sederhana. Ini lurus ke depan, dan tidak membutuhkan fungsi logis atau bersyarat untuk digunakan.

Tapi, Anda mungkin terkejut mengetahui bahwa, sebenarnya, CSS bisa menjadi bahasa yang paling sulit dan sangat merepotkan dalam kasus-kasus tertentu. Bagaimana bisa? Nah, berikut beberapa alasannya.

20 Tip CSS Berguna Untuk Pemula

20 Tip CSS Berguna Untuk Pemula

Di masa lalu, kami sangat bergantung pada pengembang dan pemrogram untuk membantu memperbarui situs web, bahkan … Baca lebih banyak

1. Tidak Ada Laporan Kesalahan

Setiap bahasa web mengikuti aturan khusus untuk menulis kode. Ketika menulis aturan gaya di CSS, ini dimulai dengan nama pemilih (biasanya kelas, id, pemilih atribut), diikuti dengan kurung kurawal, lalu deklarasi gaya di dalam kurung kurawal, dan mengakhiri setiap baris dengan titik koma.


.class {
	color: #fff;
	background-color: #000;
}	

Beberapa bahasa web mengatur aturan secara ketat; jika tidak, itu mengembalikan kesalahan, tetapi bukan CSS. CSS tidak menghasilkan kesalahan. Anda mungkin secara tidak sengaja menghapus tanda titik koma atau kurung kurawal, atau salah menamai penyeleksi – dan tata letak Anda rusak

Di PHP, Anda akan diberi tahu tentang kesalahan apa, di mana itu terjadi, dan memperbaikinya jauh lebih cepat. Di CSS, Anda sendirian, meskipun berada di beberapa file CSS dengan ribuan baris kode.

2. Terlalu Fleksibel

Meskipun CSS tampaknya mudah dipahami, ada beberapa masalah dalam CSS yang tidak selalu memiliki jawaban langsung, seperti “Bagaimana Anda memusatkan objek?”.

Ada beberapa cara untuk memusatkan objek dengan CSS. Kita bisa memusatkannya menggunakan margin, padding, flexbox, atau grid. Tetapi aplikasinya akan bergantung pada jenis pusat yang ingin kita capai, tata letak halaman keseluruhan, jenis objek, apakah itu gambar, elemen sebaris atau blok, latar belakang, bagaimana elemen tersebut bersarang serta sekitarnya. posisi elemen.

Penskalaan dan pemfaktoran ulang CSS juga merupakan salah satu masalah yang tidak begitu mudah. Tidak seperti bahasa pemrograman, sintaks CSS bersifat deklaratif dan fleksibel. Kita bisa menerapkan CSS langsung di elemen, di template, di file CSS, atau memuatnya dari situs eksternal. Anda dapat dengan mudah menambahkan gaya di mana saja dan tetap berharap halaman Anda memuat “OK”. Tapi inilah yang membuat refactoring CSS rumit, terutama di situs web skala besar.

Refactoring CSS membutuhkan disiplin ekstra, dan Anda harus berhati-hati saat mengubah warnanya temukan / ganti karena Anda mungkin tidak sengaja menghapus salah satu yang tidak boleh diganti. Karena tidak menimbulkan kesalahan apa pun, Anda sering tidak menyadarinya sampai salah satu pengguna Anda mengirimi Anda pemberitahuan.

Inilah salah satu alasan kami memiliki lusinan kerangka kerja, pola, dan arsitektur CSS untuk diikuti seperti Bootstrap, Bulma, Sass, LESS, BEM, CSS-in-JS, dan Utility-first untuk memberi pengembang sekumpulan panduan dan aturan ketat yang harus diikuti saat membuat CSS.

3. Nightmare Kompatibilitas Browser

Kompatibilitas browser adalah masalah terbesar dalam CSS dan merupakan mimpi buruk bagi desainer web dalam kasus tertentu. Meskipun standar diterbitkan oleh W3C, vendor browser menerapkan spesifikasi CSS secara berbeda.

Itulah sebabnya situs web suka CanIUse.com ada – untuk melihat apakah fitur CSS tertentu didukung dalam satu versi browser atau yang berikutnya.

Ketika dukungan untuk browser yang lebih lama (seperti IE6 dan IE7) diperlukan – biasanya atas permintaan klien – kami akhirnya harus membuat banyak file dan menyajikannya melalui pernyataan bersyarat, kemudian melakukan banyak peretasan CSS untuk membuat situs terlihat konsisten dan serupa dilihat di browser yang lebih modern. Pada akhirnya, masalah # 1 akan membuat kita terjebak dalam mimpi buruk ini.

4. Kekhususan CSS

Pemilih CSS memiliki tingkat bobot / spesifisitas yang berbeda. Mari kita lihat contoh ini:


p {
	color: #000;
}
p {
	color: #333;
}

Ketika dua penyeleksi dengan kekhususan yang sama memiliki gaya yang sama, seperti yang ditunjukkan di atas, yang muncul kemudian menimpa pendahulunya. Tapi saat kita menambahkan pemilih kelas, katakanlah .paragraph, seperti itu.


p.paragraph {
	color: #000;
}
p {
	color: #333;
}

… Terlepas dari posisinya, paragraf yang ditetapkan dengan paragraph kelas akan memiliki #000 warna, karena lebih spesifik.

Terus terang, kekhususan CSS benar-benar membingungkan. Anda harus memperhatikan saat menentukan aturan gaya. Mungkin ada satu pemilih dengan kekhususan lebih tinggi yang menimpa pemilih yang kurang spesifik, membuat Anda mencari pelakunya selama berjam-jam sebelum menemukannya.

5. CSS vs. Klien Anda

CSS mendefinisikan tata letak, warna dan ukuran situs web dan apa adanya rapat terkait dengan tampilan situs web. Di sinilah masalahnya – desain bersifat subjektif. Klien Anda mungkin memiliki perspektif yang berbeda tentang “tampilan”, dan mungkin meminta Anda untuk ikut 1px hari ini, dan 5px hari berikutnya. Jika Anda berurusan dengan klien dari neraka, Anda ditakdirkan.

“Bisakah kamu membuat merah lebih biru? Ubah logo saya tapi tetap sama? Membuatnya sedikit lebih berani dan lebih gelap, lebih terang dan lebih tipis?

GAH! Menghancurkan kepala Anda ke dinding sepertinya berjalan-jalan di taman saat berurusan dengan klien seperti ini.

Bungkus

CSS mungkin sederhana dan relatif mudah dipelajari. Tapi, kita perlu disiplin dan konsisten sehingga bisa lebih mudah diatur. Apakah Anda memiliki masalah dengan CSS? Bagikan dengan kami di bawah.

Author

Write A Comment