Cara Membuat Judul (heading) di HTML !




Bukan hanya penting tetap pada saat mesin pencarian menggunakan judul untuk mengindeks struktur dan isi dari website kita. Penggunaan skim halaman kita dengan judulnya. Hal ini penting untuk menggunakan judul untuk menunjukkan struktur dokumen kita. Tag <h1> adalah heading yang harus digunakan untuk judul artikel kita, dan diikuti dengan tag <h2> dan juga seterusnya.

Pengertian Judul (heading) Di HTML

HTML memiliki tag khusus yang digunakan untuk membuat Judul yang penting dalam dokumen HTML lebih dikenal dengan sebutan heading. Dimana heading dirancang secara terpisah teks dari paragraf. Tag heading biasanya digunakan dalam judul dari paragraf, atau bagian teks yang berupa judul. Tag heading didalam HTML memiliki 6 tingkatan diawali dengan huruf yang besar dan diakhiri dengan huruf yang kecil, yaitu <h1>, <h2> ,<h3> ,<h4> ,<h5> ,<h6>. Secara default tag heading akan ditampilkan di web browser dengan huruf yang tebal (bold). Tampilan dari judul (heading) akan secara bertingkat. Huruf yang besar yaitu tag <h1> dan tag yang paling kecil yaitu <h6>.

Cara Membuat Judul (heading) di HTML

Perlu diperhatikan bahwa walaupun tag Heading ini memiliki ukuran yang bervariasi dan lebih tebal serta besar dari tag biasa, namun jangan gunakan tag Heading ini hanya untuk membuat tulisan yang lebih besar. Gunakanlah tag  Heading hanya untuk membuat judul dan subjudul, bukan untuk membuat tulisan berukuran besar. Karena pada dasarnya untuk membuat tulisan besar kita bisa menggunakan CSS.

Biasanya h1 hanya digunakan satu kali dalam sebuah halaman web, yaitu sebagai judul utama (judul besar). h2, h3 dan seterusnya bisa kita gunakan beberapa kali sebagai sub judul. Untuk lebih jelas bisa memahami contoh berikut :

<!DOCTYPE html>
<html>
<head>
     <title>RuangIlmu</title>
</head>
<body>
<h1> bagian judul (heading) tag h1 </h1>
<h2> bagian judul (heading) tag h2 </h2>
<h3> bagian judul (heading) tag h3 </h3>
<h4> bagian judul (heading) tag h4 </h4>
<h5> bagian judul (heading) tag h5 </h5>
<h6> bagian judul (heading) tag h6 </h6>
</body>
</html>

Hasilnya akan seperti tampilan dibawah ini :


Biasanya dalam sebuah halaman akan ada hanya 1 tag <h1>, dan beberapa tag <h2> dan <h3> dengan beberapa tag <p>. Berikut adalah contoh struktur artikel HTML sederhana dengan menggunakan tag <p> dan beberapa tag heading:

<!DOCTYPE html>
<html>
<head>
  <title>RuangIlmu</title>
</head>
<body>
  <h1>Judul Artikel</h1>
  <p>.....pembahasan artikel.....</p>
    <h2>Sub Judul Artikel 1</h2>
    <p>.....pembahasan sub artikel 1.....</p>
    <h2>Sub Judul Artikel 2</h2>
    <p>.....pembahasan sub artikel 2.1.....</p>
      <h2>Sub Sub Judul Artikel 2.1</h2>
      <p>.....pembahasan sub sub artikel 2.1.....</p>
</body>

Berikut hasil yang akan dapat anda lihat :


Dengan menggunakan beberapa tag heading dan paragraf, kita bisa membuat struktur sederhana konten HTML.

Search Engine seperti Google akan memberikan nilai lebih untuk heading. Biasanya semakin tinggi tingkat heading, semakin tinggi pula penekanan search engine. Tag <h1> dianggap lebih bernilai dari pada <h2>. Tag <h1> umumnya digunakan untuk judul sebuah konten / artikel, sehingga dianggap dapat mewakili keseluruhan artikel.

Selain terdiri dari paragraf dan judul, sebuah struktur artikel juga perlu membuat daftar, atau dikenal sebagai list. Dalam tutorial selanjutnya kita akan membahas tentang Cara Membuat Daftar/List di HTML !



Next
Previous
Click here for Comments

0 komentar:

Bijaklah saat Anda memberikan komentar atau kritik !!