Memisahkan Konten Dari Desain Membuat Pengelolaan Situs Lebih Mudah
CSS (Cascading Style Sheets) telah menjadi cara de facto untuk membuat style dan lay out website. Desainer menggunakan stylesheet untuk memberi tahu browser bagaimana situs web harus ditampilkan dalam hal tampilan dan nuansa, yang mencakup faktor-faktor seperti warna, jarak, font, dan banyak lagi.
Gaya CSS dapat diterapkan dalam dua cara:
- Inline - dalam pengkodean halaman web itu sendiri, pada individu, elemen-oleh-elemen dasar
- Dalam dokumen CSS yang berdiri sendiri, yang terhubung ke situs web
Praktik Terbaik untuk CSS
"Praktik terbaik" adalah metode merancang dan membangun situs web yang terbukti paling efektif dan memberikan hasil paling banyak untuk pekerjaan yang terlibat. Mengikuti mereka dalam CSS dalam desain web membantu tampilan dan fungsi situs web sebaik mungkin. Mereka telah berevolusi selama bertahun-tahun bersama dengan bahasa dan teknologi web lainnya, dan stylesheet CSS yang berdiri sendiri telah menjadi metode penggunaan yang disukai.
Mengikuti praktik terbaik untuk CSS dapat meningkatkan situs Anda dengan cara-cara berikut:
- Pisahkan konten dari desain. Salah satu tujuan utama dari CSS adalah untuk menghapus elemen desain dari HTML dan menempatkannya di lokasi lain agar perancang dapat mempertahankannya. Ini juga berfungsi untuk memisahkan desainer dari pengembang sehingga masing-masing dapat fokus pada bidang keahlian mereka. Seorang perancang tidak harus menjadi pengembang untuk mempertahankan tampilan situs web.
- Membuat perawatan menjadi mudah. Salah satu elemen desain web yang paling diabaikan adalah pemeliharaan. Tidak seperti bahan cetak, situs web tidak pernah "satu dan selesai." Konten, desain, dan fungsi dapat dan harus berkembang seiring waktu. Memiliki CSS di tempat sentral, bukannya ditaburkan di seluruh situs web, membuat segalanya lebih mudah untuk dikelola.
- Menjaga situs Anda tetap dapat diakses. Menggunakan gaya CSS membantu mesin telusur dan individu yang dinonaktifkan berinteraksi dengan situs Anda.
- Menyimpan arus situs Anda 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 Inline Bukan Praktik Terbaik
Gaya sebaris, meski 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 sama persis dengan font yang disematkan dan tag desain kikuk lainnya yang dilawan pengembang modern. Gaya hanya memengaruhi elemen tertentu yang diaplikasikan; sementara itu mungkin memberi Anda kontrol yang lebih rinci, itu juga membuat aspek lain dari desain dan pengembangan - seperti konsistensi - lebih sulit.
- Gaya inline menyebabkan sakit kepala pemeliharaan. Ketika Anda bekerja dengan stylesheet, mencari tahu di mana gaya yang sedang diatur dapat menjadi sulit. Ketika Anda berurusan dengan campuran gaya inline, tertanam dan eksternal , Anda memiliki banyak lokasi untuk diperiksa. Jika Anda bekerja di tim desain web atau harus mendesain ulang atau mengelola situs yang dibuat oleh orang lain, Anda akan mengalami lebih banyak masalah. Setelah Anda menemukan gaya dan mengubahnya, Anda harus melakukannya pada setiap elemen di setiap halaman tempat itu ditempatkan. Itu meningkatkan waktu dan anggaran kerja secara astronomis.
- Gaya sebaris tidak dapat diakses. Sementara pembaca layar modern atau alat bantu lain mungkin dapat menangani atribut dan tag inline secara efektif, beberapa perangkat yang lebih tua tidak dapat, yang dapat menghasilkan beberapa halaman web yang ditampilkan secara aneh. Karakter dan teks tambahan dapat mempengaruhi bagaimana halaman Anda dilihat oleh robot mesin pencari juga, sehingga halaman Anda tidak melakukan dengan baik dalam hal optimasi mesin pencari (SEO).
- 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 stylesheet eksternal. Jika Anda melakukannya dengan gaya sebaris, Anda harus menambahkan gaya tersebut ke setiap paragraf di situs Anda. Jika Anda memiliki lima baris CSS, itu lima baris dikalikan dengan setiap paragraf di situs Anda. Bandwidth dan waktu buka itu dapat bertambah dengan cepat.
Alternatif untuk Gaya Inline: Stylesheet Eksternal
Alih-alih menggunakan gaya sebaris, gunakan stylesheet 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. Stylesheet eksternal memengaruhi dokumen apa pun yang dilampirkan. Itu berarti bahwa, jika Anda memiliki situs web 20-halaman di mana setiap halaman menggunakan stylesheet yang sama - yang biasanya bagaimana hal itu dilakukan - Anda dapat membuat perubahan ke setiap halaman itu hanya dengan mengedit gaya tersebut sekali, di satu tempat. Mengubah gaya di satu tempat jauh lebih mudah daripada mencari pengkodean itu di setiap halaman situs web Anda. Ini membuat pengelolaan situs jangka panjang jauh lebih mudah.