Home » HTML » XHTML HTML: Beda – Contoh dan Cara Menggunakannya

XHTML HTML: Beda – Contoh dan Cara Menggunakannya

by Catur Kurnia Sari
by Catur Kurnia Sari

XHTML adalah versi HTML yang memiliki aturan penulisan lebih ketat dan berbasis XML.

Apa itu XHTML?

  • XHTML adalah singkatan dari EXtensible HyperText Markup Language
  • XHTML adalah versi HTML yang memiliki aturan lebih ketat dan berbasis XML
  • XHTML adalah HTML yang didefinisikan sebagai aplikasi XML
  • XHTML didukung oleh semua browser utama

Mengapa XHTML?

XML adalah bahasa markup di mana semua dokumen harus di-markup dengan benar (menjadi “format yang baik”).

XHTML dikembangkan untuk membuat HTML dapat lebih diperluas dan fleksibel untuk bekerja dengan format data lain (seperti XML). Selain itu, pada halaman HTML browser akan mengabaikan kesalahan, dan mencoba menampilkan situs web meskipun memiliki beberapa kesalahan dalam markup. Untuk itu XHTML hadir dengan penanganan kesalahan yang jauh lebih ketat.

Perbedaan penting XHTML dari HTML

  • Penulisan <!Doctype> wajib
  • Atribut xmlns di dalam <html> adalah wajib
  • Penggunaan <html>, <head>, <title>, dan <body> wajib
  • Elemen harus selalu diurutkan dengan benar
  • Elemen harus selalu ditutup
  • Elemen harus selalu dalam huruf kecil
  • Nama atribut harus selalu dalam huruf kecil
  • Nilai atribut harus selalu dikutip
  • Minimalisasi atribut dilarang

Pada XHTML – <!DOCTYPE ….> Wajib

Dokumen XHTML harus memiliki deklarasi XHTML <!Doctype> .

Elemen juga harus ada elemen <html>, <head>, <title> dan <body>. Dan atribut xmlns di <html> harus menentukan namespace xml untuk dokumen tersebut.

Contoh :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Title of document</title>
</head>
<body>

Tulis konten disini

</body>
</html>

Elemen harus Bertumpuk dengan benar <properly nested>

Dalam XHTML, elemen harus selalu bertumpung dengan benar satu sama lain, seperti ini.

Contoh benar :

<b><i>ini teks</i></b>

Contoh salah :

<b><i>ini teks</b></i>

Elemen XHTML Harus Selalu Ditutup

Dalam XHTML, elemen harus selalu ditutup, seperti pada contoh dibawah ini.

Contoh benar :

<p>Ini paragraf</p>
<p>Paragraf Selanjutnya</p>

Contoh salah :

<p>Ini paragraf
<p>Paragraf Selanjutnya

Elemen Kosong XHTML Harus Selalu Ditutup

Dalam XHTML, elemen kosong harus selalu ditutup, seperti contoh ini.

Contoh benar :

A break: <br />
A horizontal rule: <hr />
An image: <img src="happy.gif" alt="Happy face" />

Contoh salah :

A break: <br>
A horizontal rule: <hr>
An image: <img src="happy.gif" alt="Happy face">

Elemen XHTML Harus dalam Huruf Kecil

Di dalam aturan XHTML, nama elemen harus selalu dalam huruf kecil, seperti contoh ini.

Contoh benar :

<body>
<p>Ini paragraf</p>
</body>

Contoh salah :

<BODY>
<P>Ini paragraf</P>
</BODY>

Nama Atribut XHTML Harus dalam Huruf Kecil

Dalam XHTML, nama atribut harus selalu dalam huruf kecil, seperti ini.

Contoh yang benar :

<a href="https://dosenit.com/">Kunjungi tutorial HTML kami</a>

Contoh yang salah :

<a HREF="https://dosenit.com/">Kunjungi tutorial HTML kami</a>

Nilai Atribut XHTML Harus Dikutip

Dalam XHTML, nilai sebuah atribut harus selalu dikutip, seperti ini.

Contoh yang benar :

<a href="https://dosenit.com/">Kunjungi tutorial HTML kami</a>

Contoh yang salah:

<a href=https://www.dosenit.com/>Kunjungi tutorial HTML kami</a>

Minimalisasi Atribut XHTML Dilarang

Pada XHTML, minimalisasi atribut dilarang, seperti contoh.

Contoh yang benar :

<input type="checkbox" name="vehicle" value="car" checked="checked" />
<input type="text" name="lastname" disabled="disabled" />

Contoh yang salah :

<input type="checkbox" name="vehicle" value="car" checked />
<input type="text" name="lastname" disabled />

Kesimpulannya dalam XHTML terdapat aturan-aturan yang lebih sempurna atau lebih ketat dibandingkan dengan HTML. Untuk itu penulisan dalam XHTML harus benar-benar diperhatikan dan ditulis sesuai aturannya agar web yang kita buat dapat berfungsi dengan semestinya.

You may also like