Pada materi sebelumnya sudah membahas pengertian HTML dan sedikit penjelasan tentang tag HTML. Lalu apasaja sih tag – tag HTML ? Dan apa fungsi dari tiap tag – tag HTML ?. Pada materi ini akan dijelaskan tentang macam macam tag – tag HTML, perlu diingat tidak semua tag pada HTML memiliki tag penutup.
Didalam HTML memuat banyak tag – tag yang pastinya dengan fungsi yang berbeda beda. Daftar tag – tag yang tersedia pada HTML :
Nama Tag - Tag - Fungsi
Komentar <!—komentar --> Untuk membuat sebuah komentar atau petunjuk pada kode HTML, tag ini tidak akan dimunculkan pada website.
Tipe Dokumen <!Document> Mendefinisikan versi dokumen.
Anchor <a> </a> Mendefinisikan hyperlink. Link dapat merujuk kelaman website yang sedang dibuka atau ke halaman website lain.
Abbreviation <abbr> </abbr> Mendefinisikan sebuah tingkatan, missal HTML, TNI, RT, RW.
Akronim <acronym> </acronym> Tag untuk membuat sebuah akronim, tag ini sudah tidak didukung lagi oleh HTML 5
Alamat <address> </address> Untuk membuat kontak penulis atau pemilik dokumen.
Applet <applet> </applet> Mendefinisikan sebuah applet yang mendukung pemrograman java. Tetapi applet sudah tidak didukung oleh HTML5.
Area <area> Digunakan untuk menunjukan sebuah area (daerah) pada image map(peta gambar).
Artikel[5] <acticle> </article> Membuat sebuah konten utuh yang tidak terikat dengan konten lain. Misal : Review item tertentu, Komentar, Posingan Blog dll.
Element Samping[5] <aside> </aside> Untuk mendefinisikan sebuah konten yang bersebelahan dan berkaitan dengan konten disekitarnya.
Audio[5] <audio> </audio> Berfungsi untuk menyisipkan music pada halaman web yang dapat diputar untuk didengarkan. Beberapa format file yang bisa dijalankan yaitu : mp3, ogg dan wav.
Bold <b> </b> Membuat teks menjadi tebal.
Base <base/> Tag ini digunakan untuk menentukan document base URL atau target semua URL relatif dalam dokumen.
Base Font <basefont> Digunakan untuk menentukan default warna, ukuran, dan font untuk semua teks dalam dokumen. Tetapi sudah tidak didukung pada HTML5.
Isolasi Dua Arah[5] <bdi> </bdi> Bdi singkatan dari Bi-Directional Isolation yang berfungsi untuk mengisolasi terhadap arah tulisan yang mungkin akan berbeda pada element disekitarnya.
Bi Directional Override <bdo> </bdo> Element ini digunakan untuk mengganti arah teks yang ada pada sebuah element.
Big <big> </big> Mendefinisikan teks yang lebih besar dari teks normal. Tidak didukung oleh HTML5.
Blink <blink> </blink> Membuat teks berkedip, tapi tag ini sudah tidak didukung sama sekali.
Block Quote <blockquote> </blockquote> Digunakan untuk menunjukan sebuah konten dikutip dari sumberlain.
Body <body> </body> Menunjukan isi dari sebuah document.
Break Row <br> Untuk membuat baris baru, fungsinya sama seperti Enter pada keyboard saat membuat document.
Tombol/Button <button> </button> Untuk membuat sebuah tombol yang dapat digunakan untuk menjalanpan perintah tertentu.
Canvas[5] <canvas> </canvas> Canvas digunakan untuk menggabar grafik secara interaktif dengan menggunakan javascript.
Caption <caption> </caption> Digunakan untuk memberikan judul pada sebuah tabel HTML.
Rata Tengah <center> </center> Untuk membuat teks menjadi rata tengah.
Cite <cite> </cite> Mendefinisikan rujukan atau referensi sebuah karya kreatif.
Kode <code> </code> Menampilan sebuah kpde computer.
Kolom <col/> Tag yang digunakan untuk menunjukan kolom pada sebuah table.
Grub Kolom <colgroup> </colgroup> Untuk mengelompokan satu atau lebih kolom dalam sebuah table.
Command <command> </comman> Untuk menampilkan sebuah tombol command.
Konten <content> </content> Digunakan untuk menyisipkan sebuah konten bai berupa teks, gambar atau yang lainya.
Data <data> </data> Digunakan untuk merujuk konten dari sebuah data yang dapat dimerti oleh mesin.
List Data[5] <datalist> </datalist> Menampilak sebuah daftar opsi dari input control.
Deskripsi <dd> </dd> Dd singkatan dari Definition Description merupakan element yang memiliki fungsi untuk memberikan penjelasan sebuah istilah pada daftar deskripsi.
Delete <del> </del> Mendefinisikan teks yang telah dihapus dari dokumen.
Detail[5] <details> </details> Mendefinisikan rincian konten dari tag Summary yang disa ditampilkan maupun disembunyikan.
Definisi <dfn> </dfn> Digunakan untuk mendefinisikan sebuah istilah.
Dialog <dialog> </dialog> Untuk menampilkan sebuah dialog box pada layar dokumen.
Direktori <dir> </dir> Untuk menampilan sebuah daftar direktori. Tetapi sudah tidak didukun oleh HTML5.
Divisi <div> </div> Digunakan untuk menampung element – element menjadi satu.
Daftar Deskripsi <dl> </dl> Untuk mendefinisikan sebuat daftar isilah atau deskripsi.
Definition Term <dt> </dt> Untuk menjelaskan istilah pada Definition List <dl>.
Emphasis <em> </em> Untuk memberikan tekanan pada sebuah konten yang artinya memiliki perhatian khusus.
Embed[5] <embed> </embed> Digunakan untuk mengintregrasi aplikasi eksternal selain HTML.
Field Set <fieldset> </fieldset> Untuk mengelompokan element – element yang terkait dengan tag <form>.
Figure Caption[5] <figcaption> </figcaption> Memberikan sebuah judul untuk tag figure.
Figure[5] <figure> </figure> Mempresentasikan konten tersendiri. Contoh foto, vodeo, deretan kode dll.
Footer[5] <footer> </footer> Untuk mendefinisikan footer atau bagian kaki dari dokumen.
Form <form> </form Untuk membuat form isian untuk pengguna. Biasanya dipakai untuk form Registrasi dan Login.
Frame <frame> </frame> Mendefinisikan sebuah frame pada tag <frameset>. Tag <frame> tidak didukung lagi oleh HTML5.
Frame Set <frameset> </frameset> Mendefinisikan sebuah frame. Tetapi tidak didukung HTML5.
Heading <h1> </h1>
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6> Heading terdapat 6 level, heading berfungsi untuk memformat tulisan menjadi heading atau judul.
Head <head> </head> Head berfungsi untuk tempat memberika seluruh informasi pada dokumen.
Header[5] <header> </header> Mendefinisikan element header untuk konten pengantar atau navigasi yang berisi deretan info.
Horizontal Ruler <hr> Tag ini berfungsi untuk memberikan garis panjang mendatar, biasanya digunakan pada pembatas kop surat dan isinya.
HTML <html> </html> Untuk mendefinisikan document HTML.
Italic <i> </i> Membuat tulisan menjadi miring.
iFrame <iframe> </iframe> Untuk mendifinisikan konteks jelajah dari sebuah dokumen atau file.
Image <img/> Untuk menampilkan sebuah gambar.
Input <input/> Untuk member inputan pada document, biasanya digunakan pada form, inputan ini bisa berupa text, password, file dll.
Insert <ins> </ins> Untuk mendefinisikan teks yang disipkan didalam document.
Keyboard <kbd> </kbd> Untuk mengiplementasikan teks inputan keyboard.
Key Generator <keygen> </keygen> Mendifinisikan key-pair generator pada sebuah form dokumen.
Label <label> </label Memasukan sebuah label pada form.
Legend <legend> </legend> Memberikan sebuah judul pada tag <fieldset>.
List <li> </li> Memdefinisikan sebuah daftar item dati tag <ol> atau <ul>.
Link <link> Untuk menghubungan file atau library kedalam sebuah dokumen, tag ini terletak pada tag <head>.
Main[5] <main> </main> Berfungsi untuk membuan konten utama dalam sebuah dokumen yang biasanya terletak pada tag <body>.
Map <map> </map> Membuat Client Side image map.
Mark[5] <mark> </mark> Memberikan tanda pada teks atau tulisan yang disorot untuk menarik perhatian.
Menu <menu> </menu> Memberikan list menu dari command.
Meta <meta> Memerikan meta data atau informasi pada document. Baisanya terletak pada tag <head>.
Meter[5] <meter> </meter> Digunakan untuk pengukuran data pada skala tertentu. Proses pengukuran data ini dikenal dengan istilah gauge.
Navigasi[5] <nav> </nav> Memberikan link – link untuk navigasi dokumen.
No Frames <noframes> </noframes> Digunakan untuk alternative framem jika element <frame> tidak tersedia pada dokumen.
No Script <noscript> </noscript> Digunakan sebagai alternative script jika element <script> tidak tersedia pada dokumen.
Objek <object> </object> Mendefinisikan sebuah objek.
Ordered List <ol> </ol> Membuat sebuah daftar yang berurutan.
Option Group <optgroup> </optgroup> Membuat sebuah grub yang saling terkait dari daftar pilihan (drop down).
Option <option> </option> Membuat daftar pilihan pada menu drop down.
Output <output> </output> Menampilkan hasil perhitungan.
Paragraf <p> </p> Untuk membuat teks paragraph pada dokumen.
Parameter <param> Memberikan sebuah parameter pada suatu objek.
Preformat <pre> </pre> Untuk menampilkan teks dalam preformat (preformatted text).
Progess[5] <progress> </progress> Untuk menampilakan proses berlangsungnya sebuah kegiatan atau
proses yang digambarkan dalam progress bar.
Quote <q> </q> Untuk membuat sebuah kutipan pendek pada kalimat.
RP <rp> </rp> Menampilkan menjelasan pada sebuah web browser yang tidak mendukung ruby.
RT <rt> </rt> Untuk menjelaskan sebuah makna pengucapan karakter.
Ruby <ruby> </ruby> Untuk memberikan penjelasan Ruby.
Garis Coret <s> </s> Untuk memberikan coretan pada sebuah teks, biasa nya untuk Diskon harga yang mana harga sebelumnya dicoret dan digantikan dengan harga baru.
Sample <samp> </samp> Menampilan sebuah contoh output dari program computer.
Script <script> </script> Sebuah element yang berfungsi sebagai wadah untuk menulskan script atau kode – kode javascript.
Section[5] <section> </section> Menampilkan konten atau bagian dari dokumen atau aplikasi.
Select <select> </select> Memberikan sebuah data list pada menu drop down.
Small <small> </small> Untuk membuat teks kecil dari ukuran normal.
Source <source> Untuk memberikan data atau file dari tag media <video> dan <audio>.
Span <span> </span> Sebagai wadah element – element agar mudah untuk pemberial style.
Strike Through <strike> </strike> Untuk membuat teks tercoret atau salah. Fungsinya sama seperti tag <s>. Tapi tag ini sudah tidak didukung pada HTML5.
Strong <strong> </strong> Untuk membuat teks atau kata penting. Strong memiliki fungsi seperti Bold yaitu menebalkan tulisan.
Style <style> </style> Tag ini berfungsi sebagai wadah untuk melatakkan kode CSS.
Subscript <sub> </sub> Untuk membuat tulisan kecil dibawah tulisan normall. Misal H2O.
Summary <summary> </summary> Untuk membuat sebuah judul, biasanya digunakan pada element <details>.
Superscript <sup> </sup> Untuk membuat perpangkatan, biasanya untuk menjelaskan perpangkatan pada hitungan matematika. Misal 22 – Dua pangkat 2.
Tabel <table> </table> Untuk membuat sebuah table pada dokumen.
Table Body <tbody> </thead> Untuk mengelompokan isi dari sebuah table.
Table Data <td> </th> Untuk membuat kolom pada sebuah table.
Text Area <textarea> </textarea> Untuk membuat sebuah inputan text yang memiliki banyak baris atau multiline.
Tabel Foot <tfoot> </tfoot> Untuk mendefinisikan foot atau bagian kaki pada sebuah table.
Table Head <thead> </thead> Untuk mendefinisikan sebuah head pada table.
Time[5] <time> </time> Untuk menampilkan waktu dan tanggal di sebuah document.
Title / Judul <title> </title> Merfungsi untuk member judul atau penamaan sebuah website. Tag ini terletak pada tag <head>.
Table Row <tr> </tr> Fungsi dari tag ini adalah untuk membuat baris pada suatu table.
Track[5] <track> </track> Untuk mendefinisikan sebuah text track atau waktu putar pada element media <video> dan <audio>.
Teletype <tt> </tt> Untuk membuat teks teletype. Tetapi sudah tidak digunakan lagi pada HTML5.
Underline <u> </u> Untuk memmbuat teks bergaris bawah.
Unordered List <ul> </ul> Untuk membuat sebuah list yang tidak berurutan.
Variable <var> </var> Untuk mendefinisikan sebuah teks yang memiliki variable.
Video[5] <video> </video> Untuk menampilkan file video yang dapat diputar pada halaman website.
Word Break Opportunity[5] <wbr> </wbr> Untuk membuat frase atau kata yang terpisah dari kalimatnya yang dapat berpindah ke baris baru.
Bagaimana banyak bukan tag – tag yang terdapat pada HTML. Tag – tag yang sudah dihilangkan kemungkinan dari penggunaanya karena penggunaanya sangat sedikit maka tag tersebuh akan dihilangkan. Pada saat ini kebanyakan tag – tag yang terdapat pada HTML sudah banyak tergantikan oleh CSS karena CSS lebih mudah diterapkan, memiliki banyak fitur dan hamper semua tag – tag pada HTML dapat diatur style nya dengan mudah menggunakan CSS. Untuk nama – nama tag yang memiliki tanda " [5] " berarti tag tersebut adalah tag – tag baru yang ada pada HTML5.
Demikian penjelasan dari Tag Tag HTML, untuk materi selanjutnya adalah pembuatan website dengan HTML.
- Terimakasih Sudah Mengunjungi Blog ini - Sekian - Semoga Bermanfaat -
- Jangan Lupa untuk Share -
Tidak ada komentar:
Posting Komentar