Langsung ke isi website
Langsung ke navigasi

Artikel XHTML (Web Standards)

Perbedaan antara XHTML Transitional dan XHTML Strict

Oct 29 2007

Ditulis oleh Dhimas Ronggobramantyo
Kategori: XHTML (Web Standards)
Dibaca 3320 kali

Langsung lihat komentar

Jika kita membicarakan masalah Web Standard, maka kita harus mengetahui tentang XHTML (Silahkan baca artikel mengenai dasar XHTML terlebih dahulu). XHTML sendiri dibagi menjadi 3 model, dan 2 diantaranya yang paling banyak digunakan adalah XHTML Transitional dan XHTML Strict.

XHTML Transitional vs XHTML Strict

Bagi anda yang ingin beralih ke teknologi XHTML, cara yang paling mudah adalah dengan beralih ke XHTML Transitional terlebih dahulu. Karena jika anda langsung beralih ke XHTML Strict anda akan kaget ketika mengecek validasi website anda, karena akan terdapat banyak error. Kenapa bisa begitu? hal ini dikarenakan semua bagian untuk mempresentasikan / layout website diatur oleh CSS.

Yang pertama-tama perlu diketahui adalah, kita mendeklarasikan apakah file kita XHTML Transitional atau XHTML Strict. Dengan mendeklarasikan file kita, maka Search Engine, browser dan validator dapat mengetahui jenis dokumen kita termasuk tipe apa. Inilah deklarasinya:

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">

Saya yakin anda sudah mengerti yang itu, karena saya sudah pernah membahasnya diartikel saya mengenai dasar XHTML. Kita langsung saja membahas apa yang tidak boleh pada XHTML Strict.

Tag HTML yang tidak digunakan lagi

Oke, pada XHTML strict beberapa tag HTML tidak digunakan lagi. Alasannya biasanya karena penggunaan tag tersebut bisa digantikan di dalam CSS. Yaitu tag <u>, <center> dan <font>. Tag <u>yaitu tag untuk membuat garis bawah sudah tidak dipakai lagi, karena pada CSS kita bisa menggunakan text-decoration:underline;. Demikian pula untuk <font> yang didalam CSS bisa kita ubah sesuka hati, serta <center> yang bisa digantikan dengan text-align:center; di CSS.

Ada lagi tag-tag HTML yang dihilangkan tetapi diganti dengan tag lainnya yaitu <i> yang diganti dengan <em> dan <b> yang diganti dengan <strong>

Ada lagi tag HTML penting yang tidak digunakan lagi yaitu <iframe>. Jadi bagi anda pengguna frames maka berhati-hatilah anda tidak bisa membuat web anda menjadi standard. Alasan W3C untuk tidak menggunakan <iframe> karena <iframe> mengambil halaman lain, dan jika halaman lain tersebut tidak standard, maka keseluruhan website akan menjadi kacau. Belum lagi kenyataan bahwa kebanyakan ponsel ataupun PDA tidak bisa menampilkan <iframe>. Karena W3C membuang <iframe>. Tetapi W3C berbaik hati, apabila anda tetap ingin menggunakan frames maka anda dapat menggunakan XHTML Frameset. Dimana anda perlu mengubah deklarasinya menjadi seperti ini:

XHTML 1.0 FRAMESET 

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Atribut yang tidak digunakan lagi

Ada banyak sekali atribut yang tidak digunakan lagi, dan saya akan membahas yang paling penting saja dan paling banyak digunakan. Yang pertama-tama adalah align, yang hanya boleh digunakan untuk mengatur table. bgcolor dan background juga sudah dibuang jauh-jauh oleh W3C serta pengguaan noshade pada <br>.

Yang terpenting dan paling menyebalkan adalah target pada tag <a>. Ya atribut target sudah tidak diijinkan lagi. Hal ini menyebabkan kita tidak bisa membuat link yang jik diklik aan memunculkan jendela baru target="_blank". Alasannya adalah, semua browser (hampir semua) sudah menggunakan model tab-tab didalam browsernya. Dan satu lagi alasan dari W3C adalah ponsel dan PDA anda tidak bisa memunculkan jendela browser baru. Karena itu atribut target sudah dibuang oleh W3C.

Struktur Dokumen

Dalam XHTML strict kita harus berhati-hati dalam menyusun dokumen HTML kita. Harus terstruktur dengan baik. Berikut ini adalah contoh yang salah: 

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>Judul Halaman Web</title>

</head>

<body>

Isi halaman Web<br />

<img src="images.jpg" width="100" height="100" alt="Gambarku" />

</body>

</html>

Penggunaan struktur seperti itu salah, anda harus meletakkan text dan images didalam <p> atau <div>. Jadi yang benar adalah seperti ini: 

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>Judul Halaman Web</title>

