Tag html untuk membuat judul halaman

Langsung saja ke topik permasalahan kita yaitu bagaimana sih cara membuat judul dengan HTML ?. Seperti apa sih penjudulan halaman itu ?, Jika kamu pernah berkunjung ke suatu website, Kamu akan melihat sebuah tulisan besar dan tebal di awal halaman. Ya, itulah yang disebut Heading, yaitu judul suatu halaman post.

Table of Contents Show

Pengertian Tag HTML
Heading vs Title dan Header
Ingat Ini Saat Menulis Heading HTML: Aturan Tag Heading
Apa perintah HTML untuk membuat judul?
Tag tag HTML apa saja?
Apa fungsi tag h1 h1?
Tag elemen HTML Apakah yang di gunakan untuk membuat judul sebuah halaman dari website?

Lebih jelasnya, Heading adalah sebuah tag yang berfungsi untuk membuat suatu kata menjadi lebih jelas dan besar. Heading ditulis dengan perintah <H1> dan diakhiri dengan </H1>.

Tag heading bukan cuma H1 saja, Kalian bisa merubah angka dari “H” tersebut, Seperti H2, H3 sampai “H6”. Penulisan tag HTML nya seperti <h2><h3><h4><h5> dan <h6>, Semakin kecil angka yang di masukan, Maka huruf yang tampil akan semakin besar. Begitu juga sebaliknya, semakin besar angka yang di masukan maka huruf yang ditampilkan akan semakin kecil.

Contoh pemasangan tag h2 :

<h2>judul dari suatu halaman</h2>

Baiklah kita langsung saja buat kode html seperti di bawah ini :

<html>
<head>
<title>belajar tab heading</title>
</head>
<body>

<h2>ini contoh dengan tag heading satu maka akan tampil paling besar </h2>

<h2>ini contoh dengan tag heading dua maka akan tampil lebih kecil dari satu </h2>

<h3>semakin besar angka maka akan semakin kecil pula hurufnya </h3>

<h4>semakin kecil lagi guys ukuran hurufnya </h4>

<h5>ini juga akan semakin kecil hurufnya </h5>

<h6>nah ini yang paling kecil  </h6>

</body>
</html>

Sekarang save / simpan pada lokasi yang di inginkan, silahkan buka dengan aplikasi browser (klik kanan pada filenya, lalu klik open with, dan klik aplikasi browsernya) hasilnya kurang lebih akan tampak seperti gambar berikut ini :

Penjelasan kode html diatas :

<html> ini merupakan perintah untuk mebuka kode awal markup html dan akan selalu di akhiri dengan </html>
<head> merupakan bagian utuk nama tab halaman dan diakhiri dengan </head>
<title>merupakan judul yang di himpit antara perintah head
<body> merupakan isi dan akan di akhiri dengan </body>, terdapat beberapa atribut dalam tag body yang bisa diterapkan, seperti bgcolor dan bacground jika anda ingin belajar tentang bgcolor dan background silahkan klik disini, selain itu kita bisa menggunakan width untuk mengubah tampilan halaman.
<h2> merupakan heading dengan perintah pembesaran 1, yang memiliki arti bahwa text yang ada didalamnya akan menjadi besar dengan nilai 1(nilai terbesar diantara tag heading). setelah tah h2, kita mungkin memerlukan sub judul, untuk sub judul dari h2 adalah h2, begitupun juga h3 (merupakan sub judul dari h2).

oke satu sudah beres kita pahami dengan baik, sekarang kita belajar tentang atribut heading, yaitu align. align ini berfungsi untuk memberi rataan, baik rata kiri (left) atau rata kanan (right), dan rata tengah (center). untuk penggunaannya, anda tinggal menambahkannya didepan h seperti contoh

<h2 align=”center “> : yang membuat judul berada di tengah-tengah.

ini contoh dengan tag heading 2, dengan rata tengah :

<h2 align=”center”>…</h2>

Artikel Sebelumnya tentang cara mengubah Background HTML, berikut ulasannya :

Cara Mengubah Background HTML (Gambar dan Warna)

