Tutorial HTML Lanjutan: Pengertian Meta Tags dalam HTML

Salah satu tag yang cukup terkenal beberapa saat lalu, terutama untuk blogger adalah meta tag. Namun sekarang meta tag tidak sepenting beberapa tahun yang lalu. Namun apa sebenarnya meta tag ini? Kita akan membahasnya pada tutorial Belajar HTML Lanjutan: Pengertian Meta Tags ini.

Pengertian meta tag

Meta tag tidak dimaksudkan untuk menambah atau mempengaruhi isi dari konten halaman web kita, namun lebih kepada keterangan tambahan tentang halaman itu sendiri.

Meta tag biasanya di tempatkan pada bagian head dari HTML, dan biasanya terdiri dari beberapa meta tag dengan atribut yang berbeda-beda. Beberapa atribut yang biasanya di tampilkan adalah charset, name, http-equiv, dan content.

Penulisan meta tag adalah sebagai berikut: <meta … />. Meta tag merupakan tag yang berdiri sendiri, atau disebut juga self-closing tag.

Mengenal atribut name pada meta tag

Atribut pertama yang akan kita pelajari adalah name. Kita bisa menamakan isi dari atribut name ini dengan apa saja. Biasanya tag ini dipakai sebagai keterangan tentang kode HTML di dalamnya, seperti pembuat kode, tanggal, dan keterangan tentang isi halaman tersebut.

Untuk web asing biasanya atribut name akan berisi author, description, dan keywords. Author dimaksudkan untuk menambahkan nama pembuat kode kedalam HTML, description untuk keterangan tentang kode yang ada di dalam halaman itu, dan keyword berfungsi untuk kata kunci yang mewakili isi keseluruhan halaman.

Khusus untuk atribut keyword, beberapa tahun yang lalu, atribut ini sering digunakan sebagai kata kunci bagi mesin pencari dalam meng-index halaman website. Namun karena seringnya meta tag keyword ini di manipulasi supaya mempengaruhi hasil pencarian, belakangan ini mesin pencari seperti google tidak lagi menggunakannya.

Mengenal atribut charset pada meta tag

Atribut charset pada meta tag digunakan untuk memberi tahu web browser dengan karakter set apa halaman web akan ditampilkan. Biasanya atribut charset ini akan berisi nilai seperti utf-8, atau ISO-8859-1.

Jika kita tidak memasukkan charset ke dalam meta tag, tampilan halaman seakan tidak berubah, namun akan menjadi masalah jika halaman web kita dibuka oleh browser dari negara yang tidak menggunakan huruf latin seperti jepang, cina dan arab. Mendeklarasikan utf-8 sebagai atribut charset pada meta tag merupakan langkah untuk mengantisipasinya.

Mengenal atribut HTTP equivalents pada meta tag

Atribut HTTP Equivalents berkaitan dengan HTTP header. Dimana ini merupakan mekanisme web browser mengirimkan halaman ke browser kita. Nilai dari atribut HTTP Equivalents ini dapat berupa content-type, default-style dan refresh. Yang cukup menarik adalah jika nilai HTTP Equivalents kita isi dengan refresh, maka kita dapat mengontrol secara otomatis seberapa sering halaman akan di refresh.

Contoh penggunaan meta tag adalah sebagai berikut, save kode berikut sebagai meta.html

<!DOCTYPE html>
<html>
<head>
<title>Belajar Meta Tag HTML</title>
    <meta charset="utf-8" />
    <meta http-equiv="refresh" content="3" />
    <meta name="keywords" content="belajar meta tag html, 
    meta tag, belajar html dasar" />
    <meta name="description" content="dahulu 
    google akan menampilkan kalimat ini" />
</head>
<body>
   <p>
     Halaman ini akan otomatis di refresh setiap <em>3 detik</em>
   </p>
</body>
</html>

Pengertian Meta Tags

Dari contoh meta.html diatas, halaman tersebut akan direfresh secara otomatis setiap 3 detik, hal ini kita cantumkan pada <meta http-equiv="refresh" content="3" /> dimana konten adalah penentu berapa detik halaman tersebut harus menunggu diantara tiap refresh. Atribut keyword dan description lebih ditujukan kepada mesin pencari seperti google, walaupun efektifitasnya sudah jauh berkurang saat ini.

63 Comments

  1. Dimaz
    26 Jun 13
    • Andre
      12 Oct 13
  2. Sepatu kickers
    08 Jul 13
    • Andre
      12 Oct 13
  3. Andi Ikbal
    11 May 14
    • Andre
      27 May 14
  4. bagus DKN
    20 May 14
    • Andre
      27 May 14
    • Andre
      16 Sep 14
  5. Lukman
    31 Oct 14
    • Andre
      31 Oct 14
  6. Lukman
    03 Nov 14
  7. JenalAlfianta
    20 Nov 14
  8. gede
    11 Feb 15
    • Andre
      11 Feb 15
  9. Mufti
    17 Feb 15
    • Andre
      21 Feb 15
  10. Anonymous
    11 Jan 16
    • Andre
      12 Jan 16
  11. indigo
    22 Mar 16
  12. Light
    26 Mar 16
    • Andre
      27 Mar 16
  13. Umroh Desember
    20 Jun 16
    • Andre
      21 Jun 16
  14. Anonymous
    03 Aug 16
    • Andre
      04 Aug 16
  15. Anonymous
    06 Sep 16
  16. William
    04 Jan 17
  17. Shiota
    08 Feb 17
    • Shiota
      08 Feb 17
  18. Udan
    14 Feb 17
  19. Landra
    23 Feb 17
    • Andre
      24 Feb 17
  20. dini januariska
    07 Apr 17
  21. Herniawan
    14 Jul 17
    • Andre
      15 Jul 17
  22. Aditya
    09 Sep 17
    • Andre
      10 Sep 17
  23. Frens Papia
    01 Mar 18
    • Andre
      02 Mar 18
  24. Alam jaya
    24 Apr 18
    • Andre
      24 Apr 18
  25. Indra
    09 Jun 18
  26. WirogAsoy
    22 Jul 18
    • Andre
      23 Jul 18
  27. ore
    22 Nov 18
  28. Anonymous
    02 Feb 19
  29. idokeren
    04 May 19
  30. Afaizan
    02 Oct 19
  31. han
    22 Feb 20
    • Andre
      23 Feb 20
  32. Anonymous
    27 Jun 20
    • Andre
      28 Jun 20
  33. VexaGame
    21 Oct 20
    • Andre
      29 Sep 21
  34. Anonymous
    28 Sep 21
    • Andre
      29 Sep 21
  35. Suryo Adhy Chandra
    22 Mar 22

Add Comment