Kembali lagi di Herozdev Studio, pada kali ini kita akan diskusi tentang apa itu HTML (Hyper Text Markup Language).
HTML, merupakan dasar-dasar dari bahasa pemrograman yang wajib kalian kuasai jika ingin belajar web programming. Kenapa? Karena HTML ini bisa dikatakan sebagai komponen utama dalam pemrograman aplikasi web, hingga sangat diharuskan untuk memahami agar dengan mudah kalian bisa membuat sebuah aplikasi.
Seperti namanya, HTML bisa juga disebut bahasa Markup yang dimana berfungsi untuk membuat atau membangun sebuah website. Dan HTML ini berfungsi untuk membuat elemen-elemen yang akan disatukan hingga menjadi sebuah halaman web. Contohnya membuat menu, tabel, gambar, artikel, penulisan, dll hingga diharuskan untuk mempelajari HTML.
Ada 3 bagian komponen dalam HTML, yaitu Tag, Element, dan Atribute. Yang dimana masing-masing bagian memiliki fungsi tersendiri. Yuk, kita bahas tentang HTML.
- Tag HTML
<tag>Herozdev Studio</tag>
Jadi penulisan tag HTML diatas memiliki perbedaan antara tag pembuka dan tag penutup. Pada tag pembuka <tag> dan tag penutup </tag>, berguna untuk membatasi bagian mana saja yang ingin dihasilkan.
Adapun beberapa tag yang paling sering digunakan dalam membuat aplikasi web, diantaranya:
| Nama Tag | Keterangan |
|---|---|
| <!-- script kode --> | Fungsi untuk memberikan komentar atau keterangan |
| <!DOCTYPE html> | Berfungsi sebagai identitas atau yang mendefinisikan tipr file |
| <a> … </a> |
Mendefinisikan
sebuah anchor
yang
digunakan untuk saling menautkan antara satu document HTML dengan
document lainnya.
|
| <b> … </b> | Merubah format penulisan menjadi tebal (bold) |
| <p> … </p> | Membuat sebuah paragraf |
| <h1> … </h2> | Untuk membuat format penulisan Heading 1 |
| <h2> … </h2> | Untuk membuat format penulisan Heading 2 |
| <body> … </body> | Mendefinisikan isi dari file HTML |
| <head> … </head> | Mendefinisikan bagian kepala dari laman web |
| <title> … </title> | Mendefinisikan judul dari laman web |
| <div> … </div> | Mendefinisikan bagian-bagian elemen HTML |
| <link> … </link> | Menghubungkan antar laman web |
| <script> … </script> | Membuat dokumen client-side pada file HTML |
| <table> … </table> | Membuat bentuk table di laman HTML |
| <th> … </th> | Membuat header pada table |
| <tr> … </tr> | Membuat baris pada table |
| <td> … </td> | Membuat isi pada table |
- Element HTML
<!DOCTYPE html>
<html>
<head>
<title>Judul Web Saya</title>
</head>
<body>
<strong><h2>Welcome to Herozdev Studio</h2></strong>
</body>
</html>
<html>
<head>
<title>Judul Web Saya</title>
</head>
<body>
<strong><h2>Welcome to Herozdev Studio</h2></strong>
</body>
</html>
Pada script diatas, <h2>..</h2> ini merupakan element dari heading 2 dan isi teksnya itu hasil formatnya heading 2. Tidak hanya teks saja, di dalam tag ini bisa kalian isi dengan <link> atau tag yang lainnya.
- Atribut HTML
<!DOCTYPE html>
<html>
<head>
<title>Judul Web Saya</title>
</head>
<body>
<strong><h2 align="center">Welcome to Herozdev Studio</h2></strong>
</body>
</html>
<html>
<head>
<title>Judul Web Saya</title>
</head>
<body>
<strong><h2 align="center">Welcome to Herozdev Studio</h2></strong>
</body>
</html>
Perhatikan perubahannya setelah ditambahkan dengan atribut:
- <h2> ialah element nya
- align=”center” ialah atribut nya
Demikian penjelasan mengenai pengenalan HTML, yang saya uraikan adalah langkah-langkah dasarnya untuk mengenal HTML. Sebenarnya masih banyak lagi tentang HTML, maka jika kalian ingin explore lebih dalam lagi kita merekomendasikan untuk mengunjungi situs W3Schools .
Adios, happy coding.