Jumat, 09 Februari 2018

Belajar HTML Part 5 - Membuat Heading di HTML


Heading
Heading merupakan tag khusus yang disediakan oleh HTML untuk membuat sebuah judul pada teks dalam sebuah halaman web. Tag Heading secara default ditampilkan oleh browser dengan ukuran lebih besar dan lebih tebal dari teks biasa.

Tag Heading dalam HTML terdiri dari 6 tingkatan berdasarkan tingkatan yang paling penting dan juga berdasarkan ukurannya. Tag Heading tersebut adalah <h1>, <h2>, <h3>, <h4>, <h5> dan <h6>. Tag H1 memiliki ukuran paling besar, sedangkan tag h6 memiliki ukuran paling kecil.
Contoh
<!DOCTYPE html>
<html>
<head>
<title>Title Halaman</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>

Hasilnya:



Catatan: Browser secara otomatis menambahkan beberapa ruang putih (margin) sebelum dan sesudah heading.
Menggunakan heading itu sangat penting!
Pengguna mencari halaman kita berdasarkan judulnya. Sehingga sangatlah penting  penggunaan heading untuk  struktur dokumen HTML.

Heading <H1> harus digunakan untuk judul utama, diikuti oleh heading <h2>, heading <h3>, dan seterusnya sampai heading <h6>.
Catatan: Gunakan Heading HTML hanya untuk membuat judul saja. Jangan gunakan Heading untuk membuat teks BESAR atau tebal.
Heading Besar
Setiap heading HTML memiliki ukuran default. Namun, Anda dapat mengubah dan menentukan ukuran untuk setiap heading dengan menggunakan atribut style:
Contoh
<h1 style="font-size:60px;">Heading 1</h1>

Hasilnya:



Hasilnya terlihat lebih besar daripada contoh pertama diatas tadi, karena pada contoh ini, tag <h1> diberi style dengan font size 60px, artinya ukuran huruf pada tag <h1> ini sedikit diperbesar dari ukuran defaultnya.

Elemen HTML <head>
Elemen HTML <head> tidak ada hubungannya dengan judul HTML.
Elemen <Head> merupakan wadah/tempat untuk metadata. Metadata HTML adalah data tentang dokumen HTML. Metadata tidak ditampilkan di browser.

Elemen <Head> ditempatkan di antara tag <html> dan tag <body>:
Contoh
<!DOCTYPE html>
<html>
<head>
  <title>HTML Pertamaku</title>
  <meta charset="UTF-8">
</head>
<body>

...konten...

</body>
</html>
Catatan: Metadata biasanya menentukan judul dokumen, chartset, style, link, script, dan informasi meta lainnya.
Untuk pembahasan elemen <head> lebih lengkap, kunjungi tutorial Part 19 disini!

Demikian pembahasan tentang cara membuat Heading pada HTML.
Semoga bemanfaat!

Sumber: https://www.w3schools.com

Bagikan

Artikel Terkait

Belajar HTML Part 5 - Membuat Heading di HTML
4/ 5
Oleh

Subscribe via email

Suka dengan artikel di atas? Tambahkan email Anda untuk berlangganan! Terima Kasih...