Cara Membuat Heading di HTML

Updated on January 3, 2019

Setelah di dua tutorial sebelumnya tentang HTML kita telah belajar bagaimana konsep data HTML dan memahami konsep elmen pada html, pada kesempatan kali ini kita akan coba belajar bagaimana cara membuat heading atau judul pada HTML.

Mengenal Heading HTML

WarungKomputer.com-Heading atau lebih tepatnya TAG 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 (bold) dari teks biasa. Tidak hanya sekedar untuk memberikan penampilan yang lebih tegas dan penekanan, TAG Heading juga sangat penting dalam kaitannya dengan teknik Search Engine Optimization(SEO).

TAG Heading dalam HTML terdiri dari 6 tingkatan berdasarkan tingkat penting dan 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.

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.

Cara Membuat Heading di HTML

Contoh Penggunaan TAG Heading

Berikut contoh penggunaan Heading dalam kode HTML:

<!DOCTYPE HTML>
<html>
	<head>
		<title>TAG Heading HTML</title>
	</head>
	<body>
		<h1>Heading H1</h1>
		<h2>Heading H2</h2>
		<h3>Heading H3</h3>
		<h4>Heading H4</h4>
		<h5>Heading H5</h5>
		<h6>Heading H6</h6>
	</body>
</html>

Berikut penampakannya jika dijalankan melalui browser:

Berikut contoh penggunaan HTML untuk membuat tulisan dan sub judul:

<!DOCTYPE HTML>
<html>
	<head>
		<title>Penggunaan TAG Heading HTML</title>
	</head>
	<body>
		<h1>Judul Utama</h1>
		
		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

		<h2>Sub Judul</h2>

		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

		<h2>Sub Judul</h2>

		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

		<h3>Sub dari Sub Judul</h3>

		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
	</body>
</html>

Penutup

Pastikan gunakanlah TAG Heading dalam membuat halaman web, karena TAG Heading sangat berperan penting dalam meningkatkan nilai web kita di mata search engine. Demikianlah cara menggunakan TAG Heading dalam HTML. Pada seri tutorial belajar html selanjutnya kita akan mencoba untuk belajar cara membuat paragraf di HTML. Semoga bermanfaat.
Semoga artikel Cara Membuat Heading di HTML

SUMBER:
codepolitan.com