1. Apa itu HTML?
- HTML = HyperText Markup Language
- Digunakan untuk membuat kerangka halaman web.
- HTML bukan bahasa pemrograman, tapi bahasa markup (penanda).
<!DOCTYPE html>
<html>
<head>
<title>Halaman Pertamaku</title>
</head>
<body>
<h1>Halo, dunia!</h1>
<p>Ini adalah paragraf pertama saya.</p>
</body>
</html>
2. Struktur Dasar HTML
Setiap halaman HTML biasanya punya bagian utama:
<!DOCTYPE html>→ memberitahu browser bahwa ini dokumen HTML5.<html>...</html>→ pembungkus semua isi halaman.<head>...</head>→ berisi informasi (judul, meta, link css, dll).<body>...</body>→ isi utama yang terlihat di halaman web.
3. Tag Dasar HTML
Berikut beberapa tag yang sering dipakai:
Heading (Judul)
<h1>Judul Utama</h1>
<h2>Sub Judul</h2>
<h3>Judul Kecil</h3>
Paragraf
<p>Ini adalah sebuah paragraf.</p>
Link
<a href="https://www.google.com">Kunjungi Google</a>Gambar
<img src="gambar.jpg" alt="Deskripsi Gambar" width="200">
Daftar
<ul>
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ul>
<ol>
<li>Pertama</li>
<li>Kedua</li>
<li>Ketiga</li>
</ol>
Latihan Membuat Halaman Sederhana
Salin kode ini ke Visual Studio Code → simpan dengan nama index.html → lalu buka di browser.
<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<h1>Selamat Datang di Belajar HTML</h1>
<p>Saya baru belajar coding dari nol!</p>
<h2>Hobi Saya</h2>
<ul>
<li>Membaca</li>
<li>Menulis</li>
<li>Olahraga</li>
</ul>
<h2>Link Favorit</h2>
<a href="https://www.wikipedia.org">Buka Wikipedia</a>
<h2>Foto Favorit</h2>
<img src="https://via.placeholder.com/200" alt="Gambar Contoh">
</body>
</html>
5. Tips Belajar HTML
✅ Latihan dengan mengetik ulang, jangan hanya copy-paste.
✅ Mulai dari tag dasar, lalu bertahap ke CSS & JavaScript.
✅ Gunakan browser (Chrome/Firefox) untuk melihat hasil.
✅ Bisa coba juga editor online seperti CodePen atau JSFiddle.