September 30, 2024 | Samudra Digital

Mengenal HTML: Dasar-Dasar Pembuatan Website

Apa itu HTML?

HTML, singkatan dari HyperText Markup Language, adalah bahasa pemrograman yang menjadi fondasi dari hampir semua halaman web yang kamu lihat di internet. Bayangkan HTML sebagai kerangka atau struktur dari sebuah bangunan. Sama seperti kerangka yang memberikan bentuk pada bangunan, HTML memberikan struktur pada halaman web.

Fungsi Utama HTML:

  • Menentukan Struktur: HTML digunakan untuk mendefinisikan struktur konten dalam sebuah halaman web, seperti judul, paragraf, daftar, gambar, dan tautan.
  • Menampilkan Konten: HTML menampilkan konten tersebut di dalam browser web.
  • Membuat Tampilan Dasar: Meskipun HTML tidak digunakan untuk membuat tampilan yang rumit, namun HTML memberikan dasar yang kuat untuk penambahan gaya (CSS) dan interaktivitas (JavaScript).

Bagaimana Kode HTML Bekerja?

Kode HTML terdiri dari tag-tag yang diapit oleh tanda kurung siku (< >). Setiap tag memiliki fungsi spesifik. Misalnya, tag <h1> digunakan untuk membuat judul utama, sedangkan tag <p> digunakan untuk membuat paragraf.

Contoh Sederhana:

<!DOCTYPE html>
<html>
<head>
  <title>Contoh Halaman HTML</title>
</head>
<body>
  <h1>Selamat Datang!</h1>
  <p>Ini adalah paragraf pertama dalam halaman ini.</p>
</body>
</html>

Penjelasan:

  • <!DOCTYPE html>: Deklarasi tipe dokumen HTML.
  • <html>: Tag pembuka dan penutup untuk keseluruhan dokumen HTML.
  • <head>: Bagian kepala dokumen, berisi informasi tentang halaman.
  • <title>: Menentukan judul halaman yang akan ditampilkan pada tab browser.
  • <body>: Bagian tubuh dokumen, berisi konten yang akan ditampilkan pada halaman.
  • <h1>: Tag untuk membuat judul tingkat 1.
  • <p>: Tag untuk membuat paragraf.

Cara Kerja:

  1. Penulisan Kode: Kamu menulis kode HTML menggunakan editor teks atau IDE (Integrated Development Environment).
  2. Penyimpanan: Simpan file dengan ekstensi .html (misalnya, index.html).
  3. Pembukaan di Browser: Buka file HTML tersebut menggunakan browser web.
  4. Rendering: Browser akan membaca kode HTML dan merendernya menjadi halaman web yang bisa dilihat.

Contoh Kode HTML yang Lebih Lengkap:

<!DOCTYPE html>
<html>
<head>
  <title>Contoh Halaman HTML</title>
</head>
<body>
  <h1>Selamat Datang di Dunia Pemrograman Web!</h1>
  <p>HTML adalah bahasa markup yang digunakan untuk membuat struktur halaman web.</p>
  <img src="gambar.jpg" alt="Gambar contoh">
  <ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
  </ul>
  <a href="https://www.example.com">Kunjungi Website Contoh</a>
</body>
</html>

Penjelasan:

  • <img>: Menambahkan gambar ke halaman.
  • <ul>: Membuat daftar tidak bernomor.
  • <li>: Item dalam daftar.
  • <a>: Membuat tautan ke halaman lain.

Kesimpulan

HTML adalah fondasi penting dalam pengembangan web. Dengan memahami dasar-dasar HTML, kamu dapat mulai membangun halaman web sederhana dan secara bertahap mengembangkan kemampuanmu untuk membuat website yang lebih kompleks dan interaktif.

Share: Facebook Twitter Linkedin