Kalau kamu pernah penasaran gimana sih caranya bikin website? Atau pengin tau kenapa halaman web bisa kelihatan keren dan bisa di-klik sana-sini? Jawabannya ada di tiga kata ajaib: HTML, CSS, dan JavaScript.
Mereka bertiga ini ibarat trio sahabat yang saling melengkapi dalam dunia web. Yuk kenalan satu-satu!
🧱 1. HTML: Pondasi Bangunan Website
Bayangin kamu lagi bikin rumah. Nah, HTML (HyperText Markup Language) itu kayak rangka atau kerangka bangunan rumahnya. HTML nentuin “apa aja” yang ada di dalam website: judul, paragraf, gambar, tombol, dan lain-lain.
Tanpa HTML, nggak ada struktur. Cuma layar putih kosong doang. 😅
Contoh sederhana:
<h1>Halo, dunia!</h1>
<p>Ini adalah paragraf pertama saya.</p>
👉 Jadi, HTML itu nyusun isi webnya, tapi tampilannya masih polos banget.
🎨 2. CSS: Makeover Stylist Web Kamu
Kalau HTML itu struktur, maka CSS (Cascading Style Sheets) adalah stylist-nya. CSS yang bikin web kamu jadi enak dipandang: warna, font, posisi elemen, dan bahkan animasi bisa diatur di sini.
Tanpa CSS? Website kamu bakal kelihatan kayak dokumen Word yang belum diformat. 😬
Contoh CSS:
body {
background-color: #fafafa;
font-family: 'Segoe UI', sans-serif;
}
h1 {
color: teal;
text-align: center;
}
👉 CSS bikin web kamu tampil stylish dan nyaman dilihat, cocok buat yang suka desain!
⚙️ 3. JavaScript: Si Otak Pintar yang Bikin Web Interaktif
Terakhir, ada JavaScript—si jagoan yang bikin website jadi hidup dan interaktif. Mau bikin tombol yang bisa diklik? Atau muncul pop-up? Atau geser-geser galeri foto? Semua itu kerjaannya JavaScript.
Tanpa JavaScript, web kamu cuma bisa dilihat doang, nggak bisa diajak “ngobrol”.
Contoh JavaScript:
function sapaPengunjung() {
alert("Hai! Terima kasih sudah mampir 😊");
}
document.querySelector("h1").addEventListener("click", sapaPengunjung);
👉 Dengan JavaScript, web kamu bisa berinteraksi dengan pengunjung. Seru kan?
💡 Gimana Cara Mereka Kerja Bareng?
Sederhananya gini:
- HTML nyusun isi web (tulisan, gambar, tombol).
- CSS mempercantik tampilannya (warna, layout, animasi).
- JavaScript bikin web jadi hidup (klik, input, dll).
Tiga-tiganya nggak bisa berdiri sendiri. Mereka saling melengkapi. Kayak tim sepak bola: ada yang jago bertahan, ada yang nyetak gol, semua penting!
Belajar HTML, CSS, dan JavaScript itu kayak belajar naik sepeda. Awalnya bingung, tapi begitu paham dasarnya, kamu bisa bebas bikin apa aja: blog pribadi, portofolio, toko online, sampai game sederhana.