Home » Artikel HTML » Pengenalan XHTML

Monday, June 11, 2012

Pengenalan XHTML

Untuk artikel ini akan langsung kepokok bahasannya saja.

Apa itu XHTML
XHTML dapat dimengerti sebagai satu versi yang lebih ketat dan merupakan versi yang diupgrade dari HTML 4.01.

XHTML berbasis XML, dan memang dirancang agar dapat bekerjasama dengan browser-browser yang berbasis XML.

Faktanya bahwa XHTML adalah aplikasi XML, konsep well-formed atau sempurna adalah diharuskan, praktek-praktek tertentu yang biasanya legal atau diperbolehkan di dalam HTML 4 harus diubah, maksudnya ada beberapa aturan-aturan yang memang harus diikuti oleh kita untuk membangun dokumen HTML yang sempurna, dan aturan-aturan tersebut adalah:

  1. Posisi tumpang tindih tag harus benar
    Sangat terutama sekali agar dokumen menjadi sempurna adalah dengan memastikan bahwa tag dari semua elemen harus tersarang dengan benar atau posisi tumpang tindihnya adalah benar.

    Contoh tumpang tindih tag yang benar:

    <strong><em>Ini benar.</em></strong>

    Contoh tumpang tindih tag yang salah:

    <strong><em>Ini salah.</strong></em>

  2. Penamaan
    Penulisan nama tag harus menggunakan huruf kecil semua, contohnya untuk elemen LI harus dituliskan <li> dan bukan <LI>.

    Penulisan nama atribut harus sesuai dengan standardnya, contohnya untuk atribut TYPE dari elemen INPUT harus dituliskan type dan bukan TYPE.

    Perbedaan ini perlu, karena XML membedakan huruf kecil dan huruf besar.

    Contoh penulisan penamaan yang benar:

    <strong class="myClass">Ini benar.</strong>

    Contoh penulisan penamaan yang salah:

    <STRONG CLASS="myClass">Ini salah.</STRONG>

  3. Tag harus ditutup
    Di dalam HTML untuk elemen tertentu memang diizinkan menghilangkan tag penutupnya atau memang tidak mempunyai tag penutupnya. Tetapi, didalam XHTML setiap tag harus ditutup, tidak terkecuali elemen BR, IMG, BASE, LINK, dst.

    Contoh-contoh benar:

    <strong><em>Ini benar.</em></strong> <br /> <img src="myImage" width="10" height="10"/>

    Contoh-contoh salah:

    <strong><em>Ini salah.</em> <br> <img src="myImage" width="10" height="10">

  4. Nilai atribut harus diapit tanda kutip
    Untuk setiap nilai dari sebuah atribut harus diapit tanda kutip, bahkan jika nilai atribut tersebut berupa angka.

    Contoh benar:

    <img src="myImage" width="10" height="10"/>

    Contoh salah:

    <img src=myImage width=10 height=10/>

  5. Atribut-atribut boolean
    XML tidak mendukung atribut-atribut boolean yang disingkat penulisannya, maksudnya XML tidak mendukung penulisan nama atribut dan nilai atribut yang disingkat. Contohnya COMPACT, NOWRAP, ISMAP, DECLARE, NOSHADE, CHECKED, DISABLED, READONLY, MULTIPLE, SELECTED, NORESIZE, DEFER.

    Contoh benar:

    <dl compact="compact">

    Contoh salah:

    <dl compact>

  6. NAME dan ID
    Penggunaan atribut NAME untuk A, APPLET sebaiknya diganti dengan atribut ID, dan kalaupun NAME memang ingin disertakan, atribut ID-pun harus disertakan.

    Contoh:

    <img id="myId" width="10" height="10"/>

  7. SCRIPT dan STYLE
    Bungkuslah isi-isi dari elemen SCRIPT dan STYLE menggunakan CDATA.

    Contoh untuk SCRIPT:

    <script type="text/javascript"> <![CDATA[ ... kode-kode javascript disini ... ]]> </script>

    Contoh untuk STYLE:

    <style type="text/css"> <![CDATA[ ... kode-kode css disini ... ]]> </style>

  8. Nilai atribut pre-defined
    Nilai atribut pre-defined, misalnya seperti nilai atribut TYPE dari elemen INPUT harus dituliskan dengan benar, seperti seharusnya text, button, reset, dll --- dan bukan seperti TEXT, BUTTON, RESET, dll.

    Contoh benar:

    <input type="text"/>

    Contoh salah:

    <input type="TEXT"/>

  9. Ruang spasi ganda didalam nilai-nilai atribut
    Hindarilah adanya ruang spasi ganda diantara karakter-karakter didalam nilai-nilai atribut. Ini akan menyebabkan ditanganinya dengan tidak konsisten oleh browser-browser.

    Contoh yang dimaksud:

    <p class="myClass  " id="  myId">

  10. ISINDEX
    Jangan menggunakan lebih dari satu elemen ISINDEX dibagian HEAD. Untuk menuliskan fungsi yang sama seperti ISINDEX dibagian lainnya dapat menggunakan elemen INPUT, ini lebih baik karena sebenarnya ISINDEX termasuk elemen usang di HTML.

  11. xml:lang dan lang
    Gunakanlah kedua-duanya, yaitu xml:lang dan lang ketika menetapkan bahasa dari sebuah elemen. Penulisan xml:lang harus lebih dahulu dituliskan dibanding penulisan lang.

    Contoh:

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="id" lang="id">

  12. Karakter-karakter tertentu harus menggunakan Entity
    Karakter-karakter khusus (misal, <, >, &, ', dan ") harus dituliskan dengan menggunakan karakter entity. Ini termasuk jika karakter-karakter khusus tersebut dituliskan sebagai nilai dari atribut.

    Sebagai contoh, ketika nilai atribut HREF dari elemen A berisi karakter &, dia harus dinyatakan sebagai:

    http://example.com/cgi-bin/myscript.pl?class=guest&amp;name=user

    Dan tidak seperti:

    http://example.com/cgi-bin/myscript.pl?class=guest&name=user

  13. !DOCTYPE
    Penggunaan !DOCTYPE adalah penting, yaitu untuk menetapkan tipe dokumen yang ada. Berikut deklarasi tipe dokumen di XHTML 1.0:

    • XHTML 1.0 Strict
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    • XHTML 1.0 Transitional
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    • XHTML 1.0 Frameset
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Posted by at