Belajar Html : Mengenal Tag HTML

Belajar Html : Mengenal Tag HTML

Belajar Html : Mengenal Tag HTML

Ada 3 komponen penting yang menyusun kode HTML, yakni, Tag, Elemen, dan Atribut. Ketiga komponen tersebut saling terikat dan memiliki fungsinya masing-masing.

Contoh saat kamu mencoba menggunakan komponen Elemen, kamu pasti akan menggunakan komponen Tag. 

Khusus untuk artikel ini, @Agata hanya akan membahas tentang Tag HTML, untuk Elemen dan Atribut akan dibahas pada artikel berikutnya :)

Pengertian Tag

Tag adalah elemen paling penting dalam html, karna jika tanpa Tag, elemen dan atribut tidak akan bekerja dengan semestinya.

Secara sederhana, komponen Tag dalam HTML dapat diartikan sebagai sebuah tanda khusus yang yang berisi sekumpulan informasi yang nantinya akan diterjemahkan oleh browser.

Nantinya komponen Tag akan diidentifikasi oleh browser, apakah informasi didalam Tag berupa paragraf, judul, link , heading, list atau informasi lainya.

Komponen Tag dibagi menjadi dua jenis, yakni 

1. Komponen Tag berpasangan 

Komponen Tag berpasangan merupakan komponen Tag yang memakai tanda Tag pembuka ("<...>") dan tanda Tag penutup ("</...>")

Tanda pembuka ialah tanda Tag yang berada diawal, sebelum isi Tag. Contoh tag pembuka <b>, <i>, <head>, <body> dan lainya.

Tanda Tag penutup merupakan tanda Tag pembuka yang diberi tanda slash ("/") diawal huruf, contoh </b>, </i>, </head>, </body>

Contoh penerapan

<b> Waifu_idaman </b>

#Keterangan :
<b> = Tag Pembuka 
Waifu_idaman = isi Tag
<b> = Tag penutup

2. Komponen Tag jomblo alias self-closing tags 

Seperti namanya "komponen Tag jomblo". Komponen Tag ini dapat berdiri sendirian dan tanpa memerlukan Tag penutup.

Contoh self-closing tags

#Contoh self-closing tags
<br />
<hr />
<img />
<input />
<embed />

Beberapa Tag HTML berserta fungsinya

Syntax Keterangan
<!DOCTYPE> Menentukan jenis dokumen
<title> Menentukan judul halaman
<body> Penanda bagian body halaman
<p> Penanda sebuah paragraf 
<b> Membuat tulisan menjadi bold
<h1>...<h6> Jenis ukuran font
<img> Penanda sebuah gambar
<input> Membuat penanda input

Tips penulisan Tag HTML

Sitidaknya ada 3 peraturan dasar dalam penulisan Tag dalam Html, yakni

1. Penggunaan huruf kapital 

Html bukanlah bahasa yang case-sensitif, artinya perintah <b> akan dianggap sama dengan perintah <B>.

Ya...., memang itu terdengar bagus, kita jadi tidak perlu memikirkan masalah apabila tidak sengaja memakai huruf kapital, namun dalam prakteknya penggunaan huruf kapital dapat memperlambat waktu pengetikanmu dan juga menurut @Agata, kode yang ditulis menggunakan huruf kecil jauh lebih rapi dan aestetic :)

Coba perhatikan contoh dibawah :

#Contoh_1
<p> Tidur </p>
<b> Makan </b>
<body> Tidur </body>

#Contoh_2
<P> Tidur </P>
<B> Makan </B>
<BODY> Tidur </BODY>

Menurutmu bagusan Contoh_1 atau Contoh_2?

Bagusan contoh_1 kan :)

2. Pastikan urutan Tag penutup harus benar 

Penulisan Tag penutup yang benar ialah, menutup Tag pembuka pertama, diakhir dan menutup tag pembuka terakhir, diawal. Binggung???? 

Contoh 

#Benar
<p><i><u>Agata</u></i></p>

#Salah
<p><i><u>Agata</p></i></u>

Keterangan

Tag pembuka pertama <p> harus ditutup diakhir, sedangkan tag pembuka terakhir <u> harus ditutup pertama.

Meskipun kamu juga dapat memakai cara yang salah, namun penggunaan cara yang benar jauh lebih direkomendasikan untuk menghindari error atau bahkan tag penutup yang dobel.

3. Jangan sampai lupa memasukan komponen Tag HTML inti

Kan ngk lucu, udah capek-capek ngetik ratusan baris kode eh malah error gara gara lupa masukin komponen Tag inti.

Oleh karna itu, jangan sampai lupa untuk memasukan komponen inti Tag html. Komponen Tag html wajib hanya ada beberapa, yakni :

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>
  4. <title> 
  5. <body> 

Okwh, pembahasan tentang Tag html @Agata akhiri. Oh ya...., apabila ada pertanyaan, bisa langsung ditanyakan lewat kolom komentar dibawah.


Baca Juga
SHARE
Subscribe to get free updates

Related Posts

Posting Komentar

Iklan Tengah Post