perbedaan HTML Dan HTML 5

Pengertian HTML

Sebelum belajar tentang apa itu HTML5, ada baiknya jika Anda belajar HTML dari pengertiannya terlebih dahulu. Sesuai dengan namanya, HTML atau hypertext markup language adalah sebuah bahasa markup yang menjadi salah satu dasar pembuatan website.

Tidak seperti bahasa pemrograman yang bertugas mengolah input data dengan logika yang telah ditetapkan, bahasa markup ditulis untuk memberikan struktur pada sebuah halaman website. Agar konsep tersebut dapat lebih mudah dipahami, perhatikanlah penjelasan berikut ini.

Cara Kerja HTML

Pada dasarnya, HTML digunakan untuk menunjukkan elemen-elemen yang terdapat pada suatu halaman website. Setiap elemen ditunjukkan dengan tag <> (pembuka) dan </> (penutup).

Kedua tag tersebut berisi inisial yang mewakili sebuah elemen halaman website. Contohnya adalah <p> yang merepresentasikan sebuah paragraf.

Akan tetapi, tag tersebut hanyalah sebuah penanda. Agar memiliki konten, Anda perlu memasukkan teks di antara tag <p> dan </p>. Dengan demikian, Anda baru saja membuat sebuah paragraf.

Perbedaan HTML dan HTML5

HTML5 adalah perbaikan dari HTML. Versi ini diciptakan sebagai solusi untuk kebutuhan saat ini — salah satunya adalah dukungan untuk membuat website yang bersifat mobile-friendly.

HTML5 mampu menangani error secara lebih baik dibanding HTML. Selain itu, HTML5 juga menggunakan syntax yang lebih sederhana dibanding HTML, sehingga developer bisa membuat struktur halaman website yang kompleks secara lebih mudah.

Namun, perbedaan HTML5 dari pendahulunya tidak berhenti di situ. Berikut ini adalah keunggulan-keunggulan lainnya yang dimiliki HTML5:

1. Penanganan Error yang Lebih Baik
2. Kemudahan untuk Membuat Aplikasi Web
3. Syntax yang Lebih Sederhana
4. Dukungan untuk Pembuatan Website Responsive
5. Support untuk Konten Video dan Audio
6. Dukungan untuk Grafik Vektor
7. Kompatibel dengan lebih Banyak Browser
8. Penyimpanan Informasi secara Lokal
9. Fokus Otomatis pada Kolom Form
10. Menjalankan JavaScript di Web Browser

1. Penanganan Error yang Lebih Baik

Bukalah sebuah halaman website pada beberapa web browser yang berbeda. Bisa jadi, ada beberapa bagian dari tampilannya yang tidak terlihat sama di masing-masing browser. Penyebabnya adalah kode HTML halaman tersebut yang kurang sempurna untuk web browser tertentu.

Akan tetapi, kesalahan dalam penulisan kode HTML tidak bisa dihindari. Oleh karena itu, sudah menjadi tugas developer web browser untuk membuat algoritma parsing untuk menangani contoh error di atas.

Untungnya, HTML5 menawarkan sistem penanganan error yang lebih baik dari pendahulunya. Hal ini pun mempermudah kinerja developer web browser dalam pembuatan algoritma parsing.

Dengan kata lain, website yang ditulis dengan HTML5 membantu web browser untuk menangani kode HTML yang tidak sempurna.

2. Kemudahan untuk Membuat Aplikasi Web

Sebelum dirilisnya HTML5, mayoritas website bersifat statis karena HTML versi terdahulu tidak memiliki fitur bawaan yang mendukung konten dinamis seperti animasi dan video. Untuk memungkinkannya, web developer masih bergantung banyak pada Flash dan JavaScript.

Namun, banyak website saat ini yang tampilan dan kinerjanya menyerupai aplikasi yang berjalan di luar web browser. Coba Anda lihat Twitter dan YouTube sebagai contohnya.

Bahkan, kini sudah banyak website dengan model single page. Situs-situs ini hanya menggunakan satu halaman yang ditulis menggunakan HTML, tetapi dapat menampilkan konten interaktif. Contohnya Adalah produk-produk Google seperti Gmail.

Semua itu dapat terjadi berkat berbagai elemen baru dalam HTML5 yang menggantikan kinerja Flash dan JavaScript. Di samping itu, versi kelima ini juga membuat konten dinamis bekerja dengan lebih lancar.

3. Syntax yang Lebih Sederhana

Sebelum implementasi HTML5, web developer harus menggunakan tag <div> untuk berbagai macam elemen. Tag tersebut diperlukan untuk menandai sebuah section pada halaman website.

