Tag <meta> HTML
Contoh
Jelaskan metadata dalam dokumen HTML:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Tag <meta>mendefinisikan metadata tentang dokumen HTML. Metadata adalah data (informasi) tentang data.
<meta> tag selalu masuk ke dalam elemen <head>, dan biasanya digunakan untuk menentukan set karakter, deskripsi halaman, kata kunci, penulis dokumen, dan pengaturan viewport.
Metadata tidak akan ditampilkan pada halaman, tetapi dapat diurai oleh mesin.
Metadata digunakan oleh browser (cara menampilkan konten atau memuat ulang halaman), mesin pencari (kata kunci), dan layanan web lainnya.
Ada metode untuk membiarkan desainer web mengambil kendali atas viewport (area yang terlihat oleh pengguna dari halaman web), melalui <meta>tag (Lihat contoh "Mengatur Viewport" di bawah).
Dukungan Peramban
| Element | |||||
|---|---|---|---|---|---|
| <meta> | Yes | Yes | Yes | Yes | Yes |
Atribut
| Attribute | Value | Description |
|---|---|---|
| charset | character_set | Specifies the character encoding for the HTML document |
| content | text | Specifies the value associated with the http-equiv or name attribute |
| http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
| name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
Atribut Global
Tag <meta>juga mendukung Atribut Global dalam HTML .
Lebih Banyak Contoh
Tentukan kata kunci untuk mesin pencari:
<meta name="keywords" content="HTML, CSS, JavaScript">
Tentukan deskripsi halaman web Anda:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
Tentukan penulis halaman:
<meta name="author" content="John Doe">
Refresh dokumen setiap 30 detik:
<meta http-equiv="refresh" content="30">
Mengatur viewport agar situs web Anda terlihat bagus di semua perangkat:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Mengatur Viewport
Area pandang adalah area halaman web yang terlihat oleh pengguna. Ini bervariasi dengan perangkat - itu akan lebih kecil di ponsel daripada di layar komputer.
Anda harus menyertakan <meta>elemen berikut di semua halaman web Anda:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Ini memberikan petunjuk kepada browser tentang cara mengontrol dimensi dan penskalaan halaman.
Bagian width=device-widthmengatur lebar halaman untuk mengikuti lebar layar perangkat (yang akan bervariasi tergantung pada perangkat).
Bagian initial-scale=1.0ini mengatur tingkat zoom awal saat halaman pertama kali dimuat oleh browser.
Berikut adalah contoh halaman web tanpa tag meta viewport, dan halaman web yang sama dengan tag meta viewport:
Tip: Jika Anda menjelajahi halaman ini dengan ponsel atau tablet, Anda dapat mengklik dua tautan di bawah untuk melihat perbedaannya.
Anda dapat membaca lebih lanjut tentang area pandang di Desain Web Responsif kami - Tutorial Area Pandang .
Halaman Terkait
Tutorial HTML: Kepala HTML
Referensi DOM HTML: Objek Meta
Pengaturan CSS Default
Tidak ada.