Heading HTML
Heading merupakan elemen penting dalam struktur sebuah halaman web. Heading digunakan untuk membuat judul pada halaman website.
Misalnya seperti judul website, judul artikel, sub judul artikel, judul widget pada sidebar dan lain-lain.
Heading juga berguna untuk membuat hierarki dan struktur pada konten sebuah halaman website, memudahkan pembaca untuk memahami informasi secara terorganisir.
Seperti hal nya pada website codingan.id ini. Semua halaman yang ada pada website ini tetap menggunakan heading untuk judul dan membuat struktur penjudulan dalam website.
Dalam tutorial ini, kita akan membahas cara membuat heading atau judul pada HTML dengan penjelasan yang detail dan contoh coding yang jelas.
Cara Membuat Heading HTML
Cara penulisan heading adalah dengan menggunakan tag pembuka <h1> dan diakhiri dengan tag penutup </h1>.
Judul yang ingin dibuat dapat ditulis di antara tag <h1> dan </h1>.
Contoh:
<h1>Halo, ini heading 1</h1>
Jika dijalankan maka akan muncul seperti berikut.
Note : Pastikan kamu sudah belajar tentang cara membuat file HTML pada tutorial sebelumnya.
Yeay, selamat kamu sudah berhasil membuat heading h1. Cukup mudah kan ..
Jenis Heading HTML
Heading pada HTML terdiri dari h1, h2, h3, h4, h5 dan h6.
Elemen-elemen ini memiliki tingkatan, di mana h1 merupakan heading utama atau heading dengan ukuran yang paling besar. Sedangkan h6 adalah heading terendah atau heading dengan ukuran paling kecil.
Jadi perbedaan antar heading ini ada pada ukuran dan peruntukannya sendiri.
Untuk cara penulisannya juga sama seperti cara sebelumnya. Yaitu ditulis dengan tag pembuka, dan diakhiri dengan tag penutup.
Perhatikan contoh berikut.
Contoh Heading Pada HTML
<!DOCTYPE html>
<html>
<head>
<title>Contoh Heading HTML - Codingan.id</title>
</head>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
</body>
</html>
Silahkan jalankan dan lihat perbedaannya.
Contoh Penggunaan Heading
Berikut ini adalah penjelasan dan penggunaan dari masing-masing heading.
Heading 1
Heading 1 (<h1>) digunakan untuk judul utama halaman website. h1 biasanya digunakan untuk membuat judul utama pada website. seperti misalnya judul website, judul artikel, atau judul halaman.
Heading 2
Heading 2 (<h2>) digunakan untuk sub judul yang penting. Biasanya digunakan pada bagian judul daftar artikel pada website.
Heading 3
Heading 3 (<h3>) cocok digunakan untuk judul sub-bagian dari <h2>. Heading ini membantu memecah halaman menjadi bagian-bagian yang lebih kecil dan terorganisir.
Heading 4, Heading 5, dan Heading 6
Ketiga heading (<h4>, <h5>, dan <h6>) ini bisa digunakan untuk judul dengan tingkat struktur hierarki yang lebih rendah. Penggunaannya disesuaikan dengan tingkat hierarki yang diinginkan.
Kesimpulan
Membuat heading HTML dengan benar sangat penting untuk memastikan struktur dan hierarki konten website kamu lebih terstruktur dengan baik.
Dengan menggunakan elemen heading yang sesuai, pembaca dapat dengan mudah memahami konten informasi pada halaman web kamu.
Semoga tutorial heading ini bisa membantu kamu dalam memahami penjudulan pada halaman website menggunakan heading HTML.