Memahami Dasar-dasar HTML
Hypertext Mark Up Language atau yang biasa disingkat HTML adalah bahasa standar pemrograman untuk membuat suatu halaman website.
Didalam HTML sendiri terdapat Tag, Elemen dan Atribut yang merupakan Dasar HTML. Ketiganya dasar dari seluruh halaman web yang ada di Internet.
Berikut penjelasan mengenai Tag, Elemen dan Atribut pada HTML
1. Tag
Tag adalah Suatu penanda untuk menandai elemen-elemen dalam suatu dokumen HTML dan Fungsi Tag adalah untuk memberikan instruksi atau memberitahu kepada browser bagaimana suatu objek di tampilkan berdasarkan Tag yang di gunakan. Biasa tag HTML terdiri dari <tag_pembuka> dan <tag_penutup>, namun ada juga tag yang dalam penulisannya berdiri sendiri seperti <nama_tag/>
2. Elemen
Elemen adalah isi dari tag yang berada diantara tag pembuka dan tag penutup, termasuk tag itu sendiri dan atribut yang dimilikinya (jika ada).
<p> Belajar Dasar HTML </p>
3. Atribut
Elemen, Tag dan atribut pada HTML sebenarnya saling berkaitan, hanya saja disini atribut memiliki tugas khusus untuk memberikan informasi atau sifat tambahan yang akan diberikan kepada tag dan elemen yang mengandung atribut tersebut.
sebenarnya masih banyak lagi jenis-jenis atribut, namun tergantung kepada tag apa yang digunakan, karena beberapa tag memiliki atribut khususnya masing- masing.
Didalam HTML sendiri terdapat Tag, Elemen dan Atribut yang merupakan Dasar HTML. Ketiganya dasar dari seluruh halaman web yang ada di Internet.
 |
