Pernahkah kamu membuka sebuah website lalu berpikir, "Wah, keren banget! Ini dibuat pakai apa ya?" Jawabannya hampir pasti HTML. Yuk, kita kenalan lebih dekat dengan HTML!
Apa Itu HTML?
HTML adalah singkatan dari HyperText Markup Language. Sedikit ribet ya namanya? Tapi tenang, konsepnya sangat sederhana.
HTML adalah bahasa markup (bukan bahasa pemrograman) yang digunakan untuk membuat struktur halaman website. Mirip seperti kerangka rumah sebelum diberi cat, furnitur, atau listrik.
Kalau kamu menulis dokumen di Microsoft Word, ada yang namanya judul, paragraf, gambar, dan tabel. Nah, HTML fungsinya sama: memberi tahu browser "ini adalah judul utama" atau "ini adalah gambar".
Bagaimana Cara Kerja HTML?
Cara kerja HTML sangat sederhana:
- Kamu menulis kode HTML di text editor (misal: Notepad, VS Code).
- Simpan file dengan ekstensi
.html. - Buka file tersebut menggunakan browser (Chrome, Firefox, Edge).
- Browser akan membaca dan menampilkan halaman sesuai perintah HTML.
Langkah-langkah:
1. Buka Notepad (Windows) atau TextEdit (Mac).
2. Ketik kode berikut:
<!DOCTYPE html>
<html>
<head>
<title>Halaman Pertamaku</title>
</head>
<body>
<h1>Halo Dunia!</h1>
<p>Ini adalah website pertamaku yang dibuat dengan HTML.</p>
</body>
</html>
3. Simpan file dengan nama index.html (pastikan pilih "All Files" atau "Semua Berkas").
4. Double klik file tersebut. Maka browser akan menampilkan:
Halo Dunia!
Ini adalah website pertamaku yang dibuat dengan HTML.
Selamat! 🎉 Kamu baru saja membuat website pertamamu.
Tools yang Dibutuhkan untuk Belajar HTML
Untungnya, belajar HTML tidak butuh perangkat mahal. Hanya perlu:
| Tools | Contoh | Untuk Pemula? |
|---|---|---|
| Text Editor | Notepad, VS Code, Sublime Text, Notepad++ | ✅ Sangat Cocok |
| Browser | Chrome, Firefox, Edge, Opera | ✅ Wajib Punya |
| Live Server (Opsional) | Ekstensi VS Code atau aplikasi seperti XAMPP | Nanti Kalau Sudah Mahir |
Rekomendasi untuk pemula: Cukup gunakan Notepad + Chrome. Tidak perlu instalasi ribet.
Intisari Hari Ini
- HTML adalah kerangka website.
- Browser membaca file
.htmluntuk menampilkan halaman. - Kamu bisa mulai dengan Notepad + Chrome.
- Setiap halaman HTML dimulai dengan
<!DOCTYPE html>.
index.html yang sudah kamu buat, lalu ganti tulisan "Halo Dunia" dengan namamu sendiri. Simpan dan refresh browser. Berhasil? Selamat, kamu sudah bisa mengedit HTML!
Artikel Sebelumnya: - Daftar Isi
Artikel Selanjutnya: HTML Dasar #2 - Struktur Dasar HTML: Doctype, html, head, body