Deskripsi
Penjelasan HTML header

HTML <header> element merepresentasikan konten pengantar, pembukaan atau navigasi yang terdiri dari deretan link.

Dalam penggunaannya, <header> element dapat berisi element heading (<h1>-<h6>) tapi tidak diperlukan, daftar isi (table of contents), sebuah logo, form pencarian dan lain sebagainya.

<header> element bukanlah sebuah konten pemisah (sectioning content) karena ia bukanlah konten yang terdiri dari headings dan footers, karena jelas sekali dalam sebuah <header> tidak boleh terdapat element <header> lain.

Elemen <header> tidak boleh digunakan sebagai anak element (descendant) dari <address>, <footer>, atau <header> lainnya.

Dalam sebuah dokumen, dapat ditemukan lebih dari satu <header> element.


Global Attributes
Atribut Secara Global (Keseluruhan)

<header> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Event Attributes
Atribut event (Peristiwa)

<header> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Example
Contoh HTML <header> element

Contoh 1

<header> yang ditulis di dalam <body> element, sehingga dapat ditulis informasi yang berlaku pada dokumen secara keseluruhan.

<body>
  <!-- header pertama -->
  <header>
    <h1>dul Blog</h1>
    <nav>
      <ul>
        <li>
          <a href="#">Artikel Terbaru</a>
        </li>
        <li>
          <a href="#">Artikel Populer</a>
        </li>
        <li>
          <a href="#">Hubungi Kami</a>
        </li>
      </ul>
    </nav>
  </header>
</body>

Contoh 2

<header> ditulis didalam <article> element. Isinya berkenaan dengan catatan kepala dan informasi yang berkaitan dengan article tersebut.

<article>
  <!-- header kedua -->
  <header>
    <h2>Mengenal Web Standard</h2>
    <p>Ditulis oleh: dul,
      <time datetime="2015-03-07T13:00">07 Maret 2015, pkl. 13:00</time>
    </p>
  </header>
  <p>Apa itu Web Standard? Web Standard adalah teknologi yang dibangun oleh
    W3C dan lainnya yang dikembangkan untuk menginterpretasikan konten web
    agar memiliki standar yang dapat dinikmati oleh semua kalangan dan dapat
    diakses di semua
    <em>device</em>(smartphone, tablet, desktop dan lain sebagainya).</p>
</article>

Jika Contoh 1 dan Contoh 2 digabungkan, maka hasilnya dapat dilihat pada demo editor dibawah ini:

Contoh Lengkap
Demo dengan Source Code Editor

Demo Editor
Demo HTML <header>
Code Editor