Tutorial Belajar HTML5 Part 1: Perbedaan HTML5 dengan HTML 4 dan XHTML 1.1

Pada panduan pertama-tama mengenai HTML5, kita akan membahas mengenai perbedaan antara HTML5 dengan HTML 4 dan XHTML 1.1.


Panduan kali ini diperuntukkan untuk sahabat yang pernah menggunakan HTML 4.01 maupun XHTML 1.1 sebelumnya. Seandainya terdapat beberapa penjelasan yang belum dimengerti silahkan abaikan saja, karena kita akan membahasnya secara lebih mendalam pada tutorial-tutorial HTML5 berikutnya.

HTML5 vs (HTML 4 dan XHTML 1.1)

HTML5 yakni versi terbaru dari HTML. Versi terakhir HTML sebelum HTML5 yakni HTML 4.01. dan XHTML 1.1. Kali ini kita akan membahas apa saja fitur-fitur baru yang terdapat di pada HTML5 serta perbedaannya dengan versi HTML sebelumnya.

Perkembangan HTML terhenti di versi 4.01 di tahun 1999. W3C selaku badan yang bertanggung jawab pada standarisasi teknologi internet (termasuk HTML), kemudian beralih memaksimalkan XHTML yang pun akhirnya menemui jalan buntu di versi 2.0. Seandainya sebelumnya sahabat telah terbiasa menggunakan HTML 4.01 ataupun XHTML 1.1, terdapat perubahan kecil di HTML5.

Di dasarnya HTML5 yakni gabungan ‘best practice‘ dari HTML 4.01 dan XHTML. Hampir segala tag atau unsur di HTML 4.01 maupun XHTML 1.1 dapat digunakan pada HTML5.

Beberapa perbedaan yang akan ditemukan pada HTML5:

  • Penulisan doctipe di HTML5 lebih sederhana. Mungkin inilah perbedaan sangat mencolok dari halaman HTML yang ditulis menggunakan HTML5 atau tak. Penulisan Doctype atau DTD di HTML5 menjadi lebih sederhana: <!DOCTYPE html>.

  • Penulisan type atribut bagi tag <style> dan <script> tak diperlukan di HTML5. Hal ini karena secara default web browser akan menggunakan text/css bagi tag <style>, dan text/javascript bagi tag <script>. Selaku contoh, bagi menggunakan external CSS, Di HTML versi sebelumnya kita menuliskan tag <style> secara komplit: <style type=”text/css”>…kode CSS… </style>, namun pada HTML5 kita dapat membuatnya lebih sederhana: <style>…..kode CSS…..</style>

  • Penulisan meta tag karakter set (charset) di HTML5 menjadi lebih sederhana: <meta charset=”utf-8″>, diperbandingkan versi sebelumnya: <meta http-equiv=”content-type” content=”text/html;charset=UTF-8″ />.

  • Di HTML5, tag yang berdiri sendiri (void element) tak mesti ditutup seperti pada XHTML. Penulisan tag <br> (break) dapat ditulis dengan <br> maupun <br />.

  • Walaupun tak dianjurkan, sebuah tag di HTML5 boleh ditulis tanpa tag awal atau tanpa tag ahir. Selaku contoh, kita tak perlu menutup tag <p> dengan tag </p>.

  • Penulisan tag dan atribut yakni case-insensitive di pada HTML5, sehingga tag <p> dan tag <P> akan dianggap sama. Hal ini berbeda dengan XHTML yang mengharuskan seluruh tag ditulis pada huruf kecil.

  • Penulisan atribut tak mesti di pada tanda kutip. Selaku contoh: <p class=satu> yakni valid. Namun jikalau nilai atribut terdiri dari karakter spasi, karenanya tetap mesti menggunakan tanda kutip, seperti: <p class=”satu dua tiga”>.

  • HTML5 mendukung multimedia secara seketika menggunakan tag <audio> dan <video>, sehingga kita tak perlu tergantung kepada program pihak ke-3 seperti flash player.

  • HTML 5 hanya mempunyai 1 versi, tak seperti pendahulunya yang mempunyai 3 versi (di HTML 4 dan XHTML, sahabat akan menemukan versi strict, transitional, dan frameset).

Selaku contoh, kode HTML berikut dinyatakan valid oleh validator HTML5 di http://validator.w3.org/:

 Dari perbedaan diatas, terlihat bahwa HTML5lebih bebas‘ dari XHTML. Akan tetapi sebaiknya kita tetap menggunakan penulisan yang ‘rapi‘, seperti menggunakan huruf kecil bagi segala tag, menutup segala tag dan memberi tanda kutip pada setiap nilai atribut.


XHTML5 : HTML5 “rasa” XML

Seandainya beberapa aturan diatas dirasa terlalu longgar (terutama jikalau sahabat banyak menggunakan XHTML sebelumnya), HTML5 mempunyai ‘rasa‘ yang lebih ketat aturan, yakni XHTML5. Di pada XHTML5, seluruh tag mesti ditulis dengan huruf kecil, atribut mesti berada di pada tanda kutip, dan setiap
tag mesti ditutup.

XHTML5 bukanlah versi lain dari HTML5, akan tetapi hanya HTML5 dengan beberapa aturan dan syntax bagi memenuhi syarat XML.

Bagi menggunakan XHTML5, kita butuh menambahkan atribut xmlns=”http://www.w3.org/1999/xhtml” di tag <html>, dan menggunakan MIME type: application/xhtml+xml di http header (diset via web server).

Contoh dokumen XHTML5 yakni selaku berikut:

Ketika ini pemakaian XHTML5 tak terlalu populer, karena memang lebih mudah dan cepat menggunakan HTML5. XHTML5 akan bermanfaat jikalau sahabat ingin menggunakan teknologi yang dengan XML seperti SVG, MathML, Xlink, dll.

Pada panduan belajar HTML5 kali ini kita telah membahas mengenai HTML5, HTML4, dan XHTML. Namun jikalau sahabat perhatikan, penulisan HTML5 ditulis tanpa menggunakan spasi antara huruf HTML dengan angka 5. Kenapa mesti demikian? kita akan membahasnya pada panduan HTML5 berikutnya: Perbedaan antara HTML5 dengan HTML 5.


eBook HTML Uncover Duniailkom

Kamu serius ingin menguasai HTML? Duniailkom telah menyusun eBook HTML Uncover. eBook ini membahas HTML dengan lebih detail dan lebih komplit hingga fitur terbaru HTML5. Penjelasan lebih lanjut dapat ke: eBook HTML Uncover Duniailkom.


Sumber https://www.duniailkom.com/

Share

You may also like...