HTML Element

Memahami HTML Element, Nested Element, dan Empty Element

Dalam HTML, semua konten diatur menggunakan elemen (element). Memahami jenis-jenis elemen HTML sangat penting agar halaman web kita bisa ditampilkan dengan benar dan sesuai standar.

Materi ini membahas:

1. Apa itu HTML Element
2. Nested Element (Elemen Bersarang)
3. Empty Element (Elemen Kosong)
4. Tips Penulisan HTML yang Baik

---

1. HTML Element (Elemen HTML)

HTML Element adalah bagian dasar dari HTML yang digunakan untuk menyusun struktur dan konten halaman. Elemen biasanya terdiri dari:

• Tag pembuka
• Konten
• Tag penutup

Contoh HTML Element:

<p>Ini adalah paragraf.</p>

Penjelasan:

• <p> adalah tag pembuka
• Ini adalah paragraf. adalah konten
• </p> adalah tag penutup

Struktur umum:

<tagname>konten di sini</tagname>

---

2. Nested Element (Elemen Bersarang)

Nested Element adalah elemen HTML yang ditempatkan di dalam elemen lain. HTML memungkinkan elemen bersarang untuk membentuk struktur yang lebih kompleks.

Contoh Nested Element:

<p>Ini <strong>teks penting</strong> dalam paragraf.</p>

Penjelasan:

• Elemen <strong> berada di dalam elemen <p>
• Teks “teks penting” akan tampil tebal karena berada di dalam tag <strong>

Contoh lainnya:

<div>
  <h2>Judul Artikel</h2>
  <p>Ini isi artikelnya.</p>
</div>

---

3. Empty Element (Elemen Kosong)

Empty Element adalah elemen HTML yang tidak memiliki konten dan tidak memerlukan tag penutup.

Contoh Empty Element:

<br>   <!-- Untuk ganti baris -->
<hr>   <!-- Untuk garis horizontal -->
<img src="foto.jpg" alt="Foto Profil"> <!-- Untuk gambar -->

---

4. Tips Menulis HTML dengan Benar

Berikut beberapa tips penting yang sering diabaikan oleh pemula:

1. Jangan Skip End Tag

Beberapa tag memang opsional penutupnya (misalnya <li>, <p>), tetapi disarankan untuk selalu menutup tag untuk menjaga struktur HTML tetap rapi.

<!-- Kurang baik -->
<p>Halo
<p>Selamat datang

<!-- Lebih baik -->
<p>Halo</p>
<p>Selamat datang</p>

2. Tag HTML Tidak Case-Sensitive

Tag HTML tidak peka huruf besar/kecil, tetapi standar yang dianjurkan adalah menulis dengan huruf kecil semua.

<!-- Benar -->
<h1>Judul</h1>

<!-- Masih bisa dijalankan, tapi tidak disarankan -->
<H1>Judul</H1>

3. Jangan Menyisipkan Tag Sembarangan

Tag harus ditulis dalam urutan dan struktur yang benar, tidak boleh asal tumpuk.

<!-- Salah (tag tidak ditutup dengan benar) -->
<p><strong>Teks penting</p></strong>

<!-- Benar -->
<p><strong>Teks penting</strong></p>

4. Gunakan Indentasi dan Spasi

Menuliskan HTML dengan rapi dan terstruktur memudahkan dalam membaca dan memeliharanya.

---

Kesimpulan

Jenis	Penjelasan	Contoh
Element	Elemen HTML dengan konten	<p>Halo</p>
Nested Element	Elemen di dalam elemen lain	<p><strong>Halo</strong></p>
Empty Element	Elemen tanpa konten	<br>, <hr>, <img>

Dengan memahami dan menerapkan penulisan HTML yang benar, kamu akan lebih mudah membangun halaman web yang terstruktur dengan baik, mudah dibaca, dan kompatibel di semua browser.