HTML Itu Apa Sih? Kenapa Perlu Belajar?

Wih, selamat datang di dunia koding! Atau lebih tepatnya, di gerbang awal dunia web development. Kalau kamu punya cita-cita pengen bisa bikin website sendiri, entah itu buat blog pribadi, portofolio keren, atau bahkan toko online, nah, belajar HTML ini adalah langkah paling pertama dan paling penting.

Gak usah takut duluan denger istilah "bahasa markup" atau "koding". HTML ini seru dan relatif gampang dipelajari, kok! Anggap aja kita lagi mau bikin rumah. HTML ini kayak kerangka dasar rumahnya: ada pondasi, tiang-tiang, sama dinding-dinding kasarnya. Dia yang nentuin struktur utama dan apa aja isi dari sebuah halaman web.

Di pelajaran ini, kita bakal ngobrol santai soal:

Apa itu HTML (HyperText Markup Language)? Kita bedah singkat artinya biar gak penasaran.
Kenapa HTML itu penting banget dan jadi tulang punggung setiap website.
Gimana caranya bikin halaman HTML super sederhana pertama kamu (serius, gampang banget!).
"Alat tempur" apa aja yang kamu butuhin buat mulai (spoiler: gratis semua!).

Siap? Yuk, mulai petualangan kita!

Membongkar Kepanjangan HTML: HyperText Markup Language

Oke, kita kulik dikit namanya biar makin akrab. HTML itu singkatan dari HyperText Markup Language.

HyperText: Bayangin kamu lagi baca artikel online. Terus ada kata atau kalimat yang warnanya beda, kalau diklik, eh, pindah ke halaman lain. Nah, kemampuan buat nge-link dari satu dokumen ke dokumen lain inilah yang disebut "HyperText". Ini yang bikin web jadi saling terhubung kayak jaring laba-laba raksasa!
Markup Language: "Markup" itu artinya "menandai". Jadi, HTML ini adalah bahasa yang tugasnya menandai berbagai bagian dari konten kita. Misalnya, "Eh, ini judul ya!", "Yang ini paragraf biasa," "Kalau yang ini gambar." Browser (kayak Chrome, Firefox) nantinya bakal baca tanda-tanda ini buat nampilin halaman web dengan benar.
- Penting nih: HTML itu bukan bahasa pemrograman kayak Python atau JavaScript ya. HTML gak bisa bikin logika "jika-maka" atau ngitung matematika yang rumit. Tugasnya murni buat ngasih struktur dan makna ke konten.

Jadi, simpelnya, HTML adalah bahasa standar yang kita pakai buat bikin struktur dan konten halaman web, lengkap dengan kemampuan buat ngasih link ke halaman lain.

Kenapa Sih HTML Itu Penting Banget?

Kalau kamu bertanya-tanya, "Sepenting apa sih HTML ini?", jawabannya: PENTING BANGET!

Pondasi Semua Website: Coba buka website apa aja, dari Google, Facebook, Detik.com, sampai website kampusmu. Semuanya, tanpa terkecuali, dibangun di atas HTML. HTML itu kayak udara buat website, wajib ada!
Dimengerti Semua Browser: Semua browser (Google Chrome, Mozilla Firefox, Safari, Edge, dll) dirancang buat "ngerti" dan nampilin kode HTML. Jadi, apa yang kamu tulis di HTML bakal diterjemahin jadi tampilan visual yang kita lihat.
Gerbang ke Teknologi Web Lain: Kalau mau jago bikin web, HTML ini kuncinya. Setelah paham HTML, kamu bakal lebih gampang belajar CSS (buat mempercantik tampilan web, ibarat ngecat dan ngasih perabotan ke rumah) dan JavaScript (buat bikin web jadi interaktif, ibarat ngasih listrik dan barang elektronik ke rumah).
Relatif Mudah Dipelajari: Dibanding bahasa pemrograman lain, sintaks HTML itu lebih sederhana dan intuitif. Cocok banget buat pemula yang baru mau nyemplung ke dunia digital.

