Tutorial HTML Dasar untuk Pemula: Panduan Lengkap dari Nol
Belajar HTML dari dasar? Baca panduan lengkap ini! Mulai dari pengertian, struktur dasar, tag penting, hingga contoh kode HTML siap pakai. Cocok untuk pemula yang ingin menjadi web developer.
Pendahuluan
HTML (HyperText Markup Language) adalah fondasi utama dalam pembuatan website. Tanpa HTML, tidak ada struktur yang bisa ditampilkan di browser. Jika Anda ingin menjadi web developer, memahami HTML adalah langkah pertama yang wajib dikuasai.
Apa yang akan dipelajari?
- ✔ Pengertian HTML dan fungsinya
- ✔ Struktur dasar dokumen HTML
- ✔ Tag-tag HTML penting yang sering digunakan
- ✔ Contoh kode HTML sederhana
- ✔ Tips belajar HTML dengan cepat
Mari mulai belajar!
1. Apa Itu HTML?
HTML adalah bahasa markup yang digunakan untuk membuat struktur dan konten halaman web. HTML bukan bahasa pemrograman, melainkan bahasa markup yang terdiri dari tag untuk mengatur teks, gambar, link, dan elemen lainnya.
Fungsi Utama HTML
- Membuat kerangka website
- Menampilkan teks, gambar, video, dan tabel
- Membuat link ke halaman lain
- Mengatur form input (login, registrasi, dll)
2. Struktur Dasar HTML
Setiap dokumen HTML memiliki struktur standar seperti berikut:
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>Judul Halaman</title>
</head>
<body>
<!-- Konten halaman akan ditulis di sini -->
</body>
</html>
Penjelasan:
<!DOCTYPE html>
- Deklarasi tipe dokumen<html>
- Elemen root dari dokumen HTML<head>
- Berisi metadata dan informasi untuk browser<body>
- Berisi konten yang akan ditampilkan di browser
3. Tag HTML Penting yang Harus Diketahui
Berikut beberapa tag dasar yang paling sering digunakan:
Tag Heading (Judul)
<h1>Judul Utama</h1>
<h2>Sub Judul</h2>
<h3>Sub Sub Judul</h3>
Tag Paragraf
<p>Ini adalah contoh paragraf.</p>
Tag Link
<a href="https://contoh.com">Teks Link</a>
Tag Gambar
<img src="gambar.jpg" alt="Deskripsi Gambar">
4. Contoh Kode HTML Sederhana
Berikut contoh halaman HTML lengkap:
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Halaman Pertamaku</title>
</head>
<body>
<h1>Selamat Datang di Website Saya</h1>
<p>Ini adalah halaman HTML pertama saya.</p>
<img src="welcome.jpg" alt="Gambar Selamat Datang">
<a href="tentang.html">Baca Tentang Saya</a>
</body>
</html>
5. Tips Belajar HTML dengan Cepat
- Praktek langsung - Buat file HTML dan coba berbagai tag
- Gunakan referensi online - MDN Web Docs adalah sumber terbaik
- Inspect elemen website - Pelajari kode website lain
- Gabung komunitas - Diskusi dengan sesama pemula
- Buat proyek kecil - Coba buat halaman profil sederhana
Kesimpulan
HTML adalah dasar dari semua website. Dengan mempelajari tag-tag dasar HTML, Anda sudah bisa membuat halaman web sederhana. Lanjutkan belajar dengan CSS untuk mempercantik tampilan, dan JavaScript untuk menambahkan interaktivitas.
Selamat mencoba! Jika ada pertanyaan, silakan tulis di komentar.