Belajar tag Heading pada konten yang baik

tag-heading-pada-konten-yang-baikMelengkapi posting tentang belajar menulis konten yang baik, dan melanjutkan materi belajar Search Engine Optimization (baca: Google SEO), serta pertanggung-jawaban atas sebuah mimpi pribadi tentang pentingnya validasi sebuah halaman. Tulisan berikut adalah sedikit pemahaman pribadi lagi tentang Tag Heading HTML atau Tag <h1></h1> sampai <h6></h6> yang sesuai dengan Standarisasi dan Validasi W3C, pada sebuah konten yang baik menurut search engine.

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>Text ini biasanya muncul dipojok kiri atas browser</title>
</head>
<body>
<h1>Contoh menggunakan tag heading 1</h1>
<h2>Contoh menggunakan tag heading 2</h2>
<h3>Contoh menggunakan tag heading 3</h3>
<h4>Contoh menggunakan tag heading 4</h4>
<h5>Contoh menggunakan tag heading 5</h5>
<h6>Contoh menggunakan tag heading 6</h6>
</body>
</html>

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 : Suara Sepatu Kuda.
    Sub-poin a : Hari minggu di kota.
    Sub-poin b : Bagaimana bunyinya ?

    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 <em> dan <strong> 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.

Belajar tag Heading pada konten yang baik

Published on : Nov 03, 2009. Last modified at : Apr 25, 2010.


Click to share on twitter , digg it, or save this article to del.icio.us.

article Navigation

Related to “Belajar tag Heading pada konten yang baik”.

6 Opinion for “Belajar tag Heading pada konten yang baik”.

Kalau dikaitkan dengan tatabahasa Indonesia, kalau tidak salah, tiap heading level 2 dan 3 dianjurkan memiliki setidaknya 1 paragraf atau 2-3 kalimat. :) Jika tidak, mungkin cukup dengan list atau strong/emphasis.

Heading level 4-6 mungkin akan membingungkan bagi pengguna dengan hendaya pengetahuan/kognitif. :)

Betul. Untuk level 2 sebagai judul posting, pada syarat minimal 1 paragrah dan atau minimal 3 kalimat pasti sudah akan terpenuhi.
Trial pada level 3 sebagai heading komentar ternyata cukup bermanfaat pula, bila minimal syarat seperti level 2 juga terpenuhi. (maaf, reportnya akan dikirim secara terpisah).

Entah kognitif atau tidak, tetapi saya menemukan kasus bahwa level 5 dan level 6 yang saya ujicobakan pada sebuah posting ternyata lumayan berpengaruh.
Bagaimana ini Rayimas ?!? Saya malah jadi bingung sendiri.

Ngikut yang punya gelanggang aja, kangmas. :D

Yang sabar Rayimas.
Berikan contoh pensil yang baik dan agak murah dulu supaya saya mampu membeli dan menggunakannya secara bertahap. Minimal untuk coretan sebuah medan pertempuran yang sedikit agak lebar. :)
Tapi jangan khawatir,.. tidak masuk kuping kiri keluar kuping kanan koq.

terima kasih atas ilmunya sob… dengan postingan ini saya bisa mengerti sedikit tentang tag heading

Terima kasih juga Mas Imoel,…
Saya juga masih belajar tentang heading berhubungan dengan optimasi blog wordpress ini mas.

Leave an Opinion

Important : LOW isn't intended to on topic opinions, just be polite. You may use strict markup only. Opinions failing these requirement will be edited. Spam opinion won't get published.
Please, enter your real name and your valid email address (in required field). Don't worry, i'll kept your email private.










Random Learning