Pada artikel sebebelumnya kita sudah membahas pengertian & fungsi tag title pada HTML, selanjutnya kita akan membahas pengertian & fungsi tag meta pada HTML.
Tag <meta> berfungsi untuk memberikan metadata, atau data tentang dokumen yang Anda buat dalam script HTML.
Meta data ini tidak dapat dilihat oleh pengunjung dibrowser, tujuannya untuk memberitahu mesin pencari, browser, dan sistem operasi HTML5 tentang deskriptif, SEO, robot, penulis, dan hak cipta dalam dokumen HTML5 Anda.
Tag <meta> diletakkan diantara tag <head></head>, sama dengan tag <title>.
Tag <meta> sendiri memiliki banyak nilai dengan fungsi dan tujuan yang berbeda.
Contoh format tag <meta> untuk website mbah wp dengan artikel teknik copywriting bisa Anda lihat pada kode berikut :
<!DOCTYPE html>
<html lang="id">
<head>
<title>10 Teknik Copywriting : Bagaimana Mengubah Iklan Membosankan Jadi Iklan Yang Menjual | Mbah WP </title>
<meta name=" description " content="Ini dia 10 teknik copy writing yang menghasilkan penjualan lewat iklan Anda!">
<meta name=" keywords " content=" teknik copywriting, belajar copywriting, tutorial coywriting ">
<meta name=" robots " content="index, follow">
<meta name=" copyright " content="Copyright 2016 sampai 2021">
<meta name=" author " content="Herbert S">
<meta charset ="UTF-8">
</head>
<body>
<!—Konten teknik copywriting tulis di sini -->
</body>
</html>
- Metatag description pada meta tag berisi deskripsi yang digunakan dalam daftar hasil mesin pencari.
- Metatag keywords metatag menjabarkan daftar kata kunci kepada robot mesin pencari.
- Metatag robot mengizinkan robot mesin pencari untuk mengindeks dan followsitus.
- Metatag copyright dan author berfungsi untuk memberitahu robot mesin pencari hak cipta dan nama embuat dokumen HTML5 Anda.
Ada juga parameter tag <meta> yang disebut charset yang digunakan untuk mendefinisikan kumpulan karakter untuk dokumen Anda, sebagain besar dokumen HTML5 biasanya menggunakan UTF-8 atau UTF-16 sebagai charset.
UTF-8 adalah Format Teks Universal 8-bit menggunakan representasi 256 karakter dan UTF-16 adalah Format Teks Universal 16-bit menggunakan representasi karakter 65.536.
UTF-16 mewakili rentang bahasa yang lebih luas daripada UTF-8, meskipun UTF-8 mewakili Bahasa yang menggunakan kumpulan karakter alfabet, seperti Inggris, Prancis, Spanyol, Italia, Portugis, dan Jerman.
Pada tabel di bawah ini, tercantum 17 pasangan nama nilai : data konten yang digunakan dalam format tag <meta> untuk Dokumen dan aplikasi HTML5.
| Nama Nilai | Nilai Konten | Tujuan atau Kegunaan |
| description | Deskripsi untuk dokumen HTML | Daftar untuk mesin pencari Anda |
| keyword | Daftar kata kunci Anda | Saran kata kunci SEO |
| robots | index dan follow | Instruksi kepada robot SEO |
| copyright | Tanggal hak cipta | Tanggal hak cipta dokumen |
| author | Nama penulis | Nama penulis dokumen |
| webauthor | Nama penulis | Nama penulis dokumen |
| charset | Kumpulan karakter yang digunakan | Biasanya UTF-8 atau UTF-16 |
| abstract | Ringkasan dokumen | Abstrak isi ringkasan |
| revisit-after | Periode kunjungan ulang (yaitu, 9 hari) | Intruksi kunjungan kepada robot |
| language | Nama bahasa | Bahasa yang digunakan untuk dokumen |
| distribution | Global, lokal, IU | Global, lokal atau distribusi internal untuk dokumen |
| expires | Date (1 Jan 2017) | Isi dokumen kedaluwarsa |
| generator | Nama software | Pembuat konten dokumen |
| reply-to | Alamat email | Informasi kontak dokumen |
| no-email-collection | Tautan anti-spam | metatags.info/nospamharvest |
| rating | Audiens yang dituju | umum, dewasa, terbatas |
| googlebot | noodp | Gunakan sebagai deskripsi halaman di ODP |
Untuk menentukan nilai informasi header HTTP dari parameter konten, Anda dapat menggunakan parameter http-equiv.
Metatag ini digunakan untuk menambahkan nilai ke header web HTML5, berikut beberapa nilai standar http-equiv yang digunakan di situs web.
Pada tabel di bawah ini dicantumkan 13 pasangan dari http-equiv : nilai data konten yang digunakan di dalam <meta>.
| http-equiv | Nilai Konten | Tujuan atau Penggunaan |
| content-type | Tipe Media, CharSet | Tentukan tipe MIME dan charset |
| cache-control | Tentukan pengaturan cache | Tentukan pengaturan cache Mendefinisikan parameter cache |
| cookie | Mendefinisikan file cookie | Mendefinisikan file cookie Tentukan nama dan tanggal cookie |
| content-disposition | Definisikan aplikasi | Definisikan aplikasi Mendefinisikan ekstensi nama file |
| imagetoolbar | Menampilkan image toolbar | Menampilkan image toolbar Control display (IE) toolbar |
| MSThemeCompatible | Use WinXP UI theme | Use WinXP UI theme Set tema WinXP UI untuk situs |
| picslabel | Label konten gambar | Label konten gambar Memungkinkan gambar diberi label |
| pragma | Setel cache HTTPS | Setel cache HTTPS Pastikan halaman HTTPS tidak disimpan dalam cache |
| Resource-Type | endefinisikan resource | Mendefinisikan resource Mendefinisikan jenis resource halaman |
| Refresh | Waktu sebelum refresh | Pengalihan setelah jangka waktu tertentu |
| Content-Script-Type | Scripting language | Tentukan bahasa skrip |
| Content-Style-Type | Style Sheet language | Menentukan bahasa style sheet |
| window-target | Tentukan nama jendela sebagai target jendela untuk HTML5 rendering dokumen/ parsing | Mengatur nama jendela untuk halaman web yang akan dirender; umumnya digunakan untuk keluar dari a frameset |
Itu dia pembahasan tentang penggunaan meta tag dalam HTML5 yang bertujuan sebagai sumber informasi bagi bot mesin pencari.
Semoga artikel ini bisa menambah pengetahuan Anda tentang pengertian & fungsi tag meta dalam HTML5.
Untuk materi selanjutnya kita akan membahas menggunakan external link dan favicon dalam HTML 5.