| Foto: Ist |
Berikut penjelasan mengenai Tag, Elemen dan Atribut pada HTML
1. Tag
Tag adalah Suatu penanda untuk menandai elemen-elemen dalam suatu dokumen HTML dan Fungsi Tag adalah untuk memberikan instruksi atau memberitahu kepada browser bagaimana suatu objek di tampilkan berdasarkan Tag yang di gunakan. Biasa tag HTML terdiri dari <tag_pembuka> dan <tag_penutup>, namun ada juga tag yang dalam penulisannya berdiri sendiri seperti <nama_tag/>
| Tag HTML | |
| Tag | Deskripsi |
| <!--...--> | Membuat sebuh komentar |
| <!DOCTYPE> | Mendefinisikan jenis dokumen |
| <a> | Membuat hyperlink |
| <abbr> | Mendefinisikan sebuah singkatan atau akronim |
| <address> | Mendefinisikan kontak atau alamat dari penulis |
| <area> | Mendefinisikan sebuah area didalam peta gambar |
| <article> | Mendefinisikan sebuah artikel |
| <aside> | Mendefinisikan konten selain konten utama, biasanya digunakan pada sidebar disebuah situs |
| <audio> | Mendefinisikan kontensuara atau audio |
| <b> | Membuat teks menjadi tebal |
| <base> | Menentukan URL dasar/target untuk semua URL relatif dalam dokumen |
| <bdi> | Isolat bagian teks yang mungkin diformat dalam arah yang berbeda dari teks lain di luar itu sendiri |
| <bdo> | Mengesampingkan arah teks saat ini |
| <blockquote> | Mendefinisikan sebuah bagian teks yang dikutip dari sumber lain |
| <body> | Mendefinisikanbagian tubuh dokumen atau isi utama sebuah web |
| <br> | Membuat satu baris kosong |
| <button> | Membuat sebuah tombol |
| <canvas> | Digunakan untuk membuat grafik dengan cepat, melalui scripting |
| <caption> | Mendefinisikan caption tebal |
| <cite> | Mendefinisikanjudul sebuah karya |
| <code> | Mendefinisikan kode komputer |
| <col> | Menentukan setiap kolom |
| <colgroup> | Menentukan sekelompok kolom atau lebih dalam sebuah tabel |
| <datalist> | Mendefinisikan rincian tambahan yang bisa dilihat dan disembunyikan pengguna |
| <dd> | Mendefinisikan sebuah deskripsi istilah atau nama dalam daftar deskripsi |
| <del> | Mendefinisikan teks yang dihapus dari dokumen |
| <details> | Mendefinisikan rincian tambahan yang bisa dilihat dan disembunyikan pengguna |
| <dfn> | Mendefinisikan sebuah istilah |
| <dialog> | Mendefinisikan sebuah kotak dialog atau jendel |
| <div> | Mendefinisikan sebuah bagian dalam dokumen |
| <dl> | Mendefinisikan daftar deskripsi |
| <dt> | Mendefinisikan sebuah istilah atau nama dalam daftar deskripsi |
| <embed> | Mendefinisikan sebuah wadah untuk aplikasi eksternal (non-HTML) |
| <fieldset> | Grup element terkait dengan form |
| <figcaption> | Mendefinisikan sebuah caption untuk <figure> element |
| <figure> | Menentukan konten sendiri |
| <footer> | Mendefinisikan sebuah footer dalam dokumen |
| <form> | Mendefinisikan sebuah form HTML untuk pengguna |
| <h1> to <h6> | Mendefinisikan heading atau sub judul dari yang paling kecil sampai yang paling besar |
| <head> | Mendefinisikan informasi tentang dokumen |
| <header> | Mendefinisikan header untuk dokumen atau bagian |
| <hr> | Membuat sebuah garis horizontal |
| <html> | Mendefinisikan sebuah dokumen HTML |
| <i> | Membuat teks menjadi miring (italic) |
| <iframe> | Mendefinisikan sebuah inline frame |
| <img> | Mendefinisikan sebuah gambar |
| <input> | Mendefinisikan sebuah kontrol input |
| <ins> | Mendefinisikan sebuah teks yang dimasukkan kedalam dokumen |
| <kbd> | Mendefinisikan teks yang ditandai atau disorot |
| <label> | Mendefinisikan label atau kategori untuk tag |
| <legend> | Mendefinisikan sebuah caption untuk tag |
| <li> | Mendefinisikan daftar item pada tag <ol> dan <ul> |
| <link> | Mendefinisikan sebuah hubungan antara dokumen dengan sumber eksternal (Paling sering dihubungkan dengan stylesheet seperti CSS) |
| <main> | Menentukan konten utama dari dokumen |
| <map> | Mendefinisikan peta gambar pada browser klien |
| <mark> | Mendefinisikan teks yang ditandai atau disorot |
| <menu> | Mendefinisikan daftar menu atau perintah |
| <menuitem> | Mendefinisikan item perintah / menu bahwa pengguna dapat memanggil dari menu popup |
| <meta> | Mendefinisikan meta data yang ada didalam dokumen |
| <meter> | Mendefinisikan pengukuran skalar dalam rentang yang diketahui (alat ukur) |
| <nav> | Mendefinisikan tautan navigasi |
| <noscript> | Mendefinisikan konten alternative untuk pengguna yang tidak mendukung tag <script> |
| <object> | Mendefinisikan sebuah objek yang disematkan |
| <ol> | Mendefinisikan daftar dengan nomor urut |
| <optgroup> | Mendefinisikan sekelompok opsi terkait dalam daftar drop-down |
| <option> | Mendefinisikan sebuah opsi atau pilihan dalam daftar drop-down |
| <output> | Mendefinisikan hasil perhitungan bingkai |
| <p> | Mendefinisikan sebuah paragraf |
| <param> | Mendefinisikan parameter untuk sebuah objek |
| <picture> | Mendefinisikan parameter untuk sebuahgambar |
| <pre> | Mendefinisikan teks yang berformat |
| <progress> | Membuat sebuah progress |
| <q> | Mendefinisikan sebuah kutipan singkat |
| <rp> | Menggantikan fungsi tag <ruby> pada browser yang tidak mendukung |
| <rt> | Mendefinisikan sebuah penjelasan atau karakter dari tipografi asia |
| <ruby> | Mendefinisikan anotasi ruby (untuk tipografi asia) |
| <s> | Mendefinisikan teks yang sudah tidak benar |
| <samp> | Mendefinisikan keluaran sampel dari sebuah program komputer |
| <script> | Mendefinisikan script untuk klien |
| <section> | Mendefinisikan sebuah bagian dalam sebuah dokumen |
| <select> | Mendefinisikan sebuah daftar drop-down |
| <small> | Membuat teks menjadi lebih kecil |
| <source> | Mendefinisikan beberapa sumber media untuk tag <audio> <video> dan <picture> |
| <span> | Mendefinisikan sebuah bagian yang lebih kecil dari <div> dalam dokumen |
| <strong> | Mendefinisikan teks yang penting dan juga teks menjadi tebal |
| <style> | Mendefinisikan informasi gaya untuk dokumen |
| <sub> | Mendefinisikan teks subscript |
| <summary> | Mendefinisikan sebuah judul yang terlihat dalam sebuah <details> element |
| <sup> | Mendefinisikan teks superscripted |
| <table> | Mendefinisikan sebuah tabel |
| <tbody> | Mengelompokkan konten utama atau isi dalam sebuah tabel |
| <td> | Mendefinisikan sebuah kolom atau sel dalam tabel |
| <textarea> | Mendefinisikan kontrol input multigaris (area teks) |
| <tfoot> | Mengelompokkan konten footer atau penutup dalam sebuah tabel |
| <th> | Mendefinisikan sebuah sel header dalam tabel |
| <thead> | Mengelompokkan konten header dalam sebuah tabel |
| <time> | Mendefinisikan sebuah tanggal atau waktu |
| <title> | Mendefinisikan judul dari dokumen HTML |
| <tr> | Mendefinisikan sebuah baris dalam tabel |
| <track> | Mendefinisikan trek teks untuk elemen media yang (<video> dan <audio>) |
| <u> | Mendefinisikan teks yang harus berbeda dari teks biasa |
| <ul> | Mendefinisikan daftar yang tidak berurutan (tanpa nomor) |
| <var> | Mendefinisikan sebuah variabel |
| <video> | Mendefinisikan sebuah video |
| <wbr> | Mendefinisikan sebuah kemungkinan line-break |
2. Elemen
Elemen adalah isi dari tag yang berada diantara tag pembuka dan tag penutup, termasuk tag itu sendiri dan atribut yang dimilikinya (jika ada).
<p> Belajar Dasar HTML </p>
Ket : <p> dan </p> merupakan Tag HTML, sedangkan Belajar Dasar HTML merupakan Elemen nya
3. Atribut
Elemen, Tag dan atribut pada HTML sebenarnya saling berkaitan, hanya saja disini atribut memiliki tugas khusus untuk memberikan informasi atau sifat tambahan yang akan diberikan kepada tag dan elemen yang mengandung atribut tersebut.
| Atribut HTML | |
| Atribut | Deskripsi |
| alt | Menentukan teks alternatif untuk gambar, ketika gambar tidak dapat ditampilkan |
| disable | Menentukan bahwa elemen input harus dinonaktifkan |
| href | Menentukan URL (Alamat web) untuk link |
| id | Menentukan ID link untuk elemen |
| src | Menentukan URL (Alamat web) untuk gambar |
sebenarnya masih banyak lagi jenis-jenis atribut, namun tergantung kepada tag apa yang digunakan, karena beberapa tag memiliki atribut khususnya masing- masing.