#30 Mengenal atribut http-equiv pada HTML

Mengenal atribut http-equiv pada HTML

pada tutorial ini kita akan bahas secara lengkap tentang atribut http-equiv pada HTML.

apa itu http-equiv ?

http-equiv adalah atribut pada tag meta yang digunakan oleh server untuk mengumpulkan informasi tentang halaman menggunakan header HTTP.

struktur elemen meta :

<meta http-equiv="value" content="value" />Code language: HTML, XML (xml)

Baca juga : Tag dan Elemen pada HTML

dibawah ini adalah berbagai nilai atribut untuk atribut http-equiv

Content-Type

<meta http-equiv="content-type" content="type; charset=charset" />Code language: HTML, XML (xml)

http-equiv=”content-type” menunjukkan jenis data yang dikirimkan ke browser, memungkinkan browser untuk mengetahui apa yang harus dilakukan dengan data yang diterima.

content-type atau jenis konten menentukan pengkodean karakter untuk dokumen, contoh untuk situs bahasa inggris gunakan karakter kode

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />Code language: HTML, XML (xml)

untuk situs jepang

<meta http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP" />Code language: HTML, XML (xml)

sekarang penggunaan Content-Type sudah usang dan sudah di standarisasi menjadi :

<meta charset="UTF-8" />Code language: HTML, XML (xml)

UTF-8 menjadi standarisasi untuk pengkodean dalam sistem operasi, bahasa pemprograman, API dan software.

content-security-policy

nilai atribut content-security-policy memungkinkan untuk menentukan sumber mana yang disetujui untuk dimuat oleh browser.

contoh dibawah ini memungkinkan sumber daya apapun untuk dimuat dari domain saat ini serta subdomain dari thohirdev.com

<meta http-equiv="content-security-policy" content="default-src 'self' *.thohirdev.com">Code language: HTML, XML (xml)

content-security-policy berguna untuk melapisi keamanan tambahan yang membantu mendeteksi dan mengurangi jenis serangan tertentu, termasuk Cross Site Scripting ( XSS ) dan serangan injeksi data.

Serangan – serangan ini digunakan untuk segala hal mulai dari pencurian data, perusakan situs hingga distribusi malware.

default-style

nilai atribut default-style menentukan stylesheet apa yang disukai untuk digunakan, nilai atribut content harus cocok dengan nilai <link> elemen dalam dokumen yang sama agar valid. contoh

<meta http-equiv="default-style" content="/style.css">Code language: HTML, XML (xml)

refresh

nilai atribut refresh disebut juga meta refresh, meta refresh adalah metode untuk menginstruksikan browser web untuk secara otomatis me-refresh atau reload halaman web dengan interval waktu tertentu.

<meta http-equiv="refresh" content="5">Code language: HTML, XML (xml)

kita bisa melihat hasil dari meta refresh ini dengan klik coba script

<!DOCTYPE html>
<html>
<head>
    <title> Membuat auto refresh </title>
    <meta charset="UTF-8">
    <meta http-equiv="refresh" content="5" />
</head>
<body>
    <p>
        Membuat auto refresh pada HTML
    </p>
</body>
</html>Code language: HTML, XML (xml)

halaman yang kita coba di editor tersebut akan secara otomatis me-reload halaman, perhatikan icon refresh di browser Anda akan mereload setiap 5 detik atau kamu bisa mencobanya dengan memilih teks seperti dibawah ini

ketika reload halaman background biru itu akan hilang dan ada kedipan blank putih itu menandakan halaman tersebut direload

Contoh diatas hanya beberapa cara untuk menggunakan atribut http-equiv, jelas, jika kamu memiliki akses ke file konfigurasi server maka kamu bisa meniru contoh diatas dan banyak lagi tanpa memerlukan penggunaan atribut http-equiv

Ringkasan

http-equiv juga dikenal sebagai header respons HTTP, dapat bermanfaat bagi yang tidak memiliki akses ke file konfigurasi server tetapi ingin memodifikasi dengan cara tertentu.

Pencarian di thohirdev:

  • penggunaan http-equiv
  • pengertian http-equiv
  • meta refresh, refresh halaman secara otomatis

Tutorial Terbaru