Recents in Beach

Mengenal Apa Itu HTML : Pengertian, Cara Kerja hingga Sejarah

Pernahkah kamu mendengar istilah HTML? Jika kamu pernah menjelajahi internet, maka hampir pasti kamu sudah berinteraksi dengan HTML, meskipun tidak sadar. HTML adalah singkatan dari HyperText Markup Language, yaitu bahasa markup yang digunakan untuk membuat struktur halaman web.

Pengertian HTML

HTML (HyperText Markup Language) adalah bahasa markup yang digunakan untuk membuat struktur dan menampilkan konten di halaman web. HTML menggunakan elemen-elemen (tags) yang didefinisikan dalam kurung sudut (<>) untuk menyusun berbagai bagian halaman, seperti teks, gambar, tabel, link, dan lainnya.

HTML bukanlah bahasa pemrograman, melainkan bahasa markup. Fungsinya adalah untuk menentukan struktur dokumen agar bisa ditampilkan oleh browser. Sebagai contoh:

  • <h1> untuk judul utama
  • <p> untuk paragraf
  • <a> untuk hyperlink
  • <img> untuk menampilkan gambar

HTML menjadi fondasi utama dari setiap situs web dan bekerja bersama dengan CSS (Cascading Style Sheets) untuk styling, serta JavaScript untuk interaktivitas.

Cara Kerja HTML

HTML bekerja dengan cara menyusun elemen-elemen dalam dokumen yang disebut sebagai tag. Setiap elemen HTML ditulis dalam format tertentu dan ditandai oleh tag pembuka dan tag penutup. Berikut adalah penjelasan cara kerjanya:

1. Struktur Dasar HTML

Setiap dokumen HTML memiliki struktur dasar seperti berikut:

<!DOCTYPE html>
<html>
<head>
    <title>Judul Halaman</title>
</head>
<body>
    <h1>Halo Dunia</h1>
    <p>Ini adalah paragraf pertama.</p>
</body>
</html>
Penjelasan : 
  • <!DOCTYPE html>: Menunjukkan bahwa dokumen ini menggunakan HTML5.

  • <html>: Elemen utama yang membungkus seluruh dokumen HTML.

  • <head>: Berisi informasi metadata seperti judul dan link ke file CSS.

  • <body>: Bagian utama yang menampilkan konten halaman.

2. Elemen Penting HTML

Berikut adalah beberapa elemen penting dalam HTML dan fungsinya:

a. Heading

Heading digunakan untuk memberikan judul pada konten. Ada enam level heading, mulai dari <h1> (paling besar) hingga <h6> (paling kecil):

<h1>Judul Utama</h1>
<h2>Subjudul</h2>

b. Paragraf

Elemen paragraf digunakan untuk menampilkan teks biasa:

<p>Ini adalah teks dalam sebuah paragraf.</p>

c. Tautan (Hyperlink)

Tautan memungkinkan kita untuk menghubungkan halaman lain:

<a href="https://www.contoh.com">Kunjungi Situs</a>

d. Gambar

Untuk menampilkan gambar, gunakan elemen <img>:

<img src="gambar.jpg" alt="Deskripsi Gambar">

e. Daftar

HTML mendukung dua jenis daftar: berurutan (<ol>) dan tidak berurutan (<ul>):

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

<ol>
    <li>Item Pertama</li>
    <li>Item Kedua</li>
</ol>

f. Formulir

Untuk mengumpulkan data dari pengguna, gunakan elemen <form>:

<form action="submit.php" method="post">
    <label for="nama">Nama:</label>
    <input type="text" id="nama" name="nama">
    <button type="submit">Kirim</button>
</form>

3. Interaksi dengan CSS dan JavaScript

HTML hanya berfungsi untuk struktur, tetapi dengan CSS dan JavaScript, kamu bisa:

  • CSS: Menentukan warna, tata letak, dan font.

  • JavaScript: Menambahkan interaktivitas seperti validasi formulir atau animasi.

Keunggulan dan Kekurangan HTML

Keunggulan

  • Sederhana: Mudah dipahami dan dipelajari.

  • Fleksibel: Dapat digunakan bersama CSS dan JavaScript.

  • Ringan: Tidak memerlukan perangkat lunak tambahan.

Kekurangan

  • Terbatas: Tidak bisa membuat desain atau fitur interaktif tanpa CSS dan JavaScript.

  • Statik: Halaman yang dibuat hanya bersifat statik jika tanpa dukungan backend.

Sejarah HTML

HTML memiliki perjalanan panjang sejak diciptakan. Berikut adalah sejarah singkatnya:

1. Awal HTML (1990-1991)

  • Penemu: Sir Tim Berners-Lee, seorang ilmuwan komputer Inggris, menciptakan HTML pada tahun 1990 di CERN, Swiss.
  • Tujuan Awal: HTML dirancang untuk berbagi dokumen dan informasi antar ilmuwan menggunakan protokol HTTP (HyperText Transfer Protocol).
  • Versi Pertama: Pada tahun 1991, Tim Berners-Lee merilis dokumen pertama tentang HTML berjudul "HTML Tags," yang mendeskripsikan 18 elemen awal, termasuk tag seperti <p>, <a>, dan <h1>.

2. Perkembangan HTML

  • HTML 2.0 (1995): Versi pertama yang diakui sebagai standar resmi oleh IETF (Internet Engineering Task Force). HTML 2.0 menyempurnakan struktur dokumen dengan fitur dasar seperti form dan tabel.
  • HTML 3.2 (1997): Standar pertama yang dikeluarkan oleh W3C (World Wide Web Consortium). Mendukung fitur seperti scripting (JavaScript) dan elemen presentasi (CSS).
  • HTML 4.01 (1999): Versi yang lebih kompleks, mendukung pengkodean karakter internasional, frame, dan lebih banyak atribut.

3. Masa XHTML (2000-2008)

  • XHTML adalah versi HTML yang lebih ketat dengan sintaks berbasis XML. Namun, XHTML tidak begitu populer karena terlalu kaku.

4. HTML5 (2014 - Sekarang)

  • Dikembangkan oleh: WHATWG (Web Hypertext Application Technology Working Group) dan W3C.
  • Fitur Baru: HTML5 mendukung elemen multimedia seperti <audio> dan <video>, API untuk aplikasi web, serta kompatibilitas dengan perangkat modern. HTML5 menekankan desain responsif untuk perangkat seperti smartphone dan tablet.

Fungsi dan Kegunaan HTML

HTML memiliki banyak fungsi, di antaranya:

  • Membuat struktur dasar halaman web.
  • Menyematkan teks, gambar, video, dan media lainnya ke halaman web.
  • Membantu browser memahami dan menampilkan konten web dengan benar.

Kelebihan dan Kekurangan HTML

Kelebihan

  • Mudah dipelajari dan digunakan.
  • Didukung oleh semua browser modern.
  • Gratis dan open-source.

Kekurangan

  • Memerlukan CSS dan JavaScript untuk fitur lebih kompleks.
  • Kurang efisien untuk proyek besar tanpa framework tambahan.

Kesimpulan

HTML adalah dasar dari semua halaman web. Memahami HTML tidak hanya membantumu membuat situs sederhana, tetapi juga membuka pintu untuk belajar teknologi web lainnya seperti CSS, JavaScript, dan backend. Dengan latihan, kamu bisa menguasai HTML dan mulai membangun halaman webmu sendiri!

Posting Komentar

0 Komentar