XHTML Reference

XHTML Reference

Seringkali kita melihat sebuah website atau blog yang memajang logo VALID XHTML di salah satu bagian blog atau website tersebut. Tidak jarang pula yang ternyata setelah dilakukan pengecekan pada website W3, ternyata logo tersebut hanya pajangan semata, sebaliknya ditemukan cukup banyak kesalahan kode XHTML di halaman tersebut. Bagaimana kesalahan terjadi dan bagimana mengatasinya?

Beberapa kali saya memeriksa halaman-halaman website yang saya buat dan menemukan bahwa halaman tersebut invalid. Nampak terlalu banyak kesalahan yang ditunjukkan dan membuat Anda pasrah tanpa berusaha membersihkannya. Namun ternyata kesalahan-kesalahan kode tersebut nampaknya berkutat pada hal-hal yang sering terulang. Kesalahan-kesalahan yang sama mungkin juga terjadi pada template blog yang Anda gunakan.

Berikut kesalahan umum kode XHTML yang sering terjadi yang mungkin dapat dihindari:

Salah Menuliskan kode XHTML

Ada perbedaan yang mendasar pada kode HTML dan XHTML yang umumnya digunakan pada template blog Anda. Mungkin karena terbiasa menggunakan kode HTML, Anda menuliskan kode HTML pada halaman yang seharusnya dibuat dengan kode XHTML. Untuk mengecek tipe dokumen yang digunakan, lihat pada header template Anda.

Kode berikut menunjukkan bahwa tipe dokumen template blog Anda adalah XHTML 1 Transitional:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Berikut perbedaan antara tipe dokumen HTML dan XHTML

  1. Dalam HTML, tag seperti

    <p>, <li>, <br>, <hr>

    dll tidak harus ditutup, sebaliknya pada XHTML tag tersebut harus ditutup dengan sehingga penulisannya menjadi <p> ... </p>, <li> ... </li>

  2. Pada XHTML, untuk membuat format tulisan tidak lagi menggunakan tag <b> untuk bold, <i> untuk italic, <u> untuk underline atau , <font> untuk format tulisan, namun dituliskan <strong> ... </strong> untuk bold, <em> ... </em> untuk italic, <span style="text-decoration: underline;"> ... </span> untuk underline.
  3. Tag pada XHTML seluruhnya ditulis dalam huruf kecil, tag yang mengandung nilai harus dtuliskan dengan tanda kutip, contoh 
    <img src="gambarsaru.jpg" />

    bukan ditulis

    <IMG SRC=gambarsaru.jpg>
  4. Pada XHTML, tag yang mengandung nilai yang sama dengan tag yang digunkan harus dituliskan, contoh 
    <option ... selected="selected"> .... </option>

    bukan ditulis

    <option ... selected> .... </option>

Tidak menutup kode XHTML yang berdiri sendiri.

Berbeda dengan tag seperti (contoh) <p> dan <div> yang selalu ditutup masing-masing dengan </p> dan </div>. Kode XHTML yang berdiri sendiri biasanya tidak berpengaruh banyak pada tampilan apabila tidak ditutup, seperti img, input, hr dan br, namun seharusnya ditulis <img ... />, <input ... />, <hr />, <br />.

Menuliskan HTML Special Character secara langsung

Biasanya terjadi pada URL atau LINK, dan umum terjadi pada penulisan karakter “&”. Contohnya, jika Anda menuliskan URL

http://something.to/give/?&action=forget

seharusnya “&” pada URL tersebut dituliskan sebagai &amp; sehingga URL akan menjadi:

http://something.to/give/?&amp;action=forget

Tidak menuliskan alternative text pada tag img

Tag img tetap akan memunculkan gambar meski tanpa tag, tapi hal ini dianggap juga sebagai kesalahan karena apabila gambar yang dimaksud tidak muncul, maka pengunjung website akan bingung dibuatnya. Apalagi kalao satu halaman penuh gambar. Jadi berikan alternatif berupa text dengan menambahkan tag alt pada tag img seperti contoh;

<img src="./gambarku/gambarsaru.jpg" alt="Gambar paling lucu tur saru" />

Menelan mentah-mentah kode-kode iklan PPC atau banner afiliasi

Kesalahan ini umumnya terjadi pada para pemasang iklan PPC atau banner afiliasi. Anda mungkin akan meng-kopas seluruh kode-kode tersebut pada halaman Anda tanpa basa-basi dan tanpa meneliti dulu apakah kode tersebut sesuai dengan DTD yang diterapkan pada tempalte atau tidak. Memeriksa kode-kode tersebut tidak akan merusak website Anda. Periksa kembali kode-kode untuk pemasangan iklan tersebut agar lolos validasi.

Kesalahan yang tampil pada hasil validasi halaman Anda mungkin saja banyak, namun umumnya itu terjadi pada tag-tag yang umum seperti itu dan memiliki efek beranti. Satu kesalahan pada penulisan special character, misalnya. Akan berdampak timbulnya kesalahan lain pada tag tersebut. Tidak ada salahnya mengecek lagi penggunaan kode XHTML pada template blog yang Anda gunakan.

Bersih itu ibadah, jadi, mari bersih-bersih …

Download:
Perbedaan Tag antara tipe Dokumen HTML dan XHTML

Also check this out:
Learning Web Design, A beginner guide to XHTML and CSS

Free Download : XHTML Tag Reference

Artikel yang mungkin berhubungan