</head>

<body>

<p>Isi halaman Web<br />

<img src="images.jpg" width="100" height="100" alt="Gambarku" />
<p/>
</body>

</html>
Sering-seringlah mencoba dan mengecek apakah website anda standard, dengan demikian lama kelamaan anda akan hapal bagaiman seharusnya menggunakan tag dan atribut yang benar.

Demikian pula untuk tag-tag lain seperti <input> dan <label> yang wajib anda letakkan didalam tag <p>. Karena itu didalam membuat website yang standard anda harus sering-sering mengecek apakah website anda standard menggunakan XHTML Validator

Sekilas mengenai XHTML 2.0

Ya, anda tidak salah baca, pada 2007 ini W3C telah menyesaikan draft / rancangan untuk XHTML 2.0. Banyak diprotes karena kodenya benar-benar berbeda dan memiliki malah kompatibilitas pada browser-browser terkini apalagi browser yang kuno. Beberapa hal yang baru pada XHTML 2.0 adalah:

  • Forms akan digantikan dengan XForms dan Frames akan digantikan XFrames
  • Ada tag HTML baru yaitu <nl> yang digunakan untuk membuat <ul> bertingkat.
  • Semua tag HTML berfungsi juga sebagai anchor / link. Jadi anda bisa membuat <strong href="main.html">Ini adalah link</strong>. Ini baru aneh :)
  • Semua tag HTML juga bisa diberi atribut src. Jadi anda bisa membuat kode sepert ini <p src="gambar.jpg" type="image/jpeg">London Bridge</p>. Semakin menarik kan?
  • alt atribut telah dihilangkan sebagai gantinya anda dapat meletakkannya diantara tag <img>. Contoh: <img src="gambar.jpg">Gambar <em>saya</em></img>.

Bagaimana? penasaran? sayangnya belum ada informasi kapan XHTML 2.0 akan menjadi standard. Sementara ini anda gunakan saja XHTML Strict, yang merupakan Standard terbaik saat ini.

Simpan artikel ini ke: Digg it Del.icio.us Furl Reddit

Komentar [9]

1
Komentar Dikirim oleh achsyar pada 26 Januari 2008 08:32:55 WIB

bagussssssssssssssssss bagtttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt

2
Komentar Dikirim oleh fonihadi pada 15 Mei 2008 04:21:52 WIB

wah...wah..wah..saya pikir xhtml itu merubah total code html yang ada...ternyata tidak juga...saya sudah keblinger tadinya. berkat penjelasan anda saya sudah sedikit banyak tahu..trims

3
Komentar Dikirim oleh Leoarjuna pada 05 Juli 2008 06:02:29 WIB

Kalau validasi ke dua duanya di gabungkan bagaimana? Jadi ada 2 validasi strict dan trantional.

4
Komentar Dikirim oleh fanari pada 20 Oktober 2008 10:29:29 WIB

mas sebenarnya bagus mana sih transitional atau strict? sekarang saya pakai tipe strict di blog saya, agak repot sih karena banyak aturannya

5
Komentar Dikirim oleh awan pada 04 Maret 2009 07:24:10 WIB

Maaaaaas..,

tolong.,

saya mahasiswa ilmu komputer yang lagi mengambil mata kuliah pemrograman web.,

dan saya menemukan artikel2 mas yang luar biasa mudah dicerna oleh saya, coz kebanyakan tutorial ga pake bahasa manusia., tapi make bahasa yang hanya orang2 tertentu yang paham (maklum pemula).,

saya butuh seorang yang benar2 paham masalah itu.,

kalo berkenan., apa mas mau memberikan alamat mailnya utk saya masukkan ke list YM saya..?

thx: a_setiawan_003@yahoo.com

6
Komentar Dikirim oleh ismail pada 12 Mei 2009 11:09:40 WIB

saya benar2 butuh teman untuk....,untuk belajar ajax end xhtml.

7
Komentar Dikirim oleh Budi Irawan pada 11 Juli 2009 11:51:31 WIB

artikel menarik tapi saya belum paham mengenai cara pembuatan formulir online. tolong kirim artikel cara pembuatan formulir online. terima kasih
budii1167@gmail.com

8
Komentar Dikirim oleh andru skipinside pada 06 September 2009 01:10:55 WIB

mas masih awam nih heheh

9
Komentar Dikirim oleh belajar buat web pada 06 Desember 2009 01:42:20 WIB

wah, ini dia artikel yang saya cari-cari..
Makasih mas...

Owh yah saya mau tanya \"Gimana cara buat code area-nya?\"

kasih tau saya yah di wilianto.indra@gmail.com

Kembali keatas

Kirim Komentar:



Security Number