XHTML adalah singkatan dari Extensible HyperText Markup Language. XHTML ini sebenarnya adalah revolusi HTML dan merupakan generasi berikutnya setelah HTML yang memiliki kemampuan yang tinggi, disiplin, ketat dan stabil. XHTML ini sendiri juga termasuk dari kombinasi antara HTML dan XML (Extensible Markup Language).
HTML sendiri adalah bahasa asli dari WWW (World Wide Web). Sebenarnya XHTML dan HTML ini hampir sama hanya saja XHTML ini dirancang untuk menyesuaikan standar XML. Untuk penulisan kode program pada XHTML disarankan menggunakan huruf kecil dan tidak melupakan tag penutup elemen pada setiap tag program.
Berikut sedikit dari perbedaan dari XHTML dan HTML:
- Elemen XHTML harus tersusun secara benar (properly nested).
- XHTML merupakan dokumen yang "well-formed".
- Nama tag harus menggunakan huruf kecil.
- Semua elemen XHTML harus memiliki penutup.
- Tiap value pada attribute harus terbungkus dengan tanda kutip ganda atau tunggal dan atributnya sendiri tidak boleh disingkat.
- Tag image harus terdapat alt attribute yang menyediakan deskripsi image, untuk memungkinkan image tersebut memiliki beberapa persyaratan untuk aksesibilitas bersama dengan standar web yang berbeda.
- Persyaratan lain dari XHTML adalah adanya pernyataan dari deklarasi DOCTYPE yang menentukan aturan mana yang diikuti oleh dokumen anda (aturan yang diwarisi dari XML). Anda akan menemukan pernyataan ini pada baris pertama dari atas ketika anda mengaktifkan halaman source kode XHTML yaitu tipe dokumen deklarasi (juga disebut dengan DTD atau DOCTYPE). Sebagian besar halaman web yang diciptakan hari ini akan menyertakan deklarasi DOCTYPE tersebut. Ada 3 DTD untuk XHTML: Strict (hanya akan validasi jika tanpa tag usang), Transisi (masih akan memvalidasi dengan tag usang), dan Frameset (untuk halaman yang "set up frame"). Semua dokumen XHTML harus sesuai dengan aturan sintaks XML.
Elemen XHTML harus tersusun secara benar (properly nested).
Didalam HTML elemen tidak harus tersusun dengan tata letak struktur yang benar berikut contohnya:
Pada penulisan HTML
1 | <b> |
2 | <i> |
3 | Ini adalah tulisan yang berformat bold dan italik |
4 | </b> <!-- tag b tidak ditutup dengan benar --> |
5 | </i> <!-- tag i tidak ditutup dengan benar --> |
Pada XHTML semua elemen harus tersusun dengan benar seperti ini:
1 | <b> |
2 | <i> |
3 | Ini adalah tulisan yang berformat bold dan italik |
4 | </i> <!-- Tag i ditutup dengan benar --> |
5 | </b> <!-- Tag b ditutup dengan benar --> |
Keterangan: sebelum tag <i> ditutup belum boleh ada penutup untuk </b>, <i> adalah
elemen anak dari elemen <b>, pembuka dan penutup <i> harus di dalam elemen <b>
Terlihat dari kode di atas bahwa setiap tag harus ditutup secara berurutan.
Lihat contoh ke 2 ini:
01 | <ul> |
02 | <li>Kopi</li> |
03 | <li>Teh |
04 | <ul> |
05 | <li>Teh Hitam</li> |
06 | <li>Teh Hijau</li> |
07 | </ul> |
08 | <li>Susu</li> |
09 | </ul> |
10 |
11 | <!-- tag li pada Teh tidak ditutup --> |
Penulisan ini yang benar:
01 | <ul> |
02 | <li>Kopi</li> |
03 | <li>Teh |
04 | <ul> |
05 | <li>Teh Hitam </li> |
06 | <li>Teh Hijau </li> |
07 | </ul> |
08 | </li> <!-- tag li ditutup --> |
09 | <li>Susu</li> |
10 | </ul> |
Dokumen harus "Well-formed"
Semua elemen XHTML harus tersusun dalam elemen sebagai root element.
Setiap elemen dapat memiliki sub (child) element. Setiap sub elemen harus tersusun
dengan benar di dalam parent element.
Struktur dasarnya adalah sebagai berikut:
1 | <html> |
2 | <head> ... </head> |
3 | <body> ... </body> |
4 | </html> |
Nama Tag harus huruf kecil
Hal ini dikarenakan XHTML merupakan dokumen XML. XML bersifat case-sensitive. Tag
seperti <br> dan <BR> dianggap berbeda.
Penulisan salah
1 | <BODY> |
2 | <P>Ini adalah paragraf</P> |
3 | </BODY> |
Penulisan Benar
1 | <body> |
2 | <p> Ini adalah paragraf </p> |
3 | </body> |
Semua elemen XHTML harus ditutup
Setiap elemen terbuka harus ditutup dengan tag penutup
Penulisan salah
1 | <p> Ini adalah paragraf |
2 | <p> Ini adalah paragraph yang lain |
Penulisan Benar
1 | <p> Ini adalah paragraf </p> |
2 | <p> Ini adalah paragraf yang lain </p> |
Elemen kosong harus ditutup
Elemen kosong harus ditutup menggunakan />.
Penulisan salah
1 | Ini adalah break<br> |
2 | Ini adalah garis mendatar:<hr> |
3 | Ini adalah image <img src="gambar.gif" alt="gambar"> |
Penulisan Benar
1 | Ini adalah break<br /> |
2 | Ini adalah garis mendatar:<hr /> |
3 | Ini adalah image <img src="gambar.gif" alt="gambar" /> |
Tiap value pada attribute harus terbungkus dengan tanda kutip ganda atau tunggal dan atributnya sendiri tidak boleh disingkat.
Penulisan salah
1 | <div id=value> ... </div> <!-- value tidak ditutup tanda kutip --> |
2 | <div clss=value> ... </div> <!-- atribut class disingkat menjadi clss --> |
Penulisan Benar
1 | <div id="value"> ... </div> <!-- value ditutup kutip ganda --> |
2 | <div class="value"> ... </div> <!-- atribut class tidak disingkat --> |
3 |
4 | <div class='value'> ... </div> <!-- value ditutup kutip tunggal --> |
Tag image harus terdapat alt
Tag image harus terdapat alt attribute yang menyediakan deskripsi image, untuk memungkinkan image tersebut memiliki beberapa persyaratan untuk aksesibilitas bersama dengan standar web yang berbeda.
Penulisan salah
1 | <img src="alamatgambar.com" /> |
Penulisan Benar
1 | <img src="alamatgambar.com" alt="Ini gambar saya" /> |
Pernyataan dari deklarasi DOCTYPE
Pernyataan dari deklarasi DOCTYPE yang menentukan aturan mana yang diikuti oleh dokumen anda (aturan yang diwarisi dari XML). Anda akan menemukan pernyataan ini pada baris pertama dari atas ketika anda mengaktifkan halaman source kode XHTML yaitu tipe dokumen deklarasi (juga disebut dengan DTD atau DOCTYPE). Sebagian besar halaman web yang diciptakan hari ini akan menyertakan deklarasi DOCTYPE tersebut. Ada 3 DTD untuk XHTML: Strict (hanya akan validasi jika tanpa tag usang), Transisi (masih akan memvalidasi dengan tag usang), dan Frameset (untuk halaman yang "set up frame"). Semua dokumen XHTML harus sesuai dengan aturan sintaks XML.
Berikut adalah penulisan deklarasi DOCTYPE
1 | <!DOCTYPE html PUBLIC "-//W3c//DTD XHTML 1.0 Strict//EN" |
Dari penjelasan diatas semoga kita dapat menetahui perbedaan antara XHTML dan HTML.
Source:
http://www.vikrymadz.web.id/2012/01/perbedaan-html-dengan-xhtml.html
http://fanjavaakhmad.wordpress.com/2010/09/06/perbedaan-xhtml-dan-html/
http://metafora.awardspace.com/down/Tutorial%20XHTML.pdf
SOCIALIZE IT →