Sadarkah Anda bahwa judul dan sub judul mempunyai peranan yang sangat penting dalam kebutuhan konten website Anda? Sekarang coba bayangkan jika konten-konten di website Anda tidak mempunyai judul atau subjudul. Kira-kira akankah para pengunjung mengerti apa yang sedang mereka lihat atau baca dari website Anda? Jawabannya tentu saja tidak.

Untuk Anda yang sering menulis artikel, tentunya Anda sudah paham bahwa judul adalah komponen esensial dalam sebuah artikel. Jika diibaratkan dengan manusia, maka judul setara dengan kepala dari manusia. Tanpa adanya kepala tersebut, maka tulisan Anda menjadi tidak sempurna.

Sama halnya dengan susunan konten di website Anda, tanpa adanya judul website serta judul-judul atau sub judul lain, maka kecil kemungkinan pengunjung akan tertarik untuk melihat-lihat atau berlama-lama di website Anda.

Bayangkan jika Anda menelusuri sebuah website yang tidak ada judulnya. Maka tentunya Anda tidak tahu Anda tiba di website apa, website milik siapa, dan apa saja konten yang dimuat oleh website tersebut.

Ambil contoh website Appkey. Pada bagian teratas dari website Appkey terdapat judul khusus. Dari judul ini saja, kita sudah dapat melihat bahwa website ini bertemakan tentang dunia aplikasi. Selain itu, judul website juga bisa menjadi nama brand yang sedang Anda kembangkan.

Namun bagaimana caranya untuk kita bisa membuat judul dan sub judul di website? Salah satu alternatifnya adalah dengan membuat tag HTML. Pernahkah Anda mendengar istilah tag HTML sebelumnya? Sudahkah Anda tahu apa pengertian tag HTML?

Jangan khawatir jika Anda baru pertama kali mendengar tentang tag HTML. Artikel edisi kali ini akan membahas secara lengkap terkait pengertian tag HTML, kumpulan tag HTML dan contohnya. Penasaran? Mari langsung lanjutkan scroll untuk memulai pembahasan pertama! Selamat membaca!

Pengertian Tag HTML

Untuk Anda yang sudah menguasai bahasa pemrograman HTML, barang kali Anda sudah mengenal apa itu tag HTML. Tag HTML juga dikenal dengan tag heading atau heading. Tag heading atau heading ini sendiri merupakan suatu tag spesial milik bahasa pemrograman HTML yang biasa digunakan untuk membuat sebuah teks judul dan sub judul dalam halaman website.

Biasanya, tag heading ini sangat mudah untuk dikenali sebab pengaturan default dari tag heading umumnya lebih besar dan lebih tebal dari teks biasa atau isi teks content. Tag heading memang biasa dibuat dalam bentuk yang menonjol guna memudahkan pengguna untuk mengenali yang mana judul dan yang mana teks dalam sebuah website.

Namun tak hanya sampai di sana saja, tag heading juga dapat digunakan untuk memaksimalkan Search Engine Optimization atau SEO. Dengan menyisipkan kata kunci pada judul atau sub judul artikel, maka besar kemungkinan Google akan lebih mudah untuk mendeteksi artikel Anda sehingga dapat memunculkannya dengan lebih mudah di laman penelusuran hasil.

Alhasil, posisi SEO dari website Anda dapat menjadi lebih tinggi dibandingkan dengan website lain yang judul artikelnya tidak memuat kata kunci. Ada juga yang menggunakan tag heading untuk memberikan penegasan dan penekanan pada bagian-bagian tertentu dalam artikel mereka.

Ada beberapa jenis kumpulan tag HTML dan contohnya yang dapat kita pelajari dengan mudah. Setidaknya ada 6 kumpulan tag HTML dan contohnya. Keenam kumpulan tag HTML dan contohnya ini terdiri dari heading 1; heading 2; heading 3; heading 4; heading 5 dan heading 6.

Setiap heading mempunyai ukuran yang berbeda-beda. Biasanya, teks heading 1 atau tag 1 mempunyai ukuran yang paling besar dibandingkan yang lain. Sementara tag headin 6 mempunyai ukuran yang paling kecil. semakin besar angka dari heading, maka akan semakin kecil ukurannya di website.

Jika digambarkan, maka susunan kumpulan tag HTML dan contohnya adalah sebagai berikut

