Belajar HTML - Mengenal Elemen-Elemen Penting dalam Halaman Web

Home » HTML

Halo teman-teman, Setelah sebelumnya kita belajar cara memilih editor dan membuat halaman HTML pertama, sekarang kita akan masuk ke bagian yang nggak kalah penting, yaitu mengenal elemen-elemen dalam HTML.

Elemen-elemen inilah yang jadi bahan dasar pembentuk halaman web. Jadi kalau kalian udah bisa memahami elemen, kalian udah selangkah lebih dekat untuk bikin website sendiri.

Apa Itu HTML Element?

Elemen HTML biasanya terdiri dari tiga bagian:

Tag pembuka (start tag)
Isi konten (content)
Tag penutup (end tag)

Contoh paling simpel adalah elemen paragraf:

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

Di sini:

<p> adalah tag pembuka
Ini adalah sebuah paragraf. adalah kontennya
</p> adalah tag penutup

Gabungan dari ketiganya disebut satu elemen.

Elemen Bisa Bersarang (Nested)

HTML itu ibarat kotak dalam kotak. Kita bisa menaruh satu elemen di dalam elemen lainnya. Ini disebut nested element alias elemen bersarang.

Misalnya:

<html>
  <body>
    <h1>Judul Pertama</h1>
    <p>Ini paragraf pertama saya.</p>
  </body>
</html>

<html> adalah elemen utama
Di dalamnya ada <body>
Di dalam <body> ada <h1> dan <p>

Struktur ini penting banget karena elemen yang saling bertumpuk menunjukkan urutan dan hierarki konten dalam halaman.

Mengenal Elemen-Elemen Dasar

Beberapa elemen dasar yang wajib banget kamu tahu saat belajar HTML:

<html> → Menandai seluruh dokumen HTML
<head> → Bagian yang berisi informasi metadata
<body> → Isi utama halaman, semua yang terlihat ada di sini
<h1> sampai <h6> → Elemen untuk judul, dari paling besar sampai kecil
<p> → Paragraf
<br> → Baris baru (line break), termasuk elemen kosong

Elemen Kosong (Empty Elements)

Nggak semua elemen HTML punya konten atau tag penutup. Beberapa elemen disebut empty element, karena hanya punya tag pembuka.

Contoh yang paling umum:

<br>

Fungsinya cuma untuk pindah baris. Karena nggak ada konten yang ditampilkan, maka cukup pakai satu tag aja.

Tips Penting

Tag HTML tidak case-sensitive, artinya <P> dan <p> dianggap sama. Tapi disarankan banget untuk selalu pakai huruf kecil (lowercase) biar lebih rapi dan sesuai standar modern.

Selain itu, meskipun beberapa browser bisa memproses elemen tanpa tag penutup, kamu tetap harus menuliskannya lengkap. Soalnya kalau nggak lengkap, bisa muncul error yang susah dilacak nanti.

Dan itu dia pembahasan kita kali ini soal elemen HTML. Sekarang kamu sudah tahu:

Cara kerja elemen HTML
Contoh penulisan tag pembuka dan penutup
Elemen-elemen dasar yang wajib dikenali
Pentingnya struktur bersarang dan konsistensi penulisan

Kalau ada pertanyaan atau kamu mau cerita pengalaman belajar HTML, silakan tulis di komentar.

Di materi selanjutnya, kita akan bahas tentang atribut HTML—fitur yang bikin elemen jadi lebih fleksibel dan bisa dikustomisasi. Sampai ketemu di tutorial berikutnya!