Pengenalan HTML dan CSS: Dasar dari Dunia Web

byAuliya dhava wima Juni 18, 2024

Ketika kamu membuka halaman web — entah itu situs berita, media sosial, atau toko online — semua yang kamu lihat di layar sebenarnya berawal dari dua hal sederhana: HTML dan CSS.
Tanpa keduanya, internet hanya akan berisi teks polos tanpa warna, tata letak, atau gambar.

HTML dan CSS adalah bahasa dasar yang membentuk wajah dunia digital. Mari kita kenali keduanya lebih dekat.

🔹 Apa Itu HTML?

HTML adalah singkatan dari HyperText Markup Language. Ia bukan bahasa pemrograman, melainkan bahasa markup — bahasa yang digunakan untuk memberi struktur pada konten web.

Bayangkan kamu sedang menulis naskah buku. Ada bagian yang menjadi judul, subjudul, paragraf, gambar, dan tautan. HTML bekerja dengan cara yang sama: memberi tanda pada bagian-bagian konten agar browser tahu bagaimana menampilkannya.

Contoh sederhana:


Kode di atas memberi tahu browser bahwa teks pertama adalah judul besar (heading 1), dan teks berikutnya adalah paragraf biasa.

🔹 Struktur Dasar Sebuah Halaman HTML

Setiap halaman web memiliki kerangka umum seperti ini:


Bagian <head> menyimpan informasi tentang halaman (judul, link CSS, skrip, dan sebagainya).
Bagian <body> berisi semua yang akan tampil di layar pengguna — teks, gambar, video, tombol, dan lain-lain.

Dengan HTML saja, kamu sudah bisa menampilkan informasi di web. Namun tampilannya masih sederhana. Di sinilah CSS berperan.


🔹 Apa Itu CSS?

CSS (Cascading Style Sheets) digunakan untuk mengatur tampilan dan gaya visual dari halaman web.
Kalau HTML adalah rangka bangunan, maka CSS adalah cat dinding, furnitur, dan dekorasinya.

Dengan CSS, kamu bisa mengatur warna, ukuran huruf, jarak antar elemen, hingga tata letak halaman.
Contohnya:


Ketika digabungkan dengan HTML, hasilnya menjadi halaman yang lebih indah dan rapi.

🔹 Menggabungkan HTML dan CSS

CSS dapat ditulis di dalam berkas HTML dengan menggunakan tag <style>, seperti ini:


<!DOCTYPE html>

<html>

<head>

  <style>

    body {

      background-color: #f9f9f9;

      font-family: Arial, sans-serif;

    }

    h1 {

      color: #2a4d69;

    }

    p {

      color: #4b4b4b;

    }

  </style>

</head>

<body>

  <h1>Belajar HTML dan CSS</h1>

  <p>Langkah pertama menuju dunia web development.</p>

</body>

</html>

Ketika dibuka di browser, kamu akan melihat halaman dengan latar abu terang, judul berwarna biru, dan teks paragraf berwarna abu kehitaman.
Sederhana, tapi sudah terlihat seperti halaman web sungguhan.

🔹 Mengapa HTML dan CSS Penting?

Karena semua situs web di dunia dibangun di atas dua teknologi ini.
Framework modern seperti React, Vue, dan Angular tetap menggunakan HTML dan CSS sebagai dasarnya.
Bahkan aplikasi web besar seperti Gmail atau Netflix pun masih mengandalkan struktur HTML dan gaya CSS untuk tampilannya.

Bagi siapa pun yang ingin belajar membuat website, HTML dan CSS adalah titik awal wajib. Dengan menguasainya, kamu akan memahami bagaimana browser bekerja, bagaimana tampilan diatur, dan bagaimana membuat desain web yang responsif.

🔹 Penutup

Belajar HTML dan CSS ibarat belajar membaca dan menulis dalam dunia digital.
Keduanya sederhana, tapi menjadi fondasi dari semua hal yang kamu lihat di internet.

Mulailah dari yang kecil: buat satu halaman HTML, tambahkan sedikit gaya dengan CSS, lalu buka di browser.
Dari situ, kamu akan menyadari betapa menyenangkannya menciptakan sesuatu yang bisa dilihat dan digunakan oleh siapa saja di seluruh dunia.

Tags
Auliya dhava wima

Diposting oleh Auliya dhava wima

Posting Komentar

0 Komentar