Pengenalan dan Struktur Tag HTML

Aug 25, 2024

Catatan Kuliah: Pengenalan Tag HTML

Pengantar

  • Pembahasan tentang tag HTML: pembuatan, struktur, dan jenis tag yang ada.
  • Tag adalah kode dalam HTML yang dimulai dengan tanda '<' diikuti nama tag dan diakhiri dengan '>'.
  • Ada tag yang berpasangan (tag pembuka dan penutup) dan ada yang tidak.

Struktur Dasar HTML

  • Struktur dasar HTML terdiri dari:
    • <!DOCTYPE html>
    • <html>
    • <head>
    • <body>

Tag dalam Bagian Head

  • Tag yang bisa ada di dalam <head>:
    • <title>: Menyimpan judul halaman yang muncul di tab browser.
    • <style>: Menyimpan CSS.
    • <script>: Menyimpan JavaScript.
    • <meta>: Menyimpan metadata seperti karakter set, deskripsi, kata kunci, dan penulis.
      • Contoh metadata:
        • charset: Untuk encoding.
        • Deskripsi dari website.
        • Keywords dan penulis.

Tag dalam Bagian Body

  • Tag yang dapat digunakan dalam <body>:
    • Heading:
      • 6 level heading, dari <h1> (terbesar) hingga <h6> (terkecil).
    • Paragraf:
      • Menggunakan tag <p>.
    • Tag Pendukung Teks:
      • <br>: Menambahkan baris baru.
      • <hr>: Menambahkan garis horizontal.
      • <em>: Menyatakan teks penting.
      • <strong>: Menyatakan teks sangat penting.
    • Gambar:
      • Menggunakan tag <img>.
    • Hyperlink:
      • Menggunakan tag <a>.
    • List:
      • <ul>: Unordered list (tidak terurut).
      • <ol>: Ordered list (terurut).
        • Di dalamnya ada <li> untuk list item.
      • <dl>: Definition list.
    • Tabel:
      • Menggunakan tag <table>.
    • Form:
      • Menggunakan tag <form> dengan elemen input.
    • JavaScript:
      • Juga dapat disimpan dalam <body> menggunakan tag <script>.
    • Objek Multimedia:
      • Menggunakan tag <object>.
    • Grouping:
      • Menggunakan tag <div> dan <span>.
    • Komentar:
      • Menggunakan <!-- komentar --> untuk membantu pengingat bagi developer.

Struktur Tag HTML

  • Setiap tag memiliki struktur:
    • Nama tag diikuti oleh atribut dan nilai (value).
    • Contoh: 
      <body bg-color="lightblue">
    • Satu tag bisa memiliki lebih dari satu atribut.

Atribut Global

  • Atribut yang bisa digunakan di semua tag:
    • accesskey: Untuk akses menggunakan keyboard.
    • class dan id: Menentukan kelas dan ID elemen.
    • dir: Menentukan arah tulisan.
    • lang: Menentukan bahasa.
    • style: Untuk menyisipkan CSS inline.
    • tabindex: Untuk menentukan urutan fokus dengan tombol tab.
    • title: Memberi judul pada elemen.

Penutup

  • Untuk informasi lebih lanjut, kunjungi W3Schools.
  • Terima kasih, saya Sandika Gali.