5 Hal yang Bisa Kamu Lakukan Dengan HTML Meta Tag

meta-tag

Meta Tag digunakan untuk menyimpan sepotong informasi pada sebuah halaman web. Pada dasarnya, Meta Tag berisi informasi tentang data. Tujuannya adalah agar browser dan mesin pencari bisa memahami dan mengenali halaman dengan baik.

Sebagai seorang developer, tentunya kita sudah sangat terbiasa dengan menambahkan deskripsi halaman, author, atau kata kunci melalui Meta Tag. Tapi, ada beberapa fungsi Meta Tag lain yang mungkin belum banyak orang ketahui. Apa saja itu? Mari kita bahas satu per satu.

1. Mengontrol browser cache

Ketika kita mengunjungi sebuah halaman web, biasanya itu akan menyimpan halaman web dalam bentuk cache untuk membuatnya lebih cepat ketika diakses kembali. Mungkin kita pernah mengalami kasus di mana sebuah halaman tidak berubah padahal kita telah melakukan suatu perubahan. Hal ini terjadi karena browser berisi cache. Untuk mencegah hal ini, kita bisa menonaktifkan browser cache menggunakan Meta Tag. Untuk menonaktifkan browser cache, gunakan perintah berikut ini:

<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” />

Meta data di atas bukan berarti bahwa dokumen dianggap kadaluwarsa setelah tanggal yang ditentukan. Jika kita menetapkan ke nilai “0”, browser akan memeriksa dokumen terbaru pada setiap diakses.

2. Pengaturan cookies

Hampir sama dengan cache, cookies adalah bagian kecil dari data yang disimpan dalam browser oleh sebuah website yang diakses. Website bisa menggunakan cookies kembali untuk menyesuaikan beberapa fungsi website. Contoh dalam kehidupan sehari-hari misalnya adalah ketika kita berbelanja di sebuah toko online. Jika kita telah menambahkan beberapa item ke shopping cart, selama belum melakukan proses checkout, barang akan tetap di shopping cart meskipun kita telah meninggalkan browser selama beberapa hari.

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, nilai expired menunjukkan waktu dan tanggal ketika cookies dihapus dari komputer. Jika tanggal expired tidak diisi, maka cookies akan dihapus setelah kita keluar dari browser.

Sebagai contoh, jika kita ingin mengatur cookies expire pada tanggal 31 Januari 2015, kita bisa mengaturnya sebagai berikut:

<meta http-equiv=”Set-Cookie” content=”name=data; path=path; expires=Thursday, 01-Jan-2015 00:00:00 GMT”>

3. Refreshing halaman web

Kita bisa mengatur halaman untuk refresh otomatis pada jangka waktu tertentu. Meta http-equiv=”refresh” menentukan delay dalam detik untuk browser me-refresh halaman secara otomatis.

<meta http-equiv=”refresh” content=”5″>

Contoh diatas adalah browser akan reload halaman setiap 5 detik.

4. Redirecting

Kita juga bisa menggunakan Meta Tag refresh untuk mengarahkan halaman ke tujuan tertentu. Contohnya sebagai berikut:

<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 bisa menerapkan transisi ke halaman web dengan Meta Tag, cara kerjanya hampir mirip seprti PowerPoint. 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 IE lama sejak page-enter dan page-exit adalah spesifikasi proprietary Meta Tag Microsoft. Kita bisa menentukan berapa lama transisi akan berjalan menggunakan durasi. Transisi harus diisi oleh angka/integer 0-23 yang mengacu pada jenis transisi yang disediakan oleh Microsoft. Sedangkan, <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 lainnya yang juga harus juga kita pelajari.

Leave a Reply

Your email address will not be published. Required fields are marked *