Pemula
Web Programming
Mengenal Struktur Dasar Dokumen HTML5 untuk Pemula
Membangun halaman web pertama Anda dengan memahami fungsi doctype, head, body, dan elemen semantik penting yang ramah mesin pencari.
Fondasi Sebuah Halaman Web
HTML (HyperText Markup Language) bukanlah bahasa pemrograman logika, melainkan bahasa markah yang memberi tahu peramban (browser) bagaimana sebuah dokumen distrukturkan: mana yang merupakan judul utama, mana paragraf, dan mana gambar pendukung.
Kerangka Minimal HTML5
Setiap dokumen HTML5 modern selalu dimulai dari kerangka standar berikut:
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Catatan Belajarku</title>
</head>
<body>
<h1>Halo, Hayubelajar!</h1>
<p>Ini adalah paragraf pertama yang saya buat sendiri.</p>
</body>
</html>Membedah Bagian-bagian Penting
<!DOCTYPE html>: Pernyataan kepada browser bahwa dokumen ini menggunakan standar HTML5 terbaru.<head>: Wadah informasi meta yang tidak langsung tampak di layar pembaca, seperti judul tab peramban, set karakter UTF-8, dan link file stylesheet.<body>: Area utama tempat seluruh teks, gambar, video, dan tombol yang dilihat pengunjung berada.
Pentingnya Semantik: Hindari membungkus semua hal ke dalam tag
<div> tanpa makna. Manfaatkan tag semantik seperti <header>, <main>, <article>, <section>, dan <footer> agar halaman web mudah dibaca oleh teknologi pembaca layar (screen reader) serta mesin pencari.