Comment (komentar) adalah catatan di dalam kode HTML yang tidak ditampilkan browser — hanya terlihat developer yang membaca source code. Formatnya: <!-- isi komentar -->.
🧪 Tebakan cepat — beneran rahasia? Kamu nulis
<!-- draft: harga belum final -->di HTML. Apakah pengunjung bisa menemukannya? Jawabannya: bisa! Gak tampil di halaman, tapi kebaca siapa pun yang buka view-source. Jangan pernah taruh rahasia di komentar.
Coba kamu lagi jalanin kode yang ditulis 6 bulan lalu sama kamu sendiri. Pas baca lagi, mikir: "ini logika kemarin maksudnya apa ya?" Kode itu kayak puisi — dimengerti sama yang nulis pas itu juga, tapi besok-lusa udah jadi misteri. Komentar itu pesan masa depan kamu ke kamu (atau ke temen tim). Browser cuek aja sama komentar — gak di-render, gak ditampilkan ke user. Tapi developer bisa baca, dan itu yang nyelametin kepala kamu nanti.
💡 Aturan emas komentar. Tulis "kenapa", bukan "apa". Kode udah nunjukkin "apa" yang dia lakuin. Komentar yang berguna jelasin "kenapa cara ini dipilih" — keputusan bisnis, workaround bug spesifik, alasan urutan tertentu.
Sintaks Komentar HTML
Bungkus teks dengan <!-- ... -->:
<!-- Ini Komentar -->
Komentar Multi-baris
Bisa multi-baris juga buat ngejelasin context yang lebih panjang:
<!--
Heading utama halaman.
Sengaja pake h1 karena cuma SATU per halaman (penting buat SEO).
-->
<h1>Hi, Aku Judul Utama</h1>
🎭 Analogi sehari-hari
Komentar = tulisan tangan di pinggir buku untuk penjelasan diri sendiri/tim. Browser (pembaca) tidak melihat coretan ini, tapi developer (kamu) bisa.
⚠️ Jebakan yang sering ditemui
- Komentar TERLIHAT di view-source — JANGAN tulis password, API key, TODO sensitif. Production tools (build minifier) hapus komentar — pakai itu.
- Nested comment tidak didukung —
<!-- a <!-- b --> c -->rusak di "c -->". -->di tengah comment terminate prematur. Hati-hati URL berisi--.- Conditional comment IE (
<!--[if IE]>) sudah deprecated — IE mati, jangan pakai. - Komentar di production code = bloat. Build tool harus strip otomatis.
🎯 Komentar atau hapus saja?
- Jelasin "kenapa cara ini dipilih" (workaround, business logic, edge case) → COMMENT (high value)
- Section divider ("===== HEADER =====") → komentar OK, atau pake semantic HTML lebih bagus
- Jelasin "apa yang kode lakukan" (
// loop array) → HAPUS (kode udah ngomong sendiri)- TODO/FIXME jangka pendek → tracker (Jira/GitHub Issues), bukan komentar
- Kode yang dimatiin "buat jaga-jaga" → HAPUS (git history simpan, jangan bloat file)
Aturan emas: komentar yang baik = surat kamu ke developer 6 bulan kemudian (atau diri sendiri). Komentar yang buruk = noise yang bikin code lebih panjang tanpa nambah informasi.
TL;DR: Komentar HTML = <!-- ... -->, gak di-render ke user. Pesan masa depan ke kamu/tim. Tulis "kenapa" (alasan keputusan), bukan "apa" (kode udah jelas). Awas: TERLIHAT di view-source — jangan tulis password/secret. Production minifier hapus komentar otomatis. Gak support nested comment.
