Wednesday 8 July 2015

Macam Macam Tag HTML dan Fungsinya (Part 3)

Macam Macam Tag HTML dan Fungsinya


Macam Macam Tag HTML dan Fungsinya - Tag HTML Utama merupakan tag yang sangat penting di HTML. Tag HTML Utama akan sering anda gunakan saat anda menulis artikel di website anda. Seorang webmaster harus memahami betul dengan Tag HTML Utama karena tanpa tag ini, anda akan kesulitan untuk menulis artikel yang berkualitas. Sebelum kita melanjutkan tutorial cara menggunakanya, saya sarankan anda sudah mengetahui Cara Membuat HTML Menggunakan Notepad dan sudah mengerti Pengertian Tag Elemen dan Atribut di HTML.

Macam Macam Tag HTML dan Fungsinya

Judul (Tag Heading)

Untuk membuat Judul, anda memerlukan tag <h1> sampai dengan <h6>. <h1> merupakan tag judul yang paling besar dan <h2> sampai dengan <h6> merupakan tag terkecil (sub Judul). Semakin besar tag yang digunakan, maka semakin kecil pula Heading yang akan muncul. Berikut adalah contoh kode Tag Heading di HTML:
<h1>Judul Heading h1</h1>
<h2>Judul Heading h2</h2>
<h3>Judul Heading h3</h3>
<h4>Judul Heading h4</h4>
<h5>Judul Heading h5</h5>
<h6>Judul Heading h6</h6>
Coba anda praktekan menggunakan notepad, kemudian simpan dengan nama “Judul.html” kemudian ubah save as typenya menjadi all files. Selanjutnya, buka file yang telah anda simpan dengan cara klik 2x, maka akan muncul seperti pada gambar di bawah ini:  
Judul (Tag Heading)


Paragraf

Untuk membuat paragraf di dalam HTML, anda akan menggunakan tag <p>Isi Paragraf</p>. Berikut adalah contoh kode Paragraf di HTML:
<p>Hello HTML!, Ini adalah sebuah paragraf</p>
<p>Belajar HTML sangatlah menyenangkan</p>
Paragraf hampir sama seperti tag Heading yaitu sama - sama menambahkan baris kosong sebelum dan sesudah Paragraf. 

Tag HTML Penutup

Kode HTML harus di awali dengan Tag Pembuka dan Tag Penutup. Kenapa setiap Tag yang saya tulis harus di kasih Tag Penutup? Karena jika anda tidak memberikan Tag Penutup di kode Tag yang telah anda tulis, maka browser akan terus membaca Tag yang telah anda tulis sampai menemukan Tag Penutup. Jika browser tidak menemukan Tag Penutup, maka browser akan terus membaca Tag tersebut sampai akhir dari kode HTML anda. Sudah mengerti kan? Sebagai contoh saat anda ingin membuat kalimat seperti ini di HTML: “Ini adalah tulisan bercetak tebal dan ini adalah tulisan bercetak miring” kita akan mencobanya dengan kode di bawah ini tanpa Tag Penutup.
<p>Ini adalah tulisan bercetak tebal <b>dan ini adalah tulisan bercetak <i>miring
Maka hasilnya akan seperti pada gambar di bawah ini

Tag HTML Penutup
Lihatlah baik - baik, browser akan membaca fungsi tag <b> sampai pada akhir kode html anda (yaitu tulisan miring). 

Ganti Baris

Kita dapat menggunakan tag <br /> untuk membuat baris baru. Ingat baik - baik, tag <br /> merupakan sebuah tag yang tidak memiliki tag pasangan (tag pembuka dan tag penutup). Saran saya, jangan pernah menuliskan tag Ganti Baris seperti ini <br>, karena tag tersebut dapat melanggar Peraturan Dasar Dalam Penulisan Tag, dimana semua Tag harus ditutup.


Menuliskan Komentar di HTML

Tag Komentar berfungsi untuk membuat Komentar di sebuah kode HTML anda. Tag Komentar ini sangat bermanfaat sekali jika suatu saat anda lupa dengan fungsi kode HTML yang telah anda tulis. Tag Komentar tidak akan ditampilkan di browser. Maka dari itu, Tag ini sangat membantu sekali untuk mengingat kembali fungsi dari kode HTML yang telah anda buat. Berikut adalah contoh Penulisan Tag Komentar di dalam HTML:
<!-- Ini adalah contoh sebuah Tag Komentar di dalam HTML -->

Lihatlah baik - baik penulisanya. Tag Komentar dimulai dengan tanda kurung siku buka yang diikuti dengan tanda seru dan ditutup dengan tanda kurung siku tutup tanpa menggunakan tanda seru.
Beberapa hal penting yang perlu anda ingat di dalam kode HTML:
  • Setiap Tag HTML memiliki sebuah elemen seperti tag body, h1, p, br.
  • Tag Pembuka adalah nama yang ditulis di antara tanda kurung siku (contoh: <p>).
  • Tag Penutup adalah nama yang diawali dengan tanda kurung siku buka kemudian diikuti dengan tanda garis miring dan di akhiri dengan tanda kurung siku tutup (contoh: </p>).


Semoga tutorial dan tips di atas dapat membantu anda supaya lebih memahami kode script HTML. Jika anda masih kesulitan atau belum memahami dengan tutorial di atas, silahkan anda bisa bertanya di kolom komentar yang ada di bawah artikel ini. Terima kasih anda sudah mengunjungi situs in dan sudah membaca artikel ini.