‘

‘
,

dan

Kalau dituangkan ke dalam tulisan, maka bentuknya seperti ini:

Heading H1

Heading H2

Heading H3

Heading H4

Heading H5

Heading H6

Berikut kumpulan tag HTML dan contohnya untuk tulisan dan sub judul:

Judul Utama Artikel (Heading 1)
Ini adalah intro dari artikel Anda sebelum masuk ke heading 2
Sub Judul (Heading 2)
Ini adalah isi sub judul dari artikel sebelum masuk ke heading 3

Sub Judul dari sub judul (Heading 3)
Ini adalah isi sub judul kedua sebelum masuk ke heading 4. Begitu seterusnya.

Umumnya, heading 1 dipakai untuk membuat judul utama dari artikel web sehingga heading 1 hanya digunakan 1 kali saja dalam website. Sementara untuk membuat sub judul lain, Anda bisa menggunakan heading 2, heading 3, dan seterusnya hingga heading 6.

Heading vs Title dan Header

Mungkin sampai di sini Anda merasa bahwa heading itu mirip dengan title dan header dari sebuah web atau konten web. Asumsi ini masuk akal, mengingat heading, title dan header sama-sama digunakan untuk membuat sebuah judul dan mempertegasnya dibandingkan tulisan-tulisan yang lain di dalam web. Namun terdapat perbedaan yang cukup signifikan antara heading, title dan header. Apa sajakah perbedaan tersebut?

Title adalah bagian judul utama dari website. Title ditampilkan pada bagian paling atas atau di kolom web browser. Title dibuat dengan menggunakan kode: tag <title>
Header adalah kepala (kop) web – mirip dengan kop pada surat biasa. Header dibuat dengan kode: tag <header>
Heading adalah judul dan sub judul artikel pada website. Heading dibuat dengan kode tag <h2>sampai <h6>.

Singkatnya, susunan penulisan dari title, header dan heading adalah dimulai dari title, dilanjutkan dengan header dan terakhir adalah heading sebagai judul dari artikel. Setelah heading, barulah Anda bisa menemukan teks isi dari konten artikel pada website.

Ingat Ini Saat Menulis Heading HTML: Aturan Tag Heading

Bagaimanakah urutan yang baik saat kita menulis heading HTML? Bolehkah kita menggunakan kumpulan tag HTML dan contohnya secara sembarangan alias sesuka hati kita? Mungkin ada orang yang menggunakan heading kecil seperti heading 5 untuk judul awal, kemudian memakai heading yang lebih besar seperti heading 2 untuk sub judul.

Sebenarnya tidak ada aturan pasti yang melarang bahwa Anda tidak boleh berkreasi seperti contoh di atas. Namun biasanya, menggunakan kumpulan tag HTML dan contohnya secara sembarangan dinilai tidak bagus menurut perhitungan SEO. Besar kemungkinan website yang mengaplikasikan heading secara sembarangan justru akan mendapatkan ranking yang kecil dari SEO.

Lantas bagaimanakah aturan penulisan heading tag HTML yang baik? Jawabannya sederhana. Anda hanya perlu menulis setiap judul mengikuti urutan levelnya. Semisal dari pertama, Anda menulis judul yang paling besar menggunakan heading 1, kemudian diikuti dengan heading 2 untuk judul berikutnya, heading 3 untuk sub judul, heading 4 untuk sub judul dari sub judul, dan seterusnya sesuai kebutuhan.

Anda pun tidak harus menggunakan heading 1 sampai heading 6 dalam website. Jika website dan konten Anda sudah cukup hanya sampai di heading 3, maka Anda bisa berhenti sampai di sana saja. Sering kali pengelola website hanya menggunakan heading 1 sampai heading 3 atau 4 saja. Masih jarang ada orang yang menggunakan heading sampai level 5 dan 6.

Selain urutan susunan, ada pula aturan lain tentang kumpulan tag HTML dan contohnya. Aturan tersebut adalah mengenai atribut. Dalam bahasa pemrograman HTML, Anda seringkali akan bersinggungan dengan atribut, bukan? Hamun heading tidak mempunyai atribut khusus. Penulisan heading biasanya hanya akan memakai atribut globel.

