Memahami Landasan Web: Menjelajah Dunia HTML

Share

HyperText Markup Language (HTML) adalah bahasa fundamental yang menjadi fondasi bagi hampir semua halaman web di internet. Ia bertindak sebagai kerangka yang mendefinisikan struktur dan konten halaman web, memungkinkan peramban web (browser) untuk menampilkan teks, gambar, video, dan elemen interaktif lainnya dengan cara yang terstruktur dan terbaca. 


Artikel ini akan menjadi panduan komprehensif bagi Anda yang ingin memahami dan mempelajari HTML. Artikel ini akan membawa Anda dalam perjalanan untuk memahami seluk beluk HTML, mulai dari konsep dasar hingga elemen-elemen yang lebih kompleks. 


Bab 1: Perkenalan dengan HTML

1.1 Apa Itu HTML?

HTML singkatan dari HyperText Markup Language, yaitu bahasa markup yang digunakan untuk membuat halaman web. Bahasa markup sendiri adalah bahasa yang digunakan untuk menandai (mark up) teks agar dapat ditafsirkan dengan cara tertentu. Tag (tanda) HTML ditempatkan di dalam teks untuk memberi tahu browser web bagaimana menampilkan konten tersebut. 

Contoh sederhana:

<!DOCTYPE html>
<html>
<head>
  <title>Contoh Halaman Web</title>
</head>
<body>
  <h1>Selamat datang di halaman web sederhana!</h1>
  <p>Ini adalah paragraf yang berisi teks.</p>
</body>

Dalam contoh ini, tag '<html>' menandakan awal dan akhir dokumen HTML. Tag '<head>' menampung informasi tentang halaman web, seperti judul ('<title>') yang akan ditampilkan di tab browser. Sementara itu, tag '<body>' berisi konten utama halaman yang akan ditampilkan di jendela browser. Setiap paragraf ditandai dengan tag '<p>'. 


1.2 Sejarah Singkat HTML

HTML pertama kali dikembangkan oleh Tim Berners-Lee pada tahun 1989 sebagai sarana untuk berbagi informasi di antara para peneliti di CERN, sebuah organisasi penelitian fisika di Swiss. Seiring dengan perkembangan internet, HTML pun terus berevolusi. Spesifikasi HTML saat ini dikelola oleh World Wide Web Consortium (W3C), sebuah konsorsium internasional yang menyusun standar untuk web. Versi terbaru dari HTML adalah HTML5, yang diperkenalkan pada tahun 2014 dan membawa banyak fitur baru dan menarik.


1.3 Mengapa Mempelajari HTML?

Mempelajari HTML sangatlah bermanfaat, terutama bagi Anda yang:

  • Ingin membuat website sendiri: Dengan memahami HTML, Anda bisa membangun website sederhana atau bahkan kompleks, tanpa harus bergantung pada platform atau jasa pembuatan website.
  • Ingin memahami struktur website: Mempelajari HTML akan membantu Anda memahami bagaimana website dibangun, sehingga Anda dapat menavigasi dan berinteraksi dengan website dengan lebih baik.
  • Ingin berkarier di bidang web development: Menguasai HTML adalah bekal dasar yang penting untuk memasuki dunia web development. HTML menjadi landasan untuk mempelajari bahasa pemrograman lain seperti JavaScript dan CSS, sehingga Anda bisa menciptakan website yang lebih dinamis dan interaktif.


Bab 2: Struktur Dasar Dokumen HTML

2.1 Deklarasi Dokumen (DOCTYPE)

Setiap dokumen HTML harus dimulai dengan deklarasi dokumen (DOCTYPE). Deklarasi ini memberitahu browser web versi HTML yang digunakan dan membantu browser dalam merender halaman web dengan benar.

Contoh:

<!DOCTYPE html>


2.2 Elemen HTML

Dokumen HTML terdiri dari elemen-elemen (elements) yang didefinisikan menggunakan tag pembuka ('<tag>') dan tag penutup ('</tag>'). Tag pembuka menandai awal elemen, sedangkan tag penutup menandai akhir elemen. 


Beberapa elemen dasar HTML:

  • '<html>': Elemen ini menandai awal dan akhir dokumen HTML.
  • '<head>': Elemen ini berisi informasi tentang halaman web, seperti judul (`<title>`), meta tag, dan link ke file eksternal.
  • '<body>': Elemen ini berisi konten utama halaman web yang akan ditampilkan di jendela browser.
  • '<h1>' - '<h6>': Elemen ini digunakan untuk membuat heading (judul) dengan berbagai ukuran.
  • '<p>': Elemen ini digunakan untuk membuat paragraf.
  • '<img>': Elemen ini digunakan untuk menampilkan image (gambar).
  • '<a>': Elemen ini digunakan untuk membuat hyperlink (tautan) ke halaman web lain atau bagian lain dalam halaman yang sama.


2.3 Atribut

Atribut adalah properti tambahan yang dapat ditambahkan ke tag untuk memberikan informasi lebih lanjut tentang elemen tersebut. Atribut ditulis di dalam tag pembuka, dan terdiri dari nama atribut dan nilai yang dipisahkan oleh tanda sama dengan ('=').

Contoh:

<img src="gambar.jpg" alt="Gambar pemandangan" width="300" height="2

Komentar