Cara Benar Menamai Kelas CSS

Memberi nama kelas CSS yang baik berdasarkan tips dari W3C adalah dengan berdasarkan semantik. Nama kelas yang baik seharusnya tidak akan pernah berubah. Pemberian nama kelas yang baik seharusnya menjawab pertanyaan “mengapa sesuatu tersebut perlu diatur agar tampil seperti itu?”, bukan pertanyaan “bagaimana seharusnya sesuatu tersebut tampil?”. Maksudnya adalah bahwa penampilan itu akan selalu berubah, tetapi alasan mengapa harus tampil seperti itu tidak akan berubah.

Untuk memperjelas pengertian diatas, mari kita lihat pemberian nama elemen HTML untuk menonjolkan bagian suatu teks. Elemen yang dimaksud adalah elemen bold atau tag <b> dan elemen strong atau tag <strong>. Kedua elemen sama-sama dimaksudkan untuk menonjolkan suatu bagian teks tetapi elemen strong mempunyai makna semantik yang lebih baik. Saat ini, teks yang ingin ditonjolkan berdasarkan kesepakatan internasional akan ditebalkan. Jika karena suatu alasan tertentu kesepakatan internasional tersebut diubah, misalnya untuk teks yang ditonjolkan akan ditampilkan dengan huruf kapital semua, maka nama elemen bold (tebal) tidak akan tepat lagi. Mungkin perlu diubah namanya menjadi elemen capital. Sedangkan elemen strong tetap elemen strong dan maksudnya tetap sesuai dengan perubahan baru.

Nama yang Baik

Nama-nama kelas seperti peringatan, penting, gambarunduhan, dan submenu adalah nama-nama yang baik. Nama-nama tersebut menjelaskan apa yang direpresentasikan bukan bagaimana sesuatu tersebut ditampilkan. Nama-nama tersebut tidak akan berubah, peringatan tetap peringatan, tidak peduli seberapa sering perubahan terjadi pada tampilan.

Nama yang Buruk

Nama-nama kelas seperti border4px, teksTebal, backgroundcantik bukanlah nama yang baik. Bagaimana seandainya border diubah ukurannya menjadi 5px? Tentu nama kelas tersebut menjadi tidak tepat lagi dan perlu diubah. Lalu, seiring waktu latar belakang yang tadinya terlihat cantik akan menjadi tidak cantik sama sekali. Hal ini bisa saja terjadi jika misalnya terjadi perubahan tren.

Salah satu kelebihan dari penggunaan CSS adalah tidak perlu melakukan perubahan yang banyak ketika dilakukan perubahan terhadap penampilan suatu situs. Hal ini sesuai dengan tujuan pembuatan bahasa CSS, yaitu memudahkan pengendalian tampilan halaman-halaman web suatu situs secara terpusat dari sebuah file CSS.


Referensi: W3C Quality Assurance - Tips for Webmaster