Tutorial Belajar HTML Part 4 - Penggunaan Heading Tags dalam HTML: Menyusun Judul dan Subjudul

Penggunaan Heading Tags dalam HTML: Menyusun Judul dan Subjudul

Heading tags dalam HTML (Hypertext Markup Language) digunakan untuk menandai judul dan subjudul di halaman web. Mereka memberikan struktur hierarkis yang membantu dalam pengaturan konten sehingga pembaca dan mesin pencari dapat memahami hierarki informasi.

Hierarki Heading Tags

HTML menyediakan enam level heading tags, dimulai dari <h1> hingga <h6>. Secara umum, <h1> digunakan untuk judul utama atau judul halaman, sedangkan <h2> hingga <h6> digunakan untuk subjudul yang berjenjang.

Contoh Penggunaan Heading Tags

Penggunaan untuk Judul Utama

<h1>Ini Adalah Judul Utama</h1>

Tag <h1> digunakan untuk judul utama atau judul halaman. Ini adalah heading tag dengan tingkat kepentingan tertinggi di antara semua heading tags.

Penggunaan untuk Subjudul

<h2>Ini Adalah Subjudul Pertama</h2>
<h3>Ini Adalah Subjudul Kedua</h3>

Tag <h2>, <h3>, dan seterusnya digunakan untuk subjudul yang mengikuti judul utama. Mereka menunjukkan tingkat kepentingan yang menurun seiring dengan penurunan nomor heading.

Pentingnya Struktur Heading Tags

Penggunaan yang tepat dari heading tags penting untuk SEO (Search Engine Optimization) dan aksesibilitas. Mesin pencari seperti Google menggunakan informasi dari heading tags untuk memahami struktur konten halaman web.

Selain itu, bagi pembaca, penggunaan heading tags dengan benar membantu mereka dalam memahami hierarki informasi. Pengguna layar dan pembaca layar juga menggunakan heading tags untuk menavigasi halaman dengan lebih efisien.

Rekomendasi Penggunaan

  • Gunakan <h1> hanya sekali per halaman untuk judul utama.

  • Gunakan heading tags secara berjenjang, memulai dengan <h2> setelah <h1>, kemudian <h3>, dan seterusnya.

  • Pastikan judul dan subjudul mencerminkan konten di bawahnya dan terkait secara logis.

Kesimpulan

Heading tags dalam HTML adalah kunci dalam menyusun judul dan subjudul dalam halaman web. Dengan memahami hierarki dan penggunaan yang tepat dari heading tags, Anda tidak hanya meningkatkan SEO halaman web Anda tetapi juga memperbaiki pengalaman pengguna dan aksesibilitas.


Robby Birham

Hi! I'm Robby Birham, a Software Engineer with more than 7+ years of experience. I have successfully completed more than 200+ projects using the latest technologies such as Laravel, ExpressJs, NextJs, and NuxtJs, I am ready to collaborate with you!