Apa Itu Tag HTML?
Tag merupakan bagian penting yang wajib diketahui saat membuat halaman HTML. Karena saat membuat halaman HTML, kita pasti akan sering menulis tag.
Oleh karena itu, mari kita bahas.
Apa itu tag?
Tag apa saja yang sering digunakan?
Bagaimana cara menulis tag yang benar?
Mari kita bahas satu per satu.
Apa Itu Tag?
Tag HTML adalah bagian dari bahasa markup yang digunakan untuk menunjukkan awal dan akhir elemen.
Sebagai bagian dari elemen HTML, tag membantu browser mengubah dokumen HTML menjadi halaman web.
Misalnya, jika kita menulis tag <p> browser akan memperlakukan konten di dalam tag tersebut sebagai paragraf, bukan gambar, video, atau yang lainnya.
Mari kita lihat contoh berikut:
<p>hello world</p>
<p>- tag pembuka.hello world- konten.</p>(dengan garis miring terbalik) - tag penutup.
Tag HTML tidak ditampilkan kepada pengunjung yang ditampilkan hanya konten yang telah ditafsirkan browser sesuai dengan tag yang membungkusnya.
Misalnya contoh diatas, browser akan menafsirkan tulisan atau konten hello world sebagai paragraf, tulisan <p> dan </p> tidak ditampilkan.
Tag yang Membutuhkan Penutup
Banyak tag, meskipun tidak semua, memerlukan tag penutup untuk membungkus konten.
Diantaranya:
<p>- paragraf.<table>- tabel.<form>- formulir.
Meskipun dapat ditulis tanpa tag penutup, kita disarankan tetap menulis tag penutup.
Tag yang Tidak Membutuhkan Penutup
Tag yang tidak memiliki penutup diantaranya:
<br>- untuk membuat baris baru.<hr>- untuk membuat garis horizontal.<img>- untuk gambar.
Kadang tag yang tidak membutuhkan penutup ditulis dengan garis miring terbalik diakhir, misalnya <br />, ini tetap valid HTML5.
Tag HTML yang Sering Digunakan
Ada lebih dari 100 tag yang bisa kita gunakan, jumlahnya tidak tentu.
Ketika rilis HTML versi terbaru, jumlahnya bisa berubah, bisa bertambah bisa berkurang.
Di HTML5 misalnya, tag <acronym> diganti dengan <abbr>. Ada juga tag yang tidak lagi didukung tanpa pengganti, <basefont> misalnya.
Jika kita memaksakan menggunakan tag yang tidak lagi didukung di HTML5.
Halaman kita masih berjalan normal, tidak akan error, tapi dianggap tidak valid HTML5.
Kita tidak perlu menghafal semuanya, untuk saat ini kita hanya perlu mengetahui tag-tag yang sering digunkaan saja.
Hampir semua halaman web yang ada di internet menggunakan tag berikut:
| Tag | Keterangan |
|---|---|
<!DOCTYPE html> | untuk menentukan jenis dokumen |
<html> | akar dari dokumen HTML |
<head> | wadah metadata |
<title> | judul untuk mesin dan tab browser |
<body> | wadah isi dokumen HTML |
<h1> sampai <h6> | judul dan sub-judul |
<p> | paragraf |
Saat membuat halaman HTML pastikan Anda menulis tag <!DOCTYPE html>, <html>, <head>, dan <body>.
Jika tidak, browser akan mengoreksi dan menambahkannya secara otomatis.
Cara Menulis Tag HTML dengan Benar
Kita bisa menulis tag HTML sesuai keinginan, bisa menggunakan huruf besar, bahkan menulis tag yang membutuhkan penutup tanpa penutup.
Tapi itu bukan praktik terbaik, halaman kita dapat memiliki perilaku tak terduga.
Oleh karena itu, mari kita pelajari konvensi penamaan tag HTML agar browser dapat menafsirkan halaman kita dengan mulus.
1. Gunakan Huruf Kecil
Kita bisa menulis tag HTML menggunakan huruf besar maupun kecil. Mau pakai huruf besar atau kecil, halaman kita akan berjalan normal.
Ini kebiasaan, bukan kewajiban.
Tapi disarankan menggunakan huruf kecil semua, selain mudah diketik, kode terlihat lebih rapi.
Contoh bagus:
<body>
<h1>Belajar HTML</h1>
<p>Saya sedang belajar HTML.</p>
</body>
Contoh buruk:
<BODY>
<H1>Belajar HTML</H1>
<P>Saya sedang belajar HTML.</P>
</BODY>
Khusus untuk <!DOCTYPE html> ditulis menggunakan huruf besar, kecuali atribut html di dalam tag tersebut.
2. Gunakan Tag Penutup
Ada tag HTML yang membutuhkan penutup, ada yang tidak.
Kita bisa menulis tag yang membutuhkan penutup tanpa penutup, browser akan mengoreksi dan menambahkan tag penutup secara otomatis.
Meskipun halaman kita tetap berjalan normal, ini tidak disarankan.
Selau tulis tag penutup untuk tag yang membutuhkan penutup.
Contoh bagus:
<p>hello world</p>
Contoh buruk:
<p>hello world
3. Pastikan Struktur Tag Bersarang Berurutan
Saat membuat halaman HTML, kita akan sering membuat tag bersarang. Kita biasanya menulis tag di dalam tag.
Seringkali tag bersarang tidak ditulis dengan struktur yang benar dan berurutan. Ini biasanya terjadi ketika kita menulis tag bersarang dalam satu baris.
Meski begitu, halaman kita akan berjalan normal karena browser akan mengoreksi secara otomatis.
Tapi, kita disarankan untuk tetap menulis tag bersarang dengan struktur yang benar.
Contoh bagus:
Karena tag <p> yang paling pertama, kita harus menutupnya di akhir setelah penutup tag lain yang ada di dalam.
Begitu juga dengan tag lain yang ada di dalamnya.
<p>
<strong>
<em>
hello world
</em>
</strong>
</p>
Contoh buruk:
Ini adalah contoh yang salah karena tag penutup </em> ditulis setelah penutup </strong>, padahal tag pembukanya ditulis setelah tag pembuka <strong>.
<p>
<strong>
<em>
hello world
</strong>
</em>
</p>
Jika Anda menulis tag bersarang dalam satu baris, dan tidak yakin apakah strukturnya benar atau tidak.
Coba pecah menjadi beberapa baris seperti contoh di atas agar strukturnya bisa dilihat dengan jelas.