Cascading Style Sheets telah menjadi cara standar untuk menata dan menata situs web. Desainer menggunakan lembar gaya untuk memberi tahu browser bagaimana situs web harus ditampilkan dalam hal tampilan dan nuansa, yang mencakup faktor-faktor seperti warna, spasi, font, dan banyak lagi.
Gaya CSS diterapkan dalam dua cara:
- Inline — dalam pengkodean halaman web itu sendiri, secara individual, elemen demi elemen
- Dalam dokumen CSS mandiri, yang terhubung dengan situs web
Praktik Terbaik untuk CSS
"Praktik terbaik" adalah metode merancang dan membangun situs web yang telah terbukti paling efektif dan memberikan hasil maksimal untuk pekerjaan yang dilakukan. Mengikuti mereka di CSS dalam desain web membantu website terlihat dan berfungsi sebaik mungkin. Mereka telah berkembang selama bertahun-tahun bersama dengan bahasa dan teknologi web lainnya, dan stylesheet CSS mandiri telah menjadi metode penggunaan yang disukai.
Praktik terbaik berikut untuk CSS dapat meningkatkan situs Anda dalam beberapa cara:
- Memisahkan konten dari desain: Salah satu tujuan utama CSS adalah menghapus elemen desain dari HTML dan menempatkannya di lokasi lain untuk dipelihara oleh perancang. Praktik ini juga berfungsi untuk memisahkan desainer dari pengembang sehingga masing-masing dapat fokus pada bidang keahliannya. Seorang desainer tidak harus menjadi pengembang untuk menjaga tampilan situs web.
- Memudahkan perawatan: Salah satu elemen desain web yang paling diabaikan adalah pemeliharaan. Tidak seperti materi cetak, situs web tidak pernah "satu dan selesai". Konten, desain, dan fungsi dapat dan harus berkembang seiring waktu. Memiliki CSS di tempat sentral, daripada ditaburkan di seluruh situs web, membuat segalanya lebih mudah untuk dipelihara.
- Membuat situs Anda tetap dapat diakses: Menggunakan gaya CSS membantu mesin telusur dan individu yang dinonaktifkan berinteraksi dengan situs Anda.
- Membuat situs Anda tetap terkini lebih lama: Dengan menggunakan praktik terbaik dengan CSS, Anda mengikuti standar yang telah terbukti stabil tetapi cukup fleksibel untuk mengakomodasi perubahan dalam lingkungan desain web.
Gaya Sebaris Bukan Praktik Terbaik
Gaya sebaris, meskipun memiliki tujuan, umumnya bukan cara terbaik untuk memelihara situs web Anda. Mereka menentang setiap praktik terbaik:
- Gaya sebaris tidak memisahkan konten dari desain: Gaya sebaris persis sama dengan font yang disematkan dan tag desain kikuk lainnya yang ditentang oleh pengembang modern. Gaya hanya memengaruhi elemen individual tertentu yang diterapkan; sementara pendekatan itu mungkin memberi Anda kontrol yang lebih terperinci, itu juga membuat aspek desain dan pengembangan lainnya—seperti konsistensi—lebih sulit.
- Gaya sebaris menyebabkan sakit kepala pemeliharaan: Saat Anda bekerja dengan stylesheet, mencari tahu di mana gaya sedang diatur bisa jadi sulit. Ketika Anda berurusan dengan campuran gaya sebaris, tersemat, dan eksternal, Anda memiliki banyak lokasi untuk diperiksa. Jika Anda bekerja dalam tim desain web atau harus mendesain ulang atau memelihara situs yang dibuat oleh orang lain, Anda akan mendapatkan lebih banyak masalah. Setelah Anda menemukan gaya dan mengubahnya, Anda harus melakukannya pada setiap elemen di setiap halaman tempat ia ditempatkan. Itu meningkatkan waktu dan anggaran kerja secara astronomis.
- Gaya sebaris tidak dapat diakses: Meskipun pembaca layar modern atau perangkat bantu lainnya mungkin dapat menangani atribut sebaris dan memberi tag secara efektif, beberapa perangkat lama tidak dapat melakukannya, yang dapat mengakibatkan beberapa web ditampilkan secara aneh halaman. Karakter dan teks tambahan juga dapat memengaruhi cara halaman Anda dilihat oleh robot mesin telusur, sehingga laman Anda tidak berfungsi dengan baik dalam hal pengoptimalan mesin telusur.
- Gaya sebaris membuat halaman Anda lebih besar: Jika Anda ingin setiap paragraf di situs Anda muncul dengan cara tertentu, Anda dapat melakukannya sekali dengan enam baris atau lebih kode di lembar gaya eksternal. Namun, jika Anda melakukannya dengan gaya sebaris, Anda harus menambahkan gaya tersebut ke setiap paragraf situs Anda. Jika Anda memiliki lima baris CSS, itu berarti lima baris dikalikan dengan setiap paragraf di situs Anda. Bandwidth dan waktu buka itu bisa bertambah dengan cepat.
Alternatif untuk Gaya Sebaris Adalah Lembar Gaya Eksternal
Alih-alih menggunakan gaya sebaris, gunakan lembar gaya eksternal. Mereka memberi Anda semua manfaat dari praktik terbaik CSS dan mudah digunakan. Dipekerjakan dengan cara ini, semua gaya yang digunakan di situs Anda tinggal di dokumen terpisah yang kemudian ditautkan ke dokumen web dengan satu baris kode. Lembar gaya eksternal mempengaruhi dokumen apa pun yang mereka lampirkan. Jika Anda memiliki situs web 20 halaman yang setiap halamannya menggunakan stylesheet yang sama—biasanya seperti itu selesai—Anda dapat membuat perubahan pada setiap halaman tersebut hanya dengan mengedit gaya tersebut sekali, dalam satu tempat. Mengubah gaya di satu tempat lebih mudah daripada mencari pengkodean itu di setiap halaman situs web Anda. Fleksibilitas ini membuat pengelolaan situs jangka panjang menjadi lebih mudah.