1 Ditulis oleh Yasin Setiawan Perbedaan antara XHTML dan HTML Anda dapat mengamati sendiri pembuatan XHTML dengan mulai menyusun HTML yang diberi kete...
Perbedaan antara XHTML dan HTML Anda dapat mengamati sendiri pembuatan XHTML dengan mulai menyusun HTML yang diberi ketentuan XHTML sebagai aturan tambahan.
Memulai XHTML XHTML merupakan generasi berikutnya setelah HTML, tetapi dia menuntut kemampuan lebih tinggi untuk mengoperasikannya. Selain itu juga perlu kesiapan berbagai perangkat untuk dapat menanganinya. Sebagai landasan pemahaman dalam tutorial ini, XHTML tidaklah berbeda jauh dengan HTML 4.01, oleh karena itu alangkah lebih baiknya anda menguasai dulu penulisan kode 4.01 standard. Anda dapat melihat referensi penulisan HTML 4.01 pada bab tentang HTML. Sebagai tambahan, anda lebih baik sejak dini menuliskan kode HTML menggunakan huruf kecil, dan jangan pernah lupa membuat tag penutup setiap elemen misalnya . Silahkan pelajari terus !
Perbedaan utama antara HTML dan XHTML: • • • •
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
Elemen harus tersusun dengan benar Dalam HTML elemen tidak harus tersusun dengan tata letak struktur yang benar: Misalnya : Ini adalah tulisan yang berformat bold dan italik Pada XHTML semua elemen harus tersusun dengan benar seperti ini : Ini adalah tulisan yang berformat bold dan italik
-1-
Keterangan : sebelum tag ditutup belum boleh ada penutup untuk , adalah elemen anak dari elemen , pembuka dan penutup harus di dalam elemen Contoh :
Kopi
Teh
Teh Hitam
Teh Hijau
Susu
Penulisan ini yang benar:
Kopi
Teh
Teh Hitam
Teh Hijau
Susu
Silahkan anda perhatikan sendiri !
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: ... ...
-2-
Nama Tag harus huruf kecil Hal ini dikarenakan XHTML merupakan dokumen XML. XML bersifat case-sensitive. Tag seperti dan dianggap berbeda. Ini salah :
Ini adalah paragraf
Ini benar:
Ini adalah paragraf
Semua elemen XHTML harus ditutup Elemen terbuka harus ditutup dengan tag penutup Ini salah :
Ini adalah paragraf
Ini adalah paragraph yang lain
Ini benar :
Ini adalah paragraf
Ini adalah paragraf yang lain
Elemen kosong harus ditutup Elemen kosong harus ditutup menggunakan />. Ini salah: Ini adalah break Ini adalah garis mendatar: Ini adalah image
-3-
Ini benar : Ini adalah break Ini adalah garis mendatar: Ini adalah image
XHTML – Sintak XHTML merupakan HTML yang bersih dan benar cara penulisannya.
Aturan penulisan XHTML: • • • • •
Nama atribut harus dengan huruf kecil Nilai Atribut harus diapit tanda petik id atribut menggantikan nama atribut Atribut harus berisi nama atribut dan nilainya XHTML DTD mendefinisikan legalisasi elemen
Nama Atribut harus dengan huruf kecil Ini salah :
Ini benar:
Nilai atribut harus diapit tanda petik Ini salah :
Ini benar:
-4-
Penulisan atribut berisi nama dan nilainya Ini salah :
Berikut daftar atribut HTML dan penulisannya dalam XHTML: HTML compact checked declare readonly disabled selected defer ismap nohref noshade nowrap multiple noresize
id Atribut menggantikan namanya HTML 4.01 mendefinisikan sebuah nama atribut untuk elemen a, applet, frame, iframe, img, dan map. Dalam XHTML tidak dikenal lagi nama atribut, karena telah digantikan dengan id.
-5-
Ini salah :
Ini benar :
Catatan : untuk dapat didukung oleh browser versi lama, anda harus menggunakan baik nama maupun id, seperti penulisan berikut ini :
Atribut Lang Atribut lang dapat digunakan dalam berbagai elemen XHTML. Ia mendefinisikan bahasa yang digunakan untuk isi dalam elemen tersebut. Jika anda menggunakan atribut lang dalam sebuah elemen, anda harus menambahkan atribut xml:lang, seperti berikut ini:
isi elemen
Deklarasi XHTML Semua dokumen XHTML harus memiliki deklarasi DOCTYPE. Elemen html, head dan body harus ada, dan elemen title arus berada dalam elemen head. Berikut ini adalah dokumen XHTML minimum: Judul dituliskan di sini Isi dokumen ditulis di sini
Catatan : deklarasi DOCTYPE bukanlah bagian dari dokumen XHTML itu sendiri. Dia bukanlah elemen XHTML, sehingga tidak harus menggunakan tag penutup.
-6-
Penulisan XHTML Cara mengkonversi ke XHTML Untuk mengkonversi Web site dari HTML ke XHTML, anda harus sudah akrab dengan tata penulisan XHTML. Cara mendasarnya adalah sebagai berikut:
1. Definisi DOCTYPE ditambahkan Deklarasi DOCTYPE berikut telah ditambahkan pada awal setiap halaman:
2. Catatan tentang DOCTYPE Halaman anda harus memiliki deklarasi DOCTYPE jika anda ingin melakukan validasi yang benar terhadap susunan XHTML. Tetapi perlu diingat, bahwa browser yang lebih baru lagi (seperti Internet Explorer 6) mungkin menangani dokumen anda berbeda tergantung pada deklarasi . jika browser membaca suatu dokumen yang menggunakan sebuah DOCTYPE, ia mungkin menangani dokumen secara "benar". Bentuk penulisan XHTML yang salah mungkin akan menampilkan dokumen berbeda jika dibandingkan dengan dokumen yang menggunakan DOCTYPE.
3. Tag dan atribut menggunakan huruf kecil Sejak XHTML bersifat case sensitive, dan sejak XHTML hanya memberlakukan penggunaan huruf kecil maka tag HTML dan nama atribut harus diganti secara keseluruhan dengan huruf kecil. Hal serupa juga diberlakukan pada atribut.
4. Semua nilai atribut diberi tanda petik Sejak W3C XHTML 1.0 direkomendasikan maka semua nilai atribut harus diapit tanda petik, semua halaman harus dicek dan diganti, setiap atribut yang ada didalamnya nilainya diberi tanda petik. Hal seperti ini tentunya akan menyita banyak waktu, untuk itu anda harus memastikan setiap penulisan atribut diberi tanda petik.
-7-
5. Tag kosong: , dan Tag kosong tidak diizinkan dalam XHTML. Tag dan harus diganti dengan dan . Tetapi hal ini akan menjadi masalah manakala kita menggunakan Netscape yang mana tidak mengenal penulisan tag seperti . Kita tidak tahu mengapa, tetapi mengubah menjadi membuat tag dapat bekerja dengan baik. Setelah semua itu diatasi, pastikan semua bagian tag kosong untuk diganti bentuknya.
6. Web Site di validasi Setelah semua itu diubah maka semua halaman divalidasi menggunakan W3C DTD, yaitu pada link : XHTML Validator. Setiap ada error kita perbaiki secara manual. Error yang sering terjadi adalah lupa menambahkan tag pada penutup list.
XHTML - Modularisasi Modularisasi XHTML mendefinisikan modul pada XHTML.
Kegunaan Modularisasi XHTML XHTML merupakan sederhana tetapi memiliki kemampuan yang luas, berisi berbagai macam kegunaan yang akan dibutuhkan oleh para web developer. Beberapa kegunaan XHTML tertentu sangat bear dan kompleks, dan untuk kegunaan tertentu sangat sederhana. Dengan membagi XHTML ke dalam modul-modul, maka W3C (World Wide web Consortium) telah membuat pengaturan elemen XHTML kecil dan didefinisikan dengan benar untuk dapat digunakan secara terpisah untuk digunakan oleh peralatan yang sederhana sehingga dapat dikombinasikan dengan XML standard menjadi aplikasi yang lebih besar dan lebih lengkap. Dengan modular XHTML, perancang aplikasi dapat:
Memilih elemen-elemen yang didukung oleh perangkat dengan XHTML membangun blok-blok. Menambah ekstensi ke XHTML, menggunakan XML, tanpa merusak XHTML standard. XHTML dapat digunakan untuk peralatan yang portabel dan tanpa kabel sepertikomputer genggam, hand phone, TV, dan peralatan-peralatan rumah. Memperluas cakupan XHTML menjadikan sebuah aplikasi yang lengkap dengan menambah
-8-
kemampuan XML di dalamnya (seperti MathML, SVG, Voice dan Multimedia). Mendefinisikan XHTML seperti dasar XHTML (adalah kegunaan mendasar untuk penerapannya pada peralatan yang mobile).
Modul-modul XHTML W3C telah membagi definisi XHTML ke dalam 28 modul: Nama Modul Applet Module
Keterangan Mendefinisikan elemen applet
Base Module Basic Forms Module
Mendefinisikan elemen base Mendefinisikan dasar elemen form.
Basic Tables Module Bi-directional Text Module
Mendefinisikan dasar elemen table Mendefinisikan elemen bdo.
Client Image Map Module Edit Module
Mendefinisikan elemen image map di sisi browser. Mendefinisikan editing element (del dan ins).
Forms Module Frames Module Hypertext Module
Mendefinisikan semua elemen yang digunakan pada form. Mendefinisikan elemen frameset. Mendefinisikan elemen a.