Kumpulan tag HTML dan contohnya berdasarkan atribut antara lain:

Title untuk menambahkan informasi;
Style untuk memberi kode ke CSS;
Id untuk membuat nama yang unik pada Id (dipakai oleh JavaScript, link dan CSS);
Class untuk menamani class CSS.

Praktek Membuat Heading dengan HTML
Pada bagian ini, kami akan memberikan contoh singkat terkait praktek membuat heading website di HTML. Seperti yang sudah sempat disinggung sebelumnya, heading pada HTML dapat dibuat memakai tag <h2> sampai <h6>. Jika disusun pada struktur coding HTML, maka susunan heading adalah sebagai berikut:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Percobaan Membuat Tag Heading HTML</title>
</head>
<body>
<h2>Heading Judul 1</h2>
<h2>Heading Judul 2</h2>
<h3>Heading Judul3</h3>
<h4>Heading Judul 4</h4>
<h5>Heading Judul 5</h5>
<h6>Heading Judul 6</h6>
</body>
</html>

Untuk mengaplikasikannya pada artikel utuh web yang sudah berisi teks konten, Anda cukup menuangkannya ke dalam struktur berikut:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Percobaan Membuat Tag Heading HTML</title>
</head>
<body>
<h2>Tutorial Heading di HTML Terlengkap</h2>
<p>
Tutorial seri belajar ngoding kali ini akan membahas tentang cara membuat heading di HTML. Ada 6 kumpulan tag HTML dan contohnya yakni heading 1, heading 2, heading 3, heading 4, heading 5 dan heading 6.
</p>
<h2>Cara Membuat Sub Judul</h2>
<p>
Heading 1 adalah judul utama dari artikel. Sub judul diawali dari heading 2, 3, 4, 5 dan sampai heading 6. Anda bebas memakai heading sebanyak keperluan.
</p>
</body>
</html>

Demikianlah pembahasan kali ini tentang kumpulan tag HTML dan contohnya. Yuk mulai gunakan tag heading pada setiap tulisan Anda agar artikel website bisa lebih mudah dideteksi dan masuk ke dalam ranking tinggi di SEO! Sekali lagi ingat, gunakan heading hanya untuk membuat judul dan sub judul saja ya. Jangan digunakan untuk sekadar membuat tulisan besar. Sebab, untuk membuat tulisan besar biasa, maka kita akan menggunakan metode lain yang tepat yaitu CSS.

Terima kasih sudah mengikuti artikel edisi kali ini sampai di sini! Temukan lebih banyak artikel menarik yang lebih informatif hanya di Appkey.id. Sampai jumpa!

Jasa Pembuatan Aplikasi, Website dan Internet Marketing | PT APPKEY
PT APPKEY adalah perusahaan IT yang khusus membuat aplikasi Android, iOS dan mengembangkan sistem website. Kami juga memiliki pengetahuan dan wawasan dalam menjalankan pemasaran online sehingga diharapkan dapat membantu menyelesaikan permasalahan Anda.

Apa perintah HTML untuk membuat judul?

Judul pada HTML dapat kita buat dengan tag <h1> sampai <h6> . Tag <h1> digunakan pada judul level pertama. Lalu tag lainnya digunakan pada sub heading atau level berikutnya. Masing-masing judul akan ditampilkan dengan ukuran teks yang bebeda.

Tag tag HTML apa saja?

Berikut ini daftar tag yang wajib ada di HTML:.

<! DOCTYPE html> — untuk deklarasi type dokumen;.

<html> — tag utama dalam HTML;.

<head> — untuk bagian kepala dari dokumen;.

<title> — untuk judul web;.

<body> — untuk bagian body dari dokumen..

Apa fungsi tag h1 h1?

Tag H1 merupakan tag terbesar dan terpenting di setiap halaman situs web. Tag ini dapat digunakan untuk memperkenalkan konten yang ada di halaman itu secara keseluruhan, yaitu untuk memberi nama topik yang ada atau untuk sekadar mencerminkan nama halaman itu sendiri.

Tag elemen HTML Apakah yang di gunakan untuk membuat judul sebuah halaman dari website?

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.