Pengertian Tag, Element dan Atribut HTML

Assalamu'alaikum Wr. Wb.

A). Pendahluan

Bertemu lagi di blog saya, disini saya akan menjelaskan kalian tentang Struktur dasar HTML, pengertian Tag, Elemen dan Atribut dalam HTML, kalian belum mengerti apa itu Tag, Elemen dan Atribut beserta fungsinya? lihat blog saya dibawah ini.

B). Latar Belakang

Menjelaskan mengenai struktur dasar HTML, pengertian Tag, Element dan Atribut dalam HTML, kalian belum mengerti apa itu Tag, Elemen dan Atribut beserta fungsinya

C). Maksud & Tujuan

Menjelaskan dan mengenal lebih dalam lagi tentang struktur dasar HTML

D). Pembahasan

Struktur Dasar dari HTML yaitu:

<html>
<head>
<title>Disini Judul Dokumen HTML</title>
</head>
<body>
Disini penulisan informasi Web
</body>
</html>

1. Pengertian Tag HTML

Tag adalah teks khusus (bahasa markup) berupa dua karakter "<"dan">", sebagai contoh <body> adalah tag dengan nama body. Sebagai sebuah bahasa markup, HTML membutuhkan cara untuk memberitahu web browser untuk apa fungsi sebuah text. Apakah text itu ditulis sebagai sebuah paragraf, list, atau sebagai link? Dalam HTML, tanda ini dikenal dengan istilah tag.

Hampir semua tag di dalam HTML ditulis secara berpasangan, yakni tag pembuka dan tag penutup, dimana objek yang dikenai perintah tag berada di antara tag pembuka dan tag penutup ini. Objek disini dapat berupa text, gambar, maupun video. Penulisan tag berada di antara dua kurung siku: “<” dan “>”.

Berikut adalah format dasar penulisan tag HTML:

<tag pembuka>objek yang dikenali perintah tag</tag_penutup>

Sebagai contoh, perhatikan kode HTML berikut :

<p>ini adalah sebuah paragraf</p>

<p> adalah tag pembuka, dalam contoh ini p adalah tag untuk paragraf.

 adalah tag penutup paragraf. Perbedaannya dengan tag pembuka terletak dari tanda backslash(/)

Jika kita lupa memberikan penutup tag, maka browser akan “memaafkan” hal ini dan tetap menampilkan hasilnya seolah-olah kita menuliskan tag penutup. Walaupun hal ini memudahkan kita, namun tidak disarankan.

Contoh lainnya, jika kita ingin membuat suatu text dalam sebuah paragraf di tulis tebal atau miring, di dalam HTML dapat ditulis sebagai berikut:

1. ini adalah sebuah paragraf. Hanya kumpulan beberapa kalimat

2. Paragraf ini terdiri dari 3 kalimat

Hasil dari kode HTML diatas diterjemahkan oleh browser menjadi:

“Ini adalah sebuah paragraf. Tidak lain dari kumpulan beberapa kalimat. Paragraf ini terdiri dari 3 kalimat.”

Tag  pada kode HTML diatas memberikan perintah kepada browser untuk menampilkan text secara garis miring (i, singkatan dari italic), dan tag  untuk menebalkan tulisan (b, singkatan dari bold).

Terdapat pengecualian beberapa tag yang tidak berpasangan, seperti   untuk break(pindah baris) atau <hr> untuk horizontal line (garis horizontal). Tag ini dikenal juga dengan sebutan self closing tag atau void tag, untuk penulisannya bisa ditulis dengan , maupun .

HTML tidak case-sensitif, dalam artian penulisan  dianggap sama dengan . Pada awal kemunculan HTML, programmer web umumnya menggunakan huruf besar untuk seluruh tag agar membedakan dengan text yang berupa isi dari web. Namun varian HTML, xHTML mewajibkan huruf kecil untuk semua tag.Dalam HTML5, aturan ini kembali tidak diharuskan. Akan tetapi kebiasaan web programmer saat ini adalah menggunakan huruf kecil untuk seluruh tag.

2. Pengertian Element HTML

Elemen adalah isi dari tag yang berada diantara tag pembuka dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana :

<title> Ini adalah tag pembuka judul dari dokumen HTML
Disini Judul Dokumen HTML ini adalah isi judul dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML.

Contoh penulisan HTML yang benar:

Pada contoh diatas, “Ini adalah sebuah paragraf” merupakan elemen dari tag .

Elemen tidak hanya berisi text, namun juga bisa tag lain.

* Contoh penulisan tag-tag yang benar:

................

* Contoh penulisan tag-tag yang salah:

................

a). Element HTML
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah HTML.

Sintaks:
<html>
..........
</html>

b). Element HEAD
Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak di antara tag <html> dan tag </html>.

Sintaks:
<head>
...........
</head>

c). Element TITLE
Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.

Sintaks:
<title>
.........
</title>

d). Element BODY
Element ini untuk menampilkan isi dari dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.

Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>

Attribute text memberikan warna pada teks, bgcolor memberikan warna pada latar belakang dokumen HTML, background memberikan latar belakang dokumen HTML dalam bentuk gambar, link memberikan nilai warna untuk link, alink memberikan warna untuk link yang sedang aktif, vlink memberikan warna untuk link yang telah dikunjungi.
Jika attribute bgcolor dan background keduanya dispesifikasikan maka attribute background yang akan digunakan, akan tetapi jika nilai attribute background (gambar) tidak ditemukan pada dokumen HTML maka attribute bgcolor yang akan digunakan.

3. Pengertian Atribut HTML
Attribute mendefinisikan property dari suatu element HTML, yang terdiri dari nama dan nilai. Penulisannya adalah sebagai berikut:

<TAG
nama-attr="nilai-attr"
nama-attr="nilai-attr"
.................
>
.................

</TAG>

Secara umum, nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latar belakang halaman web menjadi hitam, penulisannya adalah:

<body bgcolor="black" text="yellow">

E). Referensi

Cukup sekian informasi yang dapat saya berikan pada hari ini, semoga bisa bermanfaat dan berguna buat orang lain. Jika ada kesalahan kata saya mohon maaf. Terima kasih telah mengunjungi blog saya, dan jangan lupa untuk mengikuti dan membaca selalu postingan di blog saya yang saat ini masih biasa-biasa saja.

~ Wassalamu'alaikum Wr. Wb. ~