Intinya, tanpa HTML, gak ada tuh yang namanya tampilan website keren, artikel berita, video YouTube yang kamu tonton, atau toko online tempat kamu belanja. Semuanya berawal dari HTML.

Halaman HTML Pertamamu: "Hello, Dunia Digital!"

Udah gak sabar mau coba? Yuk, kita bikin halaman HTML pertama kita. Gampang banget, cuma butuh beberapa baris kode aja.

html

<!DOCTYPE html>
<html>
<head>
    <title>Halaman Pertamaku</title>
</head>
<body>
 
    <h1>Halo Dunia!</h1>
    <p>Ini adalah website pertama yang aku buat pakai HTML. Keren kan?</p>
 
</body>
</html>

Penjelasan Singkat (detailnya di pelajaran berikutnya ya!):

<!DOCTYPE html>: Ini kayak ngasih tau browser, "Hei, dokumen ini pakai HTML versi terbaru ya!"
<html>: Ini tag pembuka dan penutup utama yang ngebungkus semua konten HTML kita.
<head>: Bagian ini isinya informasi buat browser, gak bakal keliatan langsung di halaman web.
- <title>: Nah, teks di sini bakal muncul di judul tab browser kamu.
<body>: Semua yang mau kamu tampilin di halaman web (teks, gambar, video, dll) ditaruh di sini.
- <h1>: Ini buat bikin judul utama yang paling gede.
- <p>: Ini buat bikin paragraf.

Cara Menjalankannya:

Buka aplikasi teks editor (lihat bagian "Alat Tempur" di bawah).
Salin (copy) kode di atas dan tempel (paste) ke teks editor.
Simpan file tersebut dengan nama index.html (atau nama apa aja, tapi pastikan akhirannya .html).
Buka file index.html tadi pakai browser (klik kanan > Open with > pilih browser-mu).

Tadaaa! Selamat! Kamu baru aja bikin halaman web pertamamu! Gimana, seru kan?

"Alat Tempur" Buat Ngoding HTML

Buat mulai ngoding HTML, kamu cuma butuh dua hal utama:

Browser Web (Web Browser)
- Ini adalah software yang kamu pakai buat menjelajah internet dan nampilin halaman web. Contohnya: Google Chrome, Mozilla Firefox, Microsoft Edge, Safari, Opera.
- Kamu pasti udah punya salah satunya ter-install di komputermu. Browser ini yang bakal "membaca" kode HTML-mu dan menampilkannya jadi halaman yang bisa dilihat.
Teks Editor (Text Editor)
- Ini adalah software tempat kamu menulis dan mengedit kode HTML-mu.
- Penting: Jangan pakai Microsoft Word atau Google Docs ya! Mereka itu word processor, bukan teks editor buat koding. Kita butuh yang bisa nyimpen file sebagai plain text.
- Pilihan Teks Editor:
  - Yang Udah Ada Bawaan OS:
    - Notepad (Windows): Sederhana banget, tapi cukuplah buat awal-awal.
    - TextEdit (macOS): Mirip Notepad. Pastikan kamu atur formatnya jadi "Plain Text" (Format > Make Plain Text).
  - Yang Lebih Canggih (dan Gratis! Direkomendasikan):
    - Visual Studio Code (VS Code): Ini populer banget di kalangan developer. Fiturnya lengkap, ada syntax highlighting (kode jadi berwarna-warni biar gampang dibaca), auto-completion (bantu ngelengkapin kode), dan banyak ekstensi keren. Sangat direkomendasikan!
    - Sublime Text: Ringan, cepat, dan banyak fiturnya. Ada versi gratisnya.
    - Atom: Mirip VS Code, dikembangin sama GitHub.
- Saran saya, langsung aja coba install VS Code. Awalnya mungkin keliatan banyak tombol, tapi pelan-pelan juga bakal terbiasa dan kerasa banget manfaatnya. Baca Panduannya disini

Cuma itu aja kok! Dengan browser dan teks editor, kamu udah siap buat menaklukkan dunia HTML!

Tes Pengetahuan HTML Dasar

Pertanyaan 1 dari 2

Apa kepanjangan dari HTML?