HTML dasar:Tag Element Attribute
Apa itu Tag?
HTML adalah sebuah markup yang membentuk struktur tubuh halaman web. HTML tersusun dari berbagai element. Dan tiap element, selalu ditulis dengan sebuah tag pembuka <nama-tag> dan tag penutup </nama-tag>. Meskipun ada beberapa tag yang hanya perlu dibuka, dan tidak perlu ditutup.
Jadi, tag adalah teks yang berada di antara tanda <..> dan juga </...>.
Dan, tag di dalam HTML bertugas untuk membuat atau membangun sebuah elemen [1].
Di antara contoh-contoh tag dalam HTML:
<html> - elemen root dari dokumen HTML
<head> - untuk mendefinisikan meta data, judul, styles, dan lain-lain dari dokumen HTML
<body> - untuk mendefinisikan body dari dokumen HTML (body adalah bagian yang terlihat oleh user)
<p> - untuk membuat elemen paragraf
<a> - untuk membuat elemen link
<button> - untuk membuat elemen tombol
Apa itu Elemen?
Elemen dalam HTML adalah sebuah komponen HTML. Elemen juga bisa dikatakan sebagai node atau simpul yang membentuk hirarki pohon dokumen HTML [2].
Bayangkan kita memiliki dua buah tombol html seperti berikut:
Tombol Kiri Tombol Kanan
Berarti, kita memiliki 2 buah elemen HTML berupa tombol.
Cara membuatnya pun dengan menuliskan dua buah tag dengan nama <button>.
Sebagaimana dalam kode berikut:
<!DOCTYPE html>
<html>
<head>
<title>Elemen Pada HTML</title>
</head>
<body>
<button>Tombol Kiri</button>
<button>Tombol Kanan</button>
</body>
</html>
Seperti yang telah dijelaskan di atas, tiap elemen HTML akan membentuk satu node (simpul) tersendiri dalam susuan hirarki HTML.
NB: elemen <head> dan turunannya adalah elemen yang tidak tampak secara langsung pada user. Berbeda dengan elemen <body> yang mana hasilkan akan langsung terlihat oleh user.
Apa itu Atribut?
Selain dua unsur penting di atas HTML juga memiliki sebuah istilah lain yang tidak kalah penting, yaitu atribut.
Atribut adalah sebuah tambahan argumen atau aksesoris terhadap suatu elemen HTML. Atribut hanya ditulis pada tag pembuka. Dan atribut berfungsi untuk menambahkan informasi tambahan pada suatu elemen HTML [3].
Contoh:
<img src="https://tomidev.com/images/logo full.png">
Kode di atas akan menampilkan sebuah gambar berikut:
Penjelasan
Tag <img> bertugas untuk membuat elemen gambar
Tag <img> termasuk tag yang hanya perlu pembuka, tanpa tag penutup
Tag <img> memiliki atribut src, height dan width
Atribut src berfungsi untuk menambahkan informasi url gambar yang akan ditampilkan oleh elemen <img>
Atribut height memberikan informasi tinggi gambar
Atribut width memberikan informasi lebar gambar
Kesimpulan
Setelah melakukan beberapa percobaan di atas, kita bisa memetik beberapa kesimpulan kunci. Di antaranya:
HTML adalah dokumen yang tersusun dari berbagai macam elemen
Elemen didefinisikan dengan menuliskan tag pembuka dan tag penutup (kecuali beberapa elemen yang tidak perlu tag penutup)
Tag adalah apa yang ada di antara tanda <...> dan </...>
Elemen bisa memiliki atribut, yang berfungsi untuk memberikan informasi tambahan pada suatu elemen
:strip_icc():format(jpeg)/kly-media-production/medias/2998955/original/042015100_1576584434-Doa_HL1.jpg)
