Validasi W3C terkadang sulit digunakan, tetapi dengan itu Anda dapat melihat kesalahan yang disebabkan oleh desain tata letak. Validator memunculkan banyak kesalahan dan peringatan, yang menunjukkan bahwa XHTML Anda belum lengkap dan mungkin tidak berfungsi secara konsisten di berbagai browser. Sepuluh masalah kegagalan halus berikut ini telah membuat bingung banyak pemrogram, dan kami akan memberi tahu Anda cara mengatasinya. Sebelum memulai artikel ini, saya akan memperkenalkan beberapa hal yang perlu diperhatikan saat menggunakan validator W3C. Jangan khawatir tentang peringatan dari verifikator - jika verifikator mengatakan menemukan 12 kesalahan dan 83 peringatan, abaikan saja dan lanjutkan ke langkah berikutnya.
Perbaiki Satu Kesalahan Sekaligus - Kemajuan bekerja secara berurutan, dari atas ke bawah, memperbaiki satu kesalahan pada satu waktu. HTML dilihat dari atas ke bawah dengan browser, dan kesalahan ini ditampilkan dalam urutan yang sama.
Refresh kode setelah setiap koreksi untuk membuatnya valid kembali - kesalahan kecil sering kali dapat memicu serangkaian kesalahan di seluruh halaman. Jadi jika dilakukan secara tidak benar, “memperbaiki kesalahan” juga dapat menyebabkan lebih banyak kesalahan. Memvalidasi ulang kode setelah setiap perbaikan memastikan bahwa masalah telah teratasi sepenuhnya.
Mengetahui pengecualian dasar di atas, mari kita lihat beberapa alasan mengapa desain tata letak tidak valid.
1. Tag div tidak ditutup. Ini adalah salah satu alasan paling umum kegagalan desain tata letak. Selalu mengejutkan ketika kita mengetahui berapa banyak desain tata letak rumit yang gagal karena hal ini. Survei menunjukkan bahwa tag div terbuka adalah salah satu kesalahan desain bagian yang paling umum dan paling sulit didiagnosis. Validator terkadang menunjuk ke tag div pembuka yang salah, yang bisa seperti menemukan jarum di tumpukan jerami.
2. Tag penyematan yang merepotkan Pada awal tahun 1990-an, browser Microsoft dan Netscape mulai dapat mengenali font unik yang tidak standar. Sayangnya hal ini berarti validator W3C belum mengenali tag HTML kunci tertentu seperti "embed", meskipun tag ini banyak digunakan. Jika Anda benar-benar menginginkan validasi DOCTYPE (tipe dokumen) yang ketat, Anda hanya bisa berhenti membuat sarang.
Jika Anda menginginkan tata letak yang efektif dan media yang tertanam pada saat yang bersamaan, Anda dapat mencoba metode Flash Sate.
3. Deklarasi DOCTYPE yang tidak tepat Tidak mendeklarasikan DOCTYPE, atau salah mendeklarasikan DOCTYPE di awal file juga merupakan kesalahan umum. Berdasarkan pengalaman umum, Strict DOCTYPE adalah tingkat verifikasi tertinggi yang dilakukan semua orang. Validasi yang ketat menandakan halaman web Anda akan ditampilkan secara optimal di semua browser. Kode deklarasi Ketat adalah sebagai berikut:
4. Garis miring tambahan Jika situs web Anda tidak dapat diverifikasi, kemungkinan besar garis miring tersebut hilang di suatu tempat dalam kode. Sangat mudah untuk mengabaikan hal-hal seperti garis miring, terutama pada elemen seperti tag gambar. Misalnya:
Ini tidak berpengaruh pada DOCTYPE yang ketat. Untuk mengatasi masalah ini, tambahkan "/" di akhir tag img.
5. Align tag Jika DOCTYPE disetel ke Transitional, Anda akan menggunakan tag "align", tetapi jika Anda lebih menuntut dan menginginkan verifikasi ketat, Anda akan melihat banyak kesalahan. Align adalah tag lain yang tidak dapat digunakan untuk desain tata letak. Anda dapat mencoba menggunakan "float" atau "text-align" alih-alih menyelaraskan untuk mengubah elemen.
6.JavaScript
Jika Strict DOCTYPE telah dideklarasikan, tag CDATA perlu diganti dalam JavaScript. Aspek proses verifikasi ini membingungkan banyak pemrogram, karena situs web cenderung menggunakan JavaScript yang disematkan untuk iklan dan skrip pelacakan. Jika JavaScript harus digunakan, Anda dapat menambahkan tag berikut sebelum dan sesudahnya:
7. Gambar memerlukan atribut “alt” Anda mungkin tidak menyadarinya, namun gambar juga berpotensi menjadi batu sandungan untuk validasi tingkat lanjut. Selain garis miring, validasi lanjutan juga memerlukan tag alt untuk mendeskripsikan gambar, seperti alt= "Gambar vampir menakutkan".
Mesin pencari juga mengandalkan tag alt untuk mengidentifikasi gambar di halaman web, jadi sebaiknya tambahkan tag alt apa pun yang terjadi.
8. Data entitas tidak diketahui Data entitas adalah kesalahan umum lainnya yang mempengaruhi verifikasi. Kita dapat mempertimbangkan untuk menggunakan karakter pengkodean yang sesuai untuk menggantikan simbol seperti "&". Seluruh daftar data entitas karakter yang dikodekan dengan tepat tersedia di desain bagian XHTML.
9. Nesting yang buruk Nesting artinya elemen tersebut mengandung elemen Sweet!
Sangat mudah untuk mengacaukan urutan elemen yang disarangkan. Misalnya, awali tag strong sebelum tag div, namun kemudian tutup tag div terlebih dahulu. Ini mungkin tidak mengubah tata letak bagian, namun akan membuat desain bagian Anda tidak valid.
10. Hilangnya tag "judul" Meskipun ini tampak seperti sebuah kesalahan yang jelas, banyak programmer (termasuk saya sendiri) sering kehilangan tag judul di bagian "kepala". Ketika Anda melihat "sub-elemen HEAD yang diperlukan tidak ada" (sub-elemen HEAD yang diperlukan tidak ada), Anda akan menemukan bahwa Anda lupa menambahkan tag judul.