HTML (Hypertext Markup Language): Pengertian, Sejarah, Fungsi, Kerangka Inti, dan Cara Kerjanya

Table of Contents

HTML (Hypertext Markup Language)

Pengertian HTML (Hypertext Markup Language)

HTML (Hypertext Markup Language) adalah bahasa markah standar untuk dokumen yang dirancang untuk ditampilkan di peramban internet. Dengan kata lain, HTML merupakan standar universal yang membuat halaman web bisa masuk ke situs pencarian seperti Google atau Bing.

Peramban internet menerima dokumen HTML dari server web atau dari penyimpanan lokal dan membuat dokumen menjadi halaman web multimedia. HTML menggambarkan struktur halaman web secara semantik dan isyarat awal yang disertakan untuk penampilan dokumen. 

Baca Juga: Pengertian Website, Sejarah, Unsur, Fungsi, Jenis, dan Manfaatnya

Sejarah HTML

HTML pertama kali dibuat oleh Tim Berners-Lee seorang fisikawan di lembaga penelitian CERN, Swiss. Berners-Lee mempunyai ide atau pemikiran mengenai sistem hypertext berbasis internet. Sekitar tahun 1991, Tim merilis versi HTML pertama yang di dalamnya terdalam sekitar 18 tag.

Saat ini, HTML mengalami beberapa pengembangan dari sisi fitur serta informasi yang disajikan hingga versi terbaru, yaitu HTML5. Setiap tahunnya, bahasa ini mempunyai tingkat popularitas yang cukup tinggi sehingga dijadikan sebagai web standar resmi di dunia pemrograman.

HTML juga mengalami tahap perbaikan dan dikembangkan oleh World Wide Web Consortium (W3C). Tahun 2014, mengalami upgrade yang cukup signifikan dan terdapat fitur semantik untuk memudahkan pengembang website dalam menyusun kode dan memberitahukan makna dari konten tersebut, misalnya <article>, <footer>, dan <header>.

Perkembangan Kode HTML

Berikut merupakan sejarah perkembangan kode HTML mulai dari versi awal sampai sekarang.
1. HTML Versi 1.0
Bermula pada versi 1.0. Versi 1.0 ini merupakan pionir yang masih banyak kelemahan sehingga tampilannya masih sederhana. HTML versi 1.0 mempunyai kemampuan untuk membuat paragraf, heading, list, hypertext dan cetak tebal atau miring pada teks. Versi 1.0 juga dapat mendukung peletakan gambar atau image pada dokumen tanpa wrapping.

2. HTML Versi 2.0
HTML versi 2.0 mempunyai fitur tambahan yaitu kualitas HTML lebih baik. Versi 2.0 mempunyai kemampuan dalam menampilkan data atau form pada dokumen serta memasukkan alamat, nama, dan saran atau kritik. HTML versi 2.0 ini adalah pionir untuk web interaktif.

3. HTML Versi 3.0
Versi 3.0 mempunyai tambahan fitur dengan fasilitas baru yaitu figure. Figure adalah perkembangan dari image yang berfungsi untuk meletakan gambar serta tabel. HTML versi 3.0 juga dapat mendukung adanya rumus matematika pada dokumen. Versi 3.0 sekarang digantikan dengan versi 3.2.

4. HTML Versi 3.2
Versi 3.2 adalah HTML yang paling sering digunakan. Versi ini mempunyai teknologi untuk meletakan teks pada keliling gambar. Sehingga gambar mempunyai latar belakang, frame, style, tabel, dan sebagainya. Versi 3.2 juga dapat menggunakan script untuk mendukung kinerja HTML.

5. HTML Versi 4.0
HTML versi 4.0 mengalami banyak perubahan dari versi sebelumnya. Perubahan tersebut pada perintah HTML yaitu image, tabel, text, link, form dan sebagainya.

6. HTML Versi 4.01
Terdapat juga versi 4.01 yang merupakan perbaikan dari versi 4.0. Versi ini menjadi standar untuk elemen atau atribut pada HTML. Karena sudah memperbaiki kesalahan pada versi sebelumnya.

7. HTML Versi 5.0
HTML versi 5 merupakan prosedur pembuatan tampilan web terbaru dengan penggabungan antara CSS, HTML dan JavaScript. Versi ini dibuat dari informasi bahwa W3C dan IETF membuat versi HTML yang terbaru.

HTML versi 5.0 menjadi versi paling baik dengan fitur yang lebih lengkap. HTML 5 mempunyai fitur canggih yaitu support pada embed video dan audio. Sehingga Anda bisa menggunakan file video atau audio ke halaman website yang diinginkan.

Fitur tersebut mendukung juga untuk grafis vektor dengan skala dan mathML untuk rumus matematika atau lainya. HTML 5 memperkenalkan perbaikan ranah semantic pada browser sehingga konten dapat dilihat dan dibaca oleh pengguna lain serta bagi Anda sendiri.

Fungsi HTML

Berikut beberapa hal yang bisa dilakukan melalui HTML di antaranya,
1. Menjadi pondasi utama dan layout sebuah website.
2. Membuat halaman website yang dinamis dan menarik.
3. Menampilkan media tambahan pada website.
4. Mendefinisikan fungsi dan tampilan konten website.
5. Membuat table, spasi, form, list, font, dan sebagainya.
6. Mengatur tampilan dan isi dari halaman website.
7. Mempublikasikan halaman website di internet.

Baca Juga: Dynamic Website: Pengertian, Tujuan, Cara Kerja, Jenis, Manfaat, Contoh, dan Perbedaannya dengan Static Website

Kerangka Inti HTML

Berikut beberapa macam kerangka inti yang membentuk struktur bahasa markup di antaranya,
1. Tag, merupakan perintah atau awalan instruksi yang nantinya akan dibaca pada web browser. Misalnya adalah penggunaan tag <strong>, yang berfungsi untuk memberikan ketebalan pada teks paragraf.
2. Element, merupakan proses keseluruhan kode yang dimulai dari tag pembuka (< >) dan diakhiri dengan tag penutup (</>), sebagai contoh element <p>Ini adalah website saya</p>.
3. Attribute, merupakan informasi atau perintah tambahan yang dimasukkan ke dalam sebuah elemen. Misalnya saja <img class=”gambar” src=”komputer.jpg” alt=”komputer1” />, sehingga atributnya adalah class, src dan alt image.

Cara Kerja HTML

1. <!DOCTYPE html> Berfungsi untuk mendeklarasikan kepada komputer bahwa Anda menuliskan sebuah perintah di dalam kode HTML.
2. <html></html> Berfungsi untuk tag yang menandakan proses mulai menuliskan kode program pada dokumen HTML.
3. <head></head> Tag ini digunakan untuk menambahkan metadata ke dalam dokumen html yang berisi judul, deskripsi, library dan lain sebagainya.
4. <body></body> Dan yang terakhir, tag body digunakan sebagai tempat untuk menuliskan setiap elemen atau lebih tepatnya disebut juga dengan konten pada HTML itu sendiri.

Jenis Tag HTML dan Kode Warna

Untuk saat ini, terdapat dua jenis tag yang sering digunakan di antaranya,
1. Block Level
Untuk elemen yang menggunakan block level menggunakan ruang (space) tersedia dan membuat line atau baris baru untuk mendeklarasikan elemen berikutnya. Contoh dari penggunaan block level adalah struktur heading dan paragraf.

2. Inline Tags
Inline tags berarti menggunakan ruang yang lebih sedikit dan sempit. Sehingga kebutuhannya lebih ke arah memformat isi konten pada block level. Selain itu, di dalam struktur HTML juga dapat mengolah dan memberikan beberapa macam warna untuk memperbaiki tampilan pada halaman situs agar lebih menarik.

Dari berbagai sumber

Baca Juga: Sitemap XML: Pengertian, Macam, dan Manfaatnya

Download