DeretCode|

Tips, Trik dan Tutorial
Seputar IT, Coding, Internet Marketing, Keahlian, Pendidikan, Hobi Dan Lainnya
Night :

Tutorial Lengkap Belajar Html # Mengenal Tag-Tag Html

advertisement
Mengenal Tag-Tag Html

Sebelumnya kita telah belajar apa itu html dan membuat kode html dasar.
Pada tutorial html tahap kedua ini, kita akan belajar mengenal tag-tag yang ada di dalam html agar nantinya kita tidak salah dalam menggunakan tag tersebut.
Tidak perlu kita hafal semuanya karena memang ada beberapa tag yang jarang digunakan atau bisa di gantikan dengan tag lain penggunaanya.

Yuk kita mulai,

Apa Itu Tag?

Tag adalah sebuah markup atau penanda batas awal dan akhir dari sebuah elemen html.
Batas awal di tandai dengan <nama tag> dan batas akhir di tandai dengan </nama tag>.
Penjelasan tag dan elemen
Namun ada beberapa tag yang tidak memiliki konten dan tag penutup,
Tag tanpa isi
Dan terkadang tag juga berisi atribut seperti id, class, name dan lainnya,
Atribut tag dan isi atribut
Sampai disini semoga teman-teman semua paham apa itu tag.

Jenis-Jenis Tag Html

Pada kesempatan kali kita akan belajar mengenali tag-tag html. Tag-tag tersebut di kelompokan berdasarkan fungsi dan kegunaannya.
Berikut adalah tag-tagnya

Tag Wajib

Tag wajib adalah tag dasar yang harus di tulis ketika membuat file html.
Tag Keterangan
<html> Digunakan untuk membuat root dokumen html
<head> Digunanak untuk meletkan informasi halaman web
<body> Digunakan untuk meletakan konten yang akan di tampilkan di web browser

Tag Struktur

Tag struktur adalah tag yang digunakan untun menyusun sebuah halaman web
Tag Keterangan Sering digunakan
<a> Digunakan untuk membuat hyperlink
<article> Digunanak untuk membuat artikel
<aside> Biasanya di gunakan untuk sidebar atau menunjukan bahwa elemen tersebut bukan elemen utama
<br> Digunakan untuk membuat baris baru
<details> Digunakan untuk membuat rincian informasi
<div> Digunakan untuk membuat divisi bagian dari dokumen html
<h1> - <h6> Digunakan untuk membuat heading (bagian dari seo)
<header> Digunakan untuk membuat bagian dari header halaman
<hgroup> Digunakan untuk membuat header group
<hr> Digunakan untuk membuat separator horizontal
<nav> Digunakan untuk membuat navigasi menu halaman
<footer> Digunakan untuk membuat footer halaman
<p> Digunakan untuk membuat paragraf
<section> Digunakan untuk membuat bagian-bagian dari halaman web
<span> Digunakan untuk baris tulisan
<summary> Digunakan untuk membuat ringkasan dari elemen details

Tag Meta

Tag meta adalah tag yang digunakan untuk mendeskripsikan halaman web dan di tempatkan didalam tag head
Tag Keterangan Sering digunakan
<base> Digunanak untuk membuat base url yang akan di gunakan untuk setiap link yang ada di halaman
<basefont> Digunanak untuk memuat font halaman
<link> Digunakan untuk membuat mengimport css, font dan lainnya
<meta> Digunakan untuk memuat informasi halaman
<style> Digunakan untuk membuat internal css
<title> Digunakan untuk memuat judul informasi halaman

Tag Form

Tag form adalah tag yang digunakan untuk membuat formulir inputan
Tag Keterangan Sering digunakan
<form> Digunakan untuk membuat form area
<input> Digunanak untuk membuat inputan user (text, checkbox, radio botton dll)
<textarea> Digunakan untuk membuat inputan berupa teks baris
<select> Digunakan untuk membuat daftar pilihan
<option> Digunakan untuk membuat item dari tag <select>
<label> Digunakan untuk membuat label dari form input
<button> Digunakan untuk membuat tombol
<datalist> Digunakan untuk membuat opsi pilihan dari tag <input>
<fieldset> Digunakan untuk membuat group pada field.
<keygen> Digunakan untuk membuat kunci enkripso
<meter> Digunakan untuk membuat inputan skala
<legend> Digunakan untuk membuat judul dari tag <fieldset>
<optgroup> Digunakan untuk membuat group pada tag <option>

Tag Teks Format

