Cover Image

Apa Itu HTML? Cara Membuat Struktur Website Pertama untuk Pemula (Lengkap 2026)

Pendahuluan

Jika kamu ingin belajar coding, maka HTML adalah langkah pertama yang wajib dipahami. HTML adalah fondasi dari semua website di internet. Tanpa HTML, tidak ada struktur halaman, tidak ada teks, tidak ada gambar, dan tidak ada tombol.

AI vs Webmaster Manual: Mana Lebih Unggul di Era Digital 2026?

Artikel ini akan membahas HTML dari nol hingga kamu bisa membuat website pertamamu sendiri. Semua dijelaskan secara sederhana dan step-by-step agar mudah dipahami pemula.


Apa Itu HTML?

HTML adalah singkatan dari HyperText Markup Language. HTML bukan bahasa pemrograman seperti JavaScript atau Python. HTML adalah bahasa markup yang digunakan untuk menyusun struktur halaman website.

HTML memberi tahu browser bagaimana menampilkan konten seperti judul, paragraf, gambar, tabel, dan link.

Cara Membuat Sistem Login & Register + Belajar REST API Dasar untuk Pemula (PHP & MySQL)

Bagaimana Cara Kerja HTML?

Saat kamu membuka sebuah website, browser membaca file HTML dan menerjemahkannya menjadi tampilan visual.

Struktur HTML terdiri dari tag-tag yang dibungkus tanda kurung sudut < >.

Contoh sederhana:
<h1>Halo Dunia</h1>

Tag <h1> berarti heading atau judul utama.


Struktur Dasar HTML

Setiap halaman HTML memiliki struktur dasar seperti ini:

<!DOCTYPE html>
<html>
<head>
  <title>Website Pertama Saya</title>
</head>
<body>

  <h1>Halo Dunia!</h1>
  <p>Ini adalah website pertama saya.</p>

</body>
</html>

Penjelasan Struktur

  • <!DOCTYPE html> → Memberi tahu browser bahwa ini HTML5
  • <html> → Pembungkus seluruh dokumen
  • <head> → Berisi informasi meta dan judul
  • <body> → Berisi konten yang terlihat

Tag HTML yang Wajib Diketahui

1. Heading

<h1>Judul Besar</h1>
<h2>Sub Judul</h2>
<h3>Sub Judul Kecil</h3>

2. Paragraf

<p>Ini adalah paragraf.</p>

3. Link

<a href="https://example.com">Klik di sini</a>

4. Gambar

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

5. List

List Tidak Berurutan:
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>
List Berurutan:
<ol>
  <li>Langkah 1</li>
  <li>Langkah 2</li>
</ol>

Langkah Praktik: Membuat Website Biodata

Sekarang kita praktik membuat website biodata sederhana.

<!DOCTYPE html>
<html>
<head>
  <title>Biodata Saya</title>
</head>
<body>

  <h1>Nama Saya</h1>
  <p>Saya sedang belajar HTML.</p>

  <h2>Hobi</h2>
  <ul>
    <li>Coding</li>
    <li>Membaca</li>
    <li>Gaming</li>
  </ul>

</body>
</html>

Simpan file dengan nama index.html, lalu buka di browser.


Memahami Attribute dalam HTML

Attribute adalah informasi tambahan dalam tag.

Contoh:
<a href="https://google.com" target="_blank">Buka Google</a>
  • href → Tujuan link
  • target="_blank" → Membuka tab baru

Struktur HTML Modern (SEO Friendly)

Dalam praktik profesional, HTML juga harus ramah SEO.

Contoh meta tag penting:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Website belajar HTML">

Kesalahan Umum Pemula Saat Belajar HTML

  • Tidak menutup tag
  • Salah penempatan tag
  • Tidak memahami struktur dasar
  • Langsung lompat ke JavaScript tanpa memahami HTML

Latihan Agar Mahir HTML

  • Buat halaman biodata
  • Buat halaman artikel sederhana
  • Buat halaman produk sederhana
  • Coba tambahkan gambar dan link
  • Gabungkan beberapa halaman dengan link navigasi

Langkah Setelah Menguasai HTML

Setelah memahami HTML, langkah selanjutnya adalah belajar CSS untuk mempercantik tampilan dan JavaScript untuk membuat website interaktif.


Kesimpulan

HTML adalah fondasi utama dalam dunia web development. Dengan memahami struktur dasar dan tag-tag penting, kamu sudah mengambil langkah pertama menjadi seorang developer.

Jangan hanya membaca. Praktik langsung dan buat project kecil agar pemahaman semakin kuat.