← HTML40 / 46
Dua meta tag yang tidak boleh lupa
<meta charset="UTF-8"> mencegah teks berubah jadi karakter aneh (é, �) — wajib, dan harus berada di awal <head>. <meta name="viewport" content="width=device-width, initial-scale=1"> membuat halaman menyesuaikan lebar layar HP; tanpa ini, semua CSS responsive-mu tidak berpengaruh di mobile dan halaman tampil mengecil seperti versi desktop.
👀 Contoh dulu
<!-- head yang MASIH KURANG: viewport belum ada --> <head> <meta charset="UTF-8"> <title>Toko Kopi</title> </head>
Hasilnya: Huruf beraksen tampil benar, tapi di HP halaman mengecil seperti versi desktop karena viewport belum dideklarasikan.
💡 Keduanya wajib ada di setiap halaman. Tanpa viewport, media query CSS-mu tidak akan terasa di HP.
📝 Sekarang giliranmu
Lengkapi <head> dengan meta charset UTF-8 dan meta viewport width=device-width, initial-scale=1.
Preview