Penggunaan tag tersebut tidak menjadi masalah jika Anda membuat sebuah halaman yang sederhana. Akan tetapi, hal ini dapat merepotkan developer ketika menulis kode untuk halaman website dengan struktur kompleks.

Untungnya, HTML5 mengganti penandaan section dengan syntax yang lebih sederhana, seperti tag <nav> untuk menunjukkan menu navigasi website dan tag <footer> yang merepresentasikan bagian footer halaman. Tentunya ini menjadi salah satu manfaat HTML5 bagi web developer yang paling penting.

4. Dukungan untuk Pembuatan Website Responsive

Telepon seluler belum dilengkapi dengan web browser ketika HTML4 diluncurkan. Inilah alasan mengapa versi tersebut belum memiliki framework untuk pembuatan website mobile yang efisien.

Akan tetapi, kebiasaan browsing telah berubah banyak sejak saat itu. Di 2018 saja, 58% akses website dilakukan melalui perangkat mobile.

Nah, HTML5 dibuat sebagai solusi untuk perubahan tersebut. Dengan keluaran terbaru ini, web developer dapat membuat website responsive, yaitu website yang tampilannya dapat diadaptasikan untuk tampilan mobile dengan lebih mudah.

5. Support untuk Konten Video dan Audio

HTML4 memang tidak memiliki dukungan yang baik untuk konten-konten video dan audio karena kecepatan koneksi internet di akhir dekade 90-an yang kurang memadai.

Maka dari itu, tidak aneh apabila pembuatan website berisi konten multimedia dengan HTML4 tidak mudah dilakukan.

Sebagai solusi dari masalah tersebut, HTML5 diciptakan dengan fitur-fitur yang mempermudahnya. Contohnya adalah atribut controls yang digunakan untuk membuat tombol play dan pause pada sebuah media player.

6. Dukungan untuk Grafik Vektor

Seperti yang telah disebutkan sebelumnya, website responsive kini merupakan sebuah keharusan. Namun, pembuatannya membutuhkan desain visual yang ukurannya bisa diperbesar tanpa terdistorsi.

Grafik vektor, yang melingkupi file-file dengan tipe SVG, AI, dan EPS, adalah solusinya. Tidak seperti file JPG atau PNG yang pecah ketika diperbesar, kualitas grafik vektor tetap terjaga.

Karena HTML5 mempermudah pembuatan website responsive, dukungan untuk grafik vektor pun sudah termasuk di dalam daftar keunggulannya.

7. Kompatibel dengan lebih Banyak Browser

Saat ini sudah ada begitu banyak web browser yang tersedia. Tak hanya di laptop dan komputer, tetapi juga di perangkat mobile.

Sebenarnya browser-browser tersebut masih dapat membaca website yang ditulis dengan HTML versi lama. Akan tetapi, tidak semuanya dapat menerjemahkan kode HTML4 dengan baik.

Di sisi lain, website yang dibuat dengan HTML5 telah dioptimalkan untuk berbagai web browser yang ada saat ini.

8. Penyimpanan Informasi secara Lokal

Versi-versi HTML sebelumnya memang telah memungkinkan penyimpanan informasi  pengguna website. Hal ini diperlukan, terutama untuk website yang memiliki konten interaktif.

Akan tetapi, penyimpanannya dilakukan dengan sistem cookies yang notabene hanya mampu menampung sedikit data.

Pada HTML5, cara penyimpanan informasi telah ditingkatkan dengan objek localStorage yang menggantikan cookies dengan penyimpanan lokal browser pengguna internet.

9. Fokus Otomatis Pada Kolom Form

Untuk memahami keunggulan ini, coba Anda buka sebuah halaman website dengan form di dalamnya. Sebut saja halaman login sebuah website, sebagai contohnya.

Jika kursor Anda langsung muncul di salah satu kolom form tersebut, berarti website tersebut dibuat menggunakan HTML5.

10. Menjalankan JavaScript di Web Browser

Pada website yang menggunakan HTML versi sebelumnya, kode JavaScript hanya bisa dijalankan pada thread antarmuka browser. Hal ini menyebabkan konten interaktif pada halaman tidak berfungsi hingga halaman tersebut selesai dimuat.

Kabar baiknya, HTML5 hadir dengan JS Worker API yang memungkinkan JavaScript untuk berjalan di thread terpisah. Dengan demikian, pengguna browser tetap dapat berinteraksi dengan halaman tersebut, seperti klik tombol dan mengetik dalam sebuah kolom.