Apa itu HTML & Cara Kerja Web
Mengenal HTML, apa yang terjadi saat kamu membuka sebuah website, dan menulis halaman web pertamamu langsung di browser.
Apa itu HTML?
HTML singkatan dari HyperText Markup Language. Kalau diterjemahkan bebas: bahasa untuk menandai isi halaman web supaya browser tahu mana judul, mana paragraf, mana gambar, mana tautan.
HTML bukan bahasa pemrograman. Ia tidak menghitung atau mengambil keputusan. Ia hanya menjelaskan struktur. Bayangkan sebuah dokumen Word: judul besar, paragraf, daftar bernomor, tabel. HTML adalah cara menuliskan semua itu dalam bentuk teks biasa.
| Teknologi | Tugasnya | Analogi rumah |
|---|---|---|
| HTML | Struktur dan isi halaman | Rangka dan dinding |
| CSS | Tampilan: warna, ukuran, tata letak | Cat, furnitur, dekorasi |
| JavaScript | Perilaku: interaksi, logika | Listrik dan saklar |
Di kursus ini kita fokus pada HTML. Setelah selesai, kamu siap lanjut ke kursus CSS dan JavaScript.
Apa yang terjadi saat kamu membuka website?
- Kamu mengetik alamat, misalnya
kelasit.com, di browser (Chrome, Firefox, Safari, Edge). - Browser meminta halaman itu ke server (komputer yang menyimpan website).
- Server mengirim balik berkas HTML (dan berkas pendukung seperti gambar, CSS, JavaScript).
- Browser membaca HTML dari atas ke bawah dan menggambar halamannya di layarmu.
Artinya, semua halaman web yang pernah kamu lihat, dari toko online sampai media sosial, pada dasarnya adalah teks HTML yang dibaca browser.
Tag, elemen, dan atribut
HTML ditulis dengan tag: kata dalam tanda kurung sudut. Kebanyakan tag berpasangan: ada tag pembuka dan tag penutup (dengan garis miring).
<p>Ini sebuah paragraf.</p>
| Bagian | Contoh | Keterangan |
|---|---|---|
| Tag pembuka | <p> | Menandai awal elemen |
| Isi | Ini sebuah paragraf. | Yang tampil di halaman |
| Tag penutup | </p> | Menandai akhir elemen |
| Elemen | seluruhnya | Tag pembuka + isi + tag penutup |
Atribut adalah keterangan tambahan di dalam tag pembuka, bentuknya nama="nilai":
<a href="https://kelasit.com">Kunjungi KelasIT</a>
Di sini href adalah atribut dan "https://kelasit.com" nilainya. Kita akan membahas atribut lebih dalam di bab-bab berikutnya.
Alat yang dibutuhkan
Cukup dua hal: editor teks (misalnya VS Code, Notepad++, atau bahkan Notepad) dan browser. Simpan berkas dengan akhiran .html, lalu klik dua kali untuk membukanya di browser. Di kursus ini kamu tidak perlu memasang apa pun: tulis HTML di kotak latihan, tekan Jalankan, dan hasilnya langsung tampil di panel pratinjau.
Tips belajar: jangan hanya membaca. Setelah membaca contoh, ubah isinya dan lihat apa yang berubah. Salah itu wajar, justru dari situ kamu paham.