Dapatkan notifikasi secara realtime dari kami dengan klik Disini Groub Telegram

5 Jenis HTML Meta Tag yang Wajib Web Developer Ketahui

contoh meta tag 5 Jenis HTML Meta Tag yang Wajib Web Developer Ketahui meta tag adalah
meta tag adalah
Meta Tag digunakan untuk memasukkan informasi tentang halaman web ke dalam halaman itu sendiri. Informasi tersebut berguna untuk membantu browser dan mesin pencari memahami dan mengidentifikasi halaman tersebut.

Apa itu Meta Tag?

Meta Tag adalah deskripsi yang ditampilkan pada hasil pencarian. Sederhananya, meta tag memberikan deskripsi tentang isi konten. Meta tag menjelaskan pada Google apa yang ada dalam konten Anda.

Meta tag tidak terlihat dalam konten Anda. Biasanya, meta tag berada di bagian "head" dalam source code halaman. Meta tag ditulis dalam HTML dan diletakkan di header situs web Anda. Namun, jika Anda tidak memahami HTML, Anda dapat menggunakan plugin SEO pada WordPress.

Meta tag memiliki peran penting dalam optimasi mesin pencari (SEO). Oleh karena itu, sangat penting untuk memperhatikan dan mengoptimalkan penggunaan meta tag agar website Anda dapat muncul pada halaman pertama hasil pencarian mesin pencari.

Sebagai developer, pasti sudah familiar dengan menambahkan deskripsi halaman, pengarang, atau kata kunci melalui Meta Tag. Namun, masih ada beberapa fungsi Meta Tag lain yang mungkin belum banyak dikenal. Mari kita bahas satu per satu.

5 Jenis HTML Meta Tag

1. Mengontrol browser cache

Ketika kita mengunjungi sebuah halaman web, biasanya halaman tersebut akan disimpan oleh browser dalam bentuk cache agar membuat halaman itu lebih cepat saat diakses kembali. Namun, terkadang kita mungkin mengalami kasus di mana sebuah halaman tidak berubah meskipun kita telah melakukan perubahan. Ini disebabkan oleh cache yang tersimpan dalam browser. Untuk mengatasi masalah ini, kita dapat menonaktifkan cache browser melalui Meta Tag.

Gunakan perintah berikut untuk menonaktifkan cache browser:
<meta http-equiv=”Cache-Control” content=”no-store” />
Meta ini dikenali di Firefox, Chrome, dan Internet Explorer, terlebih lagi di IE, kita bisa menambahkan nilai lebih untuk menonaktifkan caching, contoh:
<meta http-equiv=”Cache-Control” content=”no-cache” />
<meta http-equiv=”Pragma” content=”no-cache” />
Kita juga bisa mengatur tanggal kadaluwarsa untuk memastikan bahwa browser akan menampilkan file yang terbaru dari server, bukan dari cache.
<meta http-equiv=”expires” content=”Fri, 18 Jul 2014 1:00:00 GMT” />
Informasi meta data di atas tidak berarti bahwa dokumen akan dianggap kedaluwarsa pada tanggal yang ditentukan. Jika kita menetapkan nilainya sebagai "0", browser akan memeriksa versi terbaru dari dokumen setiap kali diakses.

2. Pengaturan cookies

Mirip dengan cache, cookies adalah bagian kecil dari data yang disimpan dalam browser oleh suatu situs web saat dikunjungi. Situs web dapat menggunakan cookies untuk menyesuaikan beberapa fitur situs. Contohnya dalam kehidupan sehari-hari adalah saat berbelanja di toko online. Jika kita telah menambahkan beberapa item ke keranjang belanja, mereka akan tetap ada di keranjang belanja meskipun kita sudah meninggalkan browser beberapa hari sebelum melakukan proses checkout.

Untuk mengatur cookies pada Meta Tag, gunakan perintah berikut ini:
<meta http-equiv=”Set-Cookie” content=”name=data; path=path; expires=Day, DD-MMM-YY HH:MM:SS ZONE”>
"Name=data" adalah nama dari cookies, "Path" adalah lokasi dokumen, sedangkan "Expired Value" menunjukkan tanggal dan waktu ketika cookies akan dihapus dari komputer. Jika tidak ada tanggal expired yang ditentukan, maka cookies akan dihapus setelah kita menutup browser.

Sebagai contoh, jika kita ingin mengatur cookies untuk kedaluwarsa pada 31 Januari 2015, kita dapat mengatur hal tersebut seperti ini:
<meta http-equiv=”Set-Cookie” content=”name=data; path=path; expires=Thursday, 01-Jan-2015 00:00:00 GMT”>

3. Refreshing halaman web

Kita dapat menentukan halaman untuk di-refresh secara otomatis pada interval waktu tertentu. Meta tag "http-equiv=”refresh”" menentukan delay dalam detik sebelum browser melakukan refresh halaman secara otomatis.
<meta http-equiv=”refresh” content=”5″>
Contoh diatas adalah browser akan reload halaman setiap 5 detik.

4. Redirecting

Kita juga dapat menggunakan Meta Tag "refresh" untuk mengarahkan halaman ke alamat tujuan tertentu. Berikut adalah contohnya:
<meta http-equiv=”refresh” content=”5; url=http://example.com/”>
Meta tersebut akan membawa kita ke example.com setelah 5 detik.

5. Transisi halaman

Kita juga dapat menerapkan transisi pada halaman web dengan bantuan Meta Tag, cara kerjanya mirip seperti di dalam PowerPoint. Berikut adalah contoh syntax untuk transisi halaman:
<meta http-equiv=”page-enter” content=”revealtrans(duration=seconds,transition=num)” />

<meta http-equiv=”page-exit” content=”revealtrans(duration=seconds,transition=num)” />

<meta http-equiv=”page-enter” content=”blendTrans(duration=sec)” />

Catatan

Ini hanya bekerja pada versi Internet Explorer lama karena page-enter dan page-exit adalah spesifikasi Meta Tag proprietary dari Microsoft. Kita dapat menentukan berapa lama durasi transisi dengan menggunakan durasi. Transisi harus diisi dengan angka integer 0-23 yang merujuk pada jenis transisi yang disediakan oleh Microsoft. Sementara <meta http-equiv="page-enter" content="blendTrans(duration=sec)" /> adalah nilai lain yang digunakan tanpa jenis transisi.

Itulah 5 jenis Meta Tag yang harus kamu ketahui, mungkin masih ada banyak sekali Meta Tag lain yang juga harus kita pelajari.

Terimakasih, semoga bermanfaat!

About the Author

Kamu tidak tahu apa yang ada di depan, jadi nikmati saat ini dan hargai setiap momen kehidupan yang kamu lalui.
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
Sepertinya ada masalah dengan koneksi internet Anda. Silakan hubungkan ke internet dan mulai menjelajah lagi.
Pemblokir Iklan Terdeteksi!

Harap matikan AdBlock atau DNS yang memblokir iklan agar dapat akses situs ini.

Butuh bantuan?

Site is Blocked
Sorry! This site is not available in your country.