Belajar HTML Dasar (Part 2): Tag, Atribut, dan Contoh Sederhana

Pada pembahasan kali ini, kita akan mengenal HTML lebih dalam, khususnya tentang atribut dan tag dasar yang sering digunakan saat membuat website.

Sebelumnya kita sudah tahu bahwa:
👉 HTML adalah struktur atau kerangka dari sebuah website

Sekarang, kita akan mulai masuk ke bagian yang lebih praktis.


⚠️ Apakah HTML Case Sensitive?

Hal penting yang perlu kamu tahu:

👉 HTML tidak case sensitive

Artinya:

<p>Halo</p>

akan dianggap sama dengan:

<P>Halo</P>

Namun, best practice modern adalah:
👉 gunakan huruf kecil (lowercase) agar lebih rapi dan konsisten


🔍 Apa Itu Atribut HTML?

Atribut adalah informasi tambahan di dalam sebuah tag HTML.

Atribut digunakan untuk:

  • Mengatur tampilan
  • Memberikan informasi tambahan
  • Mengontrol perilaku elemen

✨ Format Penulisan Atribut:

<tag nama="value">

📌 Contoh Atribut HTML

<p align="left">Belajar HTML itu baik</p>
<body style="background-color: red;">

Penjelasan:

  • align="left"
    👉 align = nama atribut
    👉 "left" = nilai/value
  • style="background-color: red;"
    👉 mengubah warna background menjadi merah

⚠️ Catatan:

  • Value wajib menggunakan tanda kutip " "
  • Penulisan harus rapi (hindari typo seperti sebelumnya)

🧩 Tag HTML Dasar (Wajib Tahu untuk Pemula)

Berikut adalah tag-tag yang paling sering digunakan:

  • <html> → pembungkus seluruh halaman
  • <head> → berisi informasi (tidak tampil di halaman)
  • <title> → judul tab browser
  • <body> → isi utama website
  • <p> → paragraf
  • <b> → teks tebal
  • <i> → teks miring
  • <u> → garis bawah
  • <sup> → teks naik (pangkat)
  • <sub> → teks turun
  • <blockquote> → kutipan
  • <h1> sampai <h6> → heading (judul)

💡 Tips:

👉 <h1> paling besar
👉 <h6> paling kecil


🛠️ Contoh HTML Sederhana

Sekarang kita coba buat dokumen HTML sederhana:

<!DOCTYPE html>
<html>
<head>
<title>Dokumen Sederhana</title>
</head>

<body>
<h1>Belajar HTML</h1>
<p>Proses belajar HTML membutuhkan konsistensi yang tinggi.</p>
<p>Oleh karena itu, kita tidak boleh bermalas-malasan.</p>
</body>
</html>

🔎 Penjelasan Singkat

  • <!DOCTYPE html> → memberitahu browser bahwa ini HTML5
  • <html> → pembungkus semua kode
  • <head> → metadata
  • <title> → judul tab
  • <body> → isi website

🎯 Kesimpulan

HTML adalah fondasi utama dalam pembuatan website.

Dengan memahami:

  • Struktur dasar
  • Tag HTML
  • Atribut

👉 kamu sudah selangkah lebih dekat untuk membuat website sendiri.

Kunci utama belajar HTML:
👉 konsistensi dan latihan

Comments

Post a Comment