HTML atau Hypertext Markup Language adalah bahasa yang digunakan untuk mengatur data yang ingin ditampilkan pada browser. Sedangkan XML (Extensible Markup Language) adalah bahasa yang digunakan untuk menyimpan dan mentransfer data melalui web. Dari pengertian ini dapat ditarik kesimpulan bahwa baik HTML maupun XML pada dasarnya memiliki tujuan yang berbeda. HTML bertujuan menampilkan datanya dan bagaimana data tersebut ditampilkan, sedangkan XML lebih banyak menggambarkan data dan mengfokuskan datanya itu apa. Dengan kata lain, HTML untuk menampilkan datanya, dan XML untuk menggambarkan datanya.
Setelah berjalannya waktu, muncullah bahasa pemrograman baru yang merupakan kombinasi antara dua bahasa(HTML dan XML) yakni XHTML. XHTML atau Extensible Markup Language ini lebih baik daripada HTML. Mengapa demikian?. Karena XHTML ini menggunakan standar XML sehingga nantinya dapat mengurangi kebutuhan untuk memparsing documet dari browser. Bandingkan dengan HTML, browser akan berusaha untuk mengoreksi satu per satu document HTML apakah sudah benar penulisannya apa tidak. Pengoreksian ini akan banyak memakan sumber daya browser yang ada. Pada dasarnya, XHTML dan HTML ini hampir sama hanya saja XHTML lebih dirancang untuk menyesuaikan dengan aturan XML.
Apa saja perbedaan HTML dan XHTML?.
1. Elemen XHTML harus disusun dengan benar(properly nested)
Contoh HTML:
<b>http://www.blogger.com/blogger.g?blogID=5484494271339005920#editor/target=post postID=1092673129011795279
<i>
Ini adalah tulisan yang berformat bold dan italik
</b> <!-- tag b tidak ditutup dengan benar -->
</i> <!-- tag i tidak ditutup dengan benar -->
Contoh XHTML:
<b>
<i>
Ini adalah tulisan yang berformat bold dan italik
</i> <!-- Tag i ditutup dengan benar -->
</b> <!-- Tag b ditutup dengan benar -->
keterangan: Terlihat dari kode di atas bahwa setiap tag harus ditutup secara berurutan.
2. XHTML merupakan dokumen yang "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.
Contoh:
<html>
<head> ... </head>
<body> ... </body>
</html>
3. Semua elemen XHTML harus selalu ditutup
Setiap tag elemen yang dibuka harus selalu ditutup oleh tag penutup.
Contoh salah:
<p> Ini adalah paragraf
<p> Ini adalah paragraph yang lain
Contoh benar:
<p> Ini adalah paragraf </p>
<p> Ini adalah paragraf yang lain </p>
4. Nama tag harus menggunakan huruf kecil
Mengapa demikian?. Karena XHTML ini sendiri menggunakan aturan XML dimana XML itu sendiri bersifat case-sensitive. Misalnya, tag <br> dan <BR> akan dianggap berbeda.
Contoh salah:
<BODY> <P>Ini adalah paragraf</P>
</BODY>
Contoh Benar:
<body>
<p> Ini adalah paragraf </p>
</body>
5. Tag image harus terdapat atribut alt
Tag image harus memiliki alt attribute yang menyediakan deskripsi image. Mengapa harus demikian?. Karena hal ini bertujuan agar image tersebut memiliki beberapa persyaratan untuk aksesibilitas bersama dengan standar web yang berbeda.
Contoh salah:
<img src="alamatgambar.com" />
Contoh benar:
<img src="alamatgambar.com" alt="Ini gambar saya" />
6. XHTML harus menggunakan pernyataan deklarasi DOCTYPE
Deklarasi DOCTYPE berfungsi untuk menentukan aturan mana yang dipakai oleh dokumen kita. Penulisan DOCTYPE biasanya / selalu ada di baris pertama dari source code.
Contoh:
<!DOCTYPE html PUBLIC "-//W3c//DTD XHTML 1.0 Strict//EN"
"http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
7. Elemen kosong harus ditutup
Elemen kosong harus ditutup dengan "/>".
Contoh salah:
Ini adalah break<br>
Ini adalah garis mendatar:<hr>
Ini adalah image <img src="gambar.gif" alt="gambar">
Contoh Benar:
Ini adalah break<br />
Ini adalah garis mendatar:<hr />
Ini adalah image <img src="gambar.gif" alt="gambar" />
8. Tiap value dari atribut harus menggunakan tanda kutip dan nama atributnya tidak boleh disingkat
Contoh salah:
<div id=value> ... </div> <!-- value tidak ditutup tanda kutip -->
<div clss=value> ... </div> <!-- atribut class disingkat menjadi clss -->
Contoh benar:
<div id="value"> ... </div> <!-- value ditutup kutip ganda -->
<div class="value"> ... </div> <!-- atribut class tidak disingkat -->
<div class='value'> ... </div> <!-- value ditutup kutip tunggal -->
Tidak ada komentar:
Posting Komentar