gravatar

HTML Heading

Definisi Heading dan Penggunaannya

Heading digunakan untuk menampilkan struktur tulisan pada sebuah halaman. Sama seperti format heading pada aplikasi-aplikasi pengolah kata. Tag heading pada sebuah halaman HTML berdasarkan ukuran huruf atau karakter dan tujuan penulisan atau penggunaannya, secara umum dibedakan menjadi 6 (enam), yaitu ;
  1. Ukuran huruf terbesar untuk tujuan terpenting, dituliskan dengan tag <h1>...</h1>
  2. Ukuran huruf terkecil dengan tujuan yang relatif kurang penting, ditulis dengan tag <h6>...</h6>
Pada sebuah halaman HTML, tag heading <h1>...<h6> ditulis diantara atau didalam lingkungan elemen <body>.
Untuk membedakan tag heading dengan tag <head> serta tag <title>, berikut adalah contoh penulisannya ;



<html>
<head>
<title>Judul ditulis disini;/title>
</head>
<body>
<h1>Tag heading 1</h1>
<h2>Tag heading 2</h2>
<h3>Tag heading 3</h3>
<h4>Tag heading 4</h4>
<h5>Tag heading 5</h5>
<h6>Tag heading 6</h6>
</body>
</html>



hsilnya seperti ini :


Tag heading 1

Tag heading 2

Tag heading 3

Tag heading 4

Tag heading 5

Tag heading 6



Tag Heading dapat di ikuti satu atau beberapa Atribut Standar (seperti: class, dir, id, lang, style, title, xml:lang) dan atau Atribut Event (seperti: onclick, onmouseover, onkeypress, dll) serta Atribut Optional (seperti: align). Atribut-atribut tersebut dapat didefinisikan untuk mengatur tampilan sebuah tag heading sesuai keinginan.

Sedikit catatan untuk halaman dengan format Strict DTD :,
atribut Optional align yang berfungsi untuk memformat alignment heading sudah tidak disarankan untuk dipergunakan.

Belajar Bijaksana dengan tag Heading

Struktur konten yang ditandai dengan penggunaan heading yang baik akan membantu pengunjung pada saat akan menyimpulkan atau membuat ringkasan sebuah tulisan. Perlu disampaikan kembali bahwa selain menggunakan tag heading, untuk menandai sebuah kalimat atau kata yang dianggap penting pada sebuah halaman, HTML juga menyediakan tag <strong> atau tag <b>, untuk memberikan efek penebalan pada kata atau kalimat yang dianggap penting.

Memilih untuk menggunakan tag heading dibandingkan dengan sekedar menggunakan emphasis strong, atau sebaliknya, adalah letak belajar bijaksana dengan heading <h1> … <h6>?

Posting-posting awal blog ini, menuai beberapa masukan dan di kritisi oleh senior dan master master berkaitan dengan penggunaan heading dan emphasis strong. Saran dan kritik tersebut pula yang memberikan motivasi dan dorongan untuk terus belajar keras memahami kebijaksanaan penggunaan tag heading dan penggunaan tag <strong> atau tag <b> untuk sebuah konten.

Google juga cukup membantu dengan memberikan wacana berjudul Menggunakan tag heading dengan sewajarnya, dengan penjelasan sebagai berikut (pemahaman pribadi saja):

  1. Imajinasi heading dalam sebuah ikhtisar

    Sebuah ikhtisar akan melibatkan ide sebagai poin utama dan beberapa sub-poin sebagai pendukung ide utama. Melibatkan ide utama dan sub-poin sebagai sebuah heading akan memudahkan pembaca, baik pada saat berkesimpulan ataupun saat ingin menulis ulang sebuah konten.

    Ambil sebuah contoh ikhtisar nyleneh sebagai berikut :

    Ide utama : Pulau Terbesar di Indonesia
    Sub-poin a : Pulau Kalimantan.
    Sub-poin b : Geografis dan kebudayaan Pulau Kalimantan

    Setelah membaca ikhtisar diatas, konten seperti apa yang terlintas didalam benak anda ? Karena kita pernah mempelajari konten tersebut, saya yakin bahwa tidak satupun dari anda yang menemui kesulitan ketika diminta untuk mengembangkan kembali ikhtisar tersebut.

    Kecuali seorang Macan Mimbar, jarang ditemukan seseorang yang beranjak ke podium tanpa sehelai kertas kecil yang berisi catatan tentang segala sesuatu yang ingin dibicarakannya. Pernahkah anda melakukannya ? dan Apa yang anda tulis dalam sehelai kertas tersebut untuk memudahkan anda berpidato secara runut ?

  2. Belajar hemat dengan tag heading

    Konotasi berlebihan, di budaya manapun rasanya terkesan sedikit buruk, termasuk habit pada sebuah halaman HTML. Sudah disinggung pada awal tulisan ini, bahwa HTML juga menyediakan beberapa tag untuk memformat tampilan teks atau tulisan untuk tujuan tertentu.

    Hal ini kadang-kadang terlupakan, sehingga untuk menggunakan heading tags secara efisien, cermat dan tepat (baca:hemat) menjadi sebuah teori saja. Dan berikut adalah solusi hemat untuk tag heading HTML (<h1> … <h6> ) :

    • Tidak menggunakan tag heading secara berlebihan disepanjang halaman
    • Tidak selalu menggunakan tag heading, apabila menggunakan tag lain seperti dan sudah dirasakan cukup untuk sebuah tujuan
    • Tidak menempatkan teks pada tag heading yang tidak akan berguna dalam menentukan struktur laman
    • Tidak memasukkan seluruh teks halaman ke tag heading
    • Tidak menggunakan tag heading semata-mata untuk styling saja dan tidak mewakili struktur
    • Tidak melakukan penggantian ukuran tag heading dari satu ke yang lainnya secara acak. Normalnya berhitung, setelah 1, pasti 2 dan seterusnya.

Tulisan ini hanya bertujuan mendokumentasikan persepsi pribadi tentang tag heading HTML, dengan tidak ada maksud sama sekali untuk menggurui siapapun dan dimanapun. Dan mudah-mudahan analogi ikhtisar nyleneh diatas bisa menjelaskan kegunaan sebuah heading pada konten yang baik.

Satu lagi pelajaran valid untuk sebuah halaman tersirat dari penjelasan Google. Apakah itu ? Silahkan minta tolong anak atau keponakan untuk mulai menunjuk satu persatu jari tangannya sambil berhitung.

Salam W3C Valid untuk Halaman dari Indonesia.

sumber : side22.com



untuk Indonesia yang lebih baik
terus berkarya

Category: ,
Rabu, 11 Agustus 2010 at 18.51