XHTML - Sintaks

Sintaks XHTML sangat mirip dengan sintaks HTML dan hampir semua elemen HTML yang valid juga valid dalam XHTML. Tetapi ketika Anda menulis dokumen XHTML, Anda perlu memberi sedikit perhatian ekstra untuk membuat dokumen HTML Anda sesuai dengan XHTML.

Berikut adalah poin penting untuk diingat saat menulis dokumen XHTML baru atau mengubah dokumen HTML yang ada menjadi dokumen XHTML -

  • Tulis deklarasi DOCTYPE di awal dokumen XHTML.

  • Tulis semua tag dan atribut XHTML dalam huruf kecil saja.

  • Tutup semua tag XHTML dengan benar.

  • Sarang semua tag dengan benar.

  • Kutip semua nilai atribut.

  • Larang minimalisasi Atribut.

  • Ganti name atribut dengan id atribut.

  • Hentikan language atribut dari tag script.

Berikut adalah penjelasan detail aturan XHTML di atas -

Deklarasi DOCTYPE

Semua dokumen XHTML harus memiliki deklarasi DOCTYPE di awal. Ada tiga tipe deklarasi DOCTYPE, yang akan didiskusikan secara detail di bab Doctypes XHTML. Berikut adalah contoh penggunaan DOCTYPE -

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

Sensitivitas Kasus

XHTML adalah bahasa markup case sensitive. Semua tag dan atribut XHTML harus ditulis dalam huruf kecil saja.

<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>

<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>

Dalam contoh, Href dan tag jangkar A tidak dalam huruf kecil, jadi itu salah.

Menutup Tag

Setiap tag XHTML harus memiliki tag penutup yang setara, bahkan elemen kosong juga harus memiliki tag penutup. Berikut adalah contoh yang menunjukkan cara yang valid dan tidak valid menggunakan tag -

<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.

<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >

Sintaks berikut menunjukkan cara yang benar untuk menulis tag di atas dalam XHTML. Perbedaannya adalah, di sini kami telah menutup kedua tag dengan benar.

<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>

<!-- This is also valid now -->
<img src="/images/xhtml.gif" />

Atribut Kutipan

Semua nilai atribut XHTML harus dikutip. Jika tidak, dokumen XHTML Anda dianggap sebagai dokumen yang tidak valid. Berikut adalah contoh yang menunjukkan sintaks -

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />

Atribut Minimisasi

XHTML tidak mengizinkan minimisasi atribut. Ini berarti Anda perlu menyatakan atribut dan nilainya secara eksplisit. Contoh berikut menunjukkan perbedaannya -

<!-- This is invalid in XHTML -->
<option selected>

<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">

Berikut adalah daftar atribut yang diminimalkan dalam HTML dan cara Anda perlu menuliskannya dalam XHTML -

Gaya HTML XHTML Style
kompak kompak = "kompak"
diperiksa diperiksa = "diperiksa"
menyatakan menyatakan = "mendeklarasikan"
hanya baca readonly = "readonly"
dengan disabilitas disabled = "disabled"
terpilih dipilih = "dipilih"
menunda defer = "defer"
ismap ismap = "ismap"
nohref nohref = "nohref"
noshade noshade = "noshade"
nowrap nowrap = "nowrap"
banyak multiple = "multiple"
noresize noresize = "noresize"

The id Atribut

Atribut id menggantikan atribut nama. Daripada menggunakan name = "name", XHTML lebih memilih menggunakan id = "id". Contoh berikut menunjukkan bagaimana -

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />

The bahasa Atribut

Atribut bahasa dari tag skrip tidak digunakan lagi. Contoh berikut menunjukkan perbedaan ini -

<!-- This is invalid in XHTML -->

<script language="JavaScript" type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

<!-- Correct XHTML way of writing this is as follows -->

<script type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

Tag Bertingkat

Anda harus menumpuk semua tag XHTML dengan benar. Jika tidak, dokumen Anda dianggap sebagai dokumen XHTML yang salah. Contoh berikut menunjukkan sintaks -

<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>

<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>

Larangan Elemen

Elemen berikut tidak diperbolehkan memiliki elemen lain di dalamnya. Larangan ini berlaku untuk semua kedalaman sarang. Berarti, itu mencakup semua elemen yang turun.

Elemen Larangan
<a> Tidak boleh mengandung elemen <a> lainnya.
<pre> Tidak boleh berisi elemen <img>, <object>, <big>, <small>, <sub>, atau <sup>.
<button> Tidak boleh berisi elemen <input>, <select>, <textarei>, <label>, <button>, <form>, <fieldset>, <iframe> atau <isindex>.
<label> Tidak boleh mengandung elemen <label> lainnya.
<form> Tidak boleh mengandung elemen <form> lainnya.

Dokumen Minimal XHTML

Contoh berikut menunjukkan kepada Anda konten minimum dari dokumen XHTML 1.0 -

<?xml version="1.0" encoding="UTF-8"?>

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

<html xmlns="http://www.w3.org/TR/xhtml1" xml:lang="en" lang="en">
   <head>
      <title>Every document must have a title</title>
   </head>
	
   <body>
      ...your content goes here...
   </body>
</html>