Bagian Header

Bagian Header Template
Daftar Isi Artikel []

Gambar Pada Header

Rasio terbaik untuk diterapkan pada Header adalah 3:1. Gambar dibawah ini contohnya:
Gambar Untuk Header

Menu Navigasi

Menu navigasi RWD (nonAMP), bisa dibuat multi drop-down. Sedangkan versi AMP, hanya drop-down.

Single

<ul>
  <li><a title="Menu" href="#!" itemprop="url"><span itemprop="name">Menu</span></a></li>
  <li><a title="Menu" href="#!" itemprop="url"><span itemprop="name">Menu</span></a></li>
</ul>

Drop Down

Untuk membuat navigasi dropdown, tambahkan kelas drop-down di tag li, kemudian tambahkan unordered list dengan class sub-menu di dalamnya. Contoh:
<ul>
  <li> <!-- Single Menu Start -->
    <a title="Menu" href="#!" itemprop="url">
      <span itemprop="name">Menu 1</span>
    </a>
  </li> <!-- Single Menu End -->
  <li class="drop-down"> <!-- Drop-Down Menu Start -->
    <a title="Menu" href="#Sub1" itemprop="url">
      <span itemprop="name">Menu 2</span>
    </a>
      <ul id="Sub1" class="sub-menu"> <!-- Sub Menu Start --> 
        <li>
          <a title="Menu" href="#!" itemprop="url">
            <span itemprop="name">Menu 2.1</span>
          </a>
        </li>
      </ul> <!-- Sub Menu End -->
  </li> <!-- Drop-Down Menu End -->
</ul>

Multi Drop-Down

Navigasi dengan multi drop-down hanya untuk versi nonAMP. Begini contohnya:
<ul>
  <li> <!-- Single Menu Start -->
    <a title="Menu" href="#!" itemprop="url">
      <span itemprop="name">Menu 1</span>
    </a>
  </li> <!-- Single Menu End -->
  <li class="drop-down"> <!-- Multi Drop-Down Menu Start -->
    <a title="Menu" href="#Sub1" itemprop="url">
      <span itemprop="name">Menu 2</span>
    </a>
    <ul id="Sub1" class="sub-menu"> <!-- Sub Menu Start --> 
      <li class="drop-down"> <!-- Sub Drop-Down Menu Start -->
        <a title="Menu" href="#Sub1_1" itemprop="url">
          <span itemprop="name">Menu 2.1</span>
        </a>
        <ul id="Sub1_1" class="sub-menu"> <!-- Sub Sub Menu Start -->
          <li>
            <a title="Menu" href="#" itemprop="url">
              <span itemprop="name">Menu 2.1.1</span>
            </a>
          </li> 
        </ul> <!-- Sub Sub Menu End -->
      </li> <!-- Sub Drop-Down Menu End -->
    </ul> <!-- Sub Menu End -->
  </li> <!-- Multi Drop-Down Menu End -->
</ul>