Video: 1 Apa sih CSS itu ? 2024
Salah satu aspek yang paling membingungkan dalam bekerja dengan CSS (Cascading Style Sheets) adalah Anda dapat menulis gaya dengan berbagai cara. Mirip dengan penulisan prosa, hanya karena Anda mengerti aturan dasar tata bahasa dan ejaan tidak berarti Anda sudah menguasai penulisan prosa ringkas.
Desainer CSS yang berpengalaman menghabiskan banyak waktu untuk menyusun singkat, menghapus CSS yang mudah untuk diedit dan diperbarui. Tapi mereka yang baru mengenal CSS cenderung lebih banyak menulis daripada yang diperlukan dan menciptakan gaya yang berlebihan.
Tidak hanya kode redundansi membutuhkan waktu lebih lama untuk mendownload ke browser web, ini jauh lebih sulit untuk diedit atau direvisi nanti. Dan, semakin berlebihan kode Anda, semakin besar kemungkinan Anda mengalami konflik gaya.
Berikut adalah lima tip untuk menulis gaya bersih dan efisien:
-
Jangan pernah membuat dua gaya saat sudah cukup. Misalnya, Anda dapat membuat gaya menggunakan pemilih tag untuk semua tag
yang mengubah keluarga font dari tajuk utama Anda, lalu membuat gaya kedua menggunakan pemilih kelas yang dapat Anda terapkan pada tajuk utama Anda untuk mengubah warna.
Tapi akan lebih efisien untuk menentukan warna dan keluarga font dengan gaya yang sama. Ingat bahwa Anda selalu dapat kembali dan mengedit gaya untuk menambahkan aturan lain jika Anda ingin mengubah format gaya.
-
Singkatan kode warna heksadesimal. Anda dapat menentukan warna dalam CSS dengan menyertakan keseluruhan kode warna heksadesimal. Namun, bila Anda menggunakan kode warna yang berulang, Anda hanya perlu memasukkan tiga karakter pertama. Misalnya #ffffff sama dengan #fff; keduanya akan menciptakan warna putih.
-
Gunakan lembar gaya eksternal. Anda dapat menentukan gaya dalam lembar gaya internal di bagian atas setiap halaman web, atau Anda dapat menyimpan gaya Anda di file eksternal dengan. ekstensi css dan lampirkan style sheet ke semua halaman web Anda. Lembar gaya eksternal secara inheren lebih efisien karena memungkinkan Anda menggunakan gaya yang sama pada setiap atau semua halaman di situs Anda.
Misalnya, jika Anda mendefinisikan gaya yang membuat semua judul utama menjadi berani, biru, dan besar, sehingga gaya itu dalam style sheet eksternal memungkinkan Anda menggunakan gaya yang sama untuk setiap judul. Kemudian, jika nanti Anda memutuskan untuk mengubah tajuk utama menjadi hijau, Anda dapat mengubah gaya dalam satu lembar gaya eksternal dan mengubah semua tajuk sekaligus.
Jika Anda telah menyimpan gaya dalam lembar gaya internal, Anda harus mengedit gaya judul di setiap file.
-
Kembangkan konvensi penamaan untuk gaya Anda. Meskipun Anda dapat memberi nama gaya yang dibuat dengan pemilih kelas atau ID apa pun yang Anda sukai, yang terbaik adalah memilih gaya yang memiliki makna selain dari format.Misalnya, jika Anda membuat gaya yang disebut. redHeadlines dan kemudian memutuskan Anda menginginkan semua. redHeadlines menjadi biru, Anda akan berakhir dengan gaya judul biru yang disebut. redHeadlines atau harus mengganti nama style.
Dan mengganti nama gaya termasuk kembali dan menerapkan kembali gaya di mana-mana Anda memiliki judul utama merah yang ingin Anda ubah biru, yang jenisnya meniadakan kekuatan gaya untuk melakukan pembaruan global. Untuk menghindari masalah ini, buat nama gaya yang mengacu pada posisi atau pentingnya elemen, seperti. mainHeadlines atau. sidebarHeadlines
-
* Uji dan validasi kode Anda. Bahkan desainer CSS berpengalaman membuat kesalahan, itulah sebabnya Dreamweaver menyertakan begitu banyak alat hebat untuk menguji dan memvalidasi kode di halaman web Anda. Pastikan Anda menguji CSS Anda untuk kesalahan umum.
Berikut adalah dua layanan pengujian online yang dapat Anda gunakan untuk memeriksa kesalahan dalam kode CSS Anda. Cukup masukkan URL dari setiap halaman web di Internet di kolom alamat di salah satu situs ini dan klik tombol Submit untuk menerima laporan yang menunjukkan adanya kesalahan dalam kode Anda:
-
Layanan Validasi W3C CSS XHTML-CSS
-
: Jadilah Berlaku atau Mati Belajar
-