Tag format adalah tag yang digunakan untuk memformat teks atau isi dari element, seperti menebalkan, membuat garis bawah, teks miring dan lainnya.
Tag Keterangan Sering digunakan
<abbr> Digunakan untuk menentukan bentuk singkat dari kata atau frasa yang lebih panjang
<acronym> Digunakan untuk membuat singkatan(hampir sama seperti abbr)
<address> Digunakan untuk memuat teks alamat
<b> Digunakan untuk menebalkan teks
<bdi> Merupakan teks yang diisolasi dari sekitarnya untuk keperluan pemformatan teks dua arah
<bdo> Digunakan untuk mengganti arah teks
<big> Digunakan untuk menampilkan teks dengan ukuran besar
<blockquote> Digunakan untuk membuat kutipan
<center> Digunakan untuk membuat teks di tengah 
<cite> Digunakan untuk menunjukkan kutipan atau referensi ke sumber lain (bentuk miring).
<code> Digunakan untuk meletakan kode programan
<del> Digunakan untuk menentukan blok teks yang dihapus
<dfn> Digunakan untuk mebuat definisi
<em> Digunakan untuk membuat teks yang dianggap penting 
<font> Digunakan untuk mengatur font teks
<i> Digunakan untuk membuat icon dan teks miring
<ins> Digunakan untuk menentukan blok teks yang talah dimasukan kedalam dokumen
<kbd> Digunakan untuk menentukan teks inputan dari keyboard
<mark> Digunakan untuk membuat highligt tejs
<output> Digunakan untuk menampilkan hasil dari kalkulasi
<pre> Digunakan untuk membuat blok teks
<progress> Digunakan untuk menampilkan progress
<q> Digunakan untuk menampilkan kutipan
<rp> Digunakan untuk memberikan tanda kurung mundur untuk browser yang tidak mendukung anotasi ruby.
<rt> Digunakan untuk menentukan pelafalan karakter yang disajikan dalam penjelasan ruby.
<ruby> Digunakan untuk membuat anotasi bahasa pemrograman ruby
<s> Digunakan untuk menampilkan teks yang dicoret
<samp> Digunakan untuk membuat teks sampel
<small> Digunakan untuk membuat teks dengan ukuran kecil
<strike> Digunakan untuk menampilkan teks dengan gaya ketat
<strong> Digunakan untuk membuat teks yang tebal
<sub> Digunakan untuk membuat sub teks (contoh: H2O)
<sup> Digunakan untuk mendefinisikan teks pangkat (contoh: E=mc2)
<tt> Digunakan untuk membuat teks style teletipe
<u> Digunakan untuk membuat teks bergaris bawah
<var> Digunakan untuk menentukan variabel
<wbr> Digunakan untuk membuat breakline ketika diperlukan

Tag List

Tag list adalah tag yang digunakan untuk membuat sebuah daftar
Tag Keterangan Sering digunakan
<dd> Digunakan untuk membuat penjelasan dari list item
<dl> Digunakan untuk membuat deskripsi list
<dt> Digunakan untuk membuat definisi untuk item dari <dl>
<li> Digunakan untuk membuat item dari <ol> atau <ul>
<ol> Digunakan untuk membuat list countable
<ul> Digunakan untuk membuat list uncountable

Tag Tabel

Tag tabel adalah tag yang digunakan untuk membuat sebuah tabel
Tag Keterangan Sering digunakan
<table> Digunakan untuk membuat tabel
<tr> Digunanak untuk untuk membuat baris cell baru
<td> Digunakan untuk untuk membuat kolom cell baru
<thead> Digunakan untuk membuat membungkus bagian judul kolom
<tbody> Digunakan untuk membungkus bagian dari isi dari tabel
<tfoot> Digunakan untuk untuk membungkus bagian footer dari tabel
<th> Digunakan untuk membuat kolom judul tabel
<caption> Digunakan untuk membuat judul/informasi singkat dari tabel
<col> Digunakan untuk membuat styling dari kolom
<colgroup> Digunakan untuk mengelompokan tag <col>

Tag Script

Tag script adalah tag yang digunakan untuk meletakan kode javascript
Tag Keterangan Sering digunakan
<noscript> Digunakan untuk mendisable kode yang dibungkus tag tersebut
<script> Digunanak untuk meletkan kode javascript

Tag Embed

Tag embed adalah tag yang digunakan untuk menyisipkan sebuah konten seperti video, halaman web lain dan lainnya.
Tag Keterangan Sering digunakan
<applet> Digunakan untuk menyisipkan java applet
<area> Digunanak untuk menyisipkan area image map
<audio> Digunakan untuk meletakan audio
<canvas> Digunakan untuk menggambar grafik
<embed> Digunakan untuk meyisipkan aplikasi eksternal
<figcaption> Digunakan untuk untuk memberikan keterangan pada tag figure
<figure> Digunakan untuk membuat figure
<frame> Digunakan untuk membuat bingkai
<fameset> Digunakan untuk membuat koleksi dari tag frame
<iframe> Digunakan untuk menyisipkan halaman web lain
<img> Digunakan untuk menampilkan gambar
<map> Digunakan untuk menampilkan peta dari gambar
<noframes> Digunakan sebagai keterangan ketika browser tidak mendukung tag frame
<object> Digunakan untuk meletakan sebuah objek
<param> Digunakan untuk memberikan parameter untuk java applet
<source> Digunakan sebagai keterangan audio, video dan tag embed lainnya
<time> Digunakan untuk menampilakan waktu dan tanggal
<video> Digunakan untuk menyisipkan file video
<svg> Digunakan untuk menyisipkan gambar svg


Kita tidak akan menghafal semuanya, karena memang ada beberapa yang jarang digunakan dan ada beberapa tag yang sudah tidak lagi di dukung di html5. Ada juga tag yang fungsinya bisa digantikan oleh css.
Next tutorial kita akan belajar apa itu elemen. Jika kalian merasa artikel ini bermanfaat silahkan bagikan. Dan jika ada petanyaan atau hal yang ingin di sampaikan silahkan tulis di kolom komentar

advertisement



0 Komentar untuk " Tutorial Lengkap Belajar Html # Mengenal Tag-Tag Html"

Silahkan berkomentar dengan baik dan bijak!