Dasar-Dasar HTML Untuk Pemula
Selamat datang di seri panduan Dasar-Dasar HTML untuk Pemula! Pernahkah Anda bertanya-tanya bagaimana sebuah website bisa terbentuk? Jawabannya dimulai dari satu pondasi utama: HTML. Di sini, kita tidak hanya akan belajar mengetik kode, tapi memahami bagaimana membangun kerangka website yang solid dari nol. Seri tutorial ini dirancang secara sistematis, mulai dari pengenalan struktur dasar, elemen visual, hingga cara membuat website Anda tampil cantik dan interaktif. Mari kita mulai perjalanan menjadi seorang web developer melalui daftar isi lengkap di bawah ini.
BAGIAN 1: DASAR PALING PENTING
- HTML Dasar #1 – Apa Itu HTML? Cara Kerja dan Tools yang Dibutuhkan
- HTML Dasar #2 – Struktur Dasar HTML: Doctype, html, head, body
- HTML Dasar #3 – Tag Heading (h1-h6) dan Paragraf (p)
- HTML Dasar #4 – Memformat Teks: Bold, Italic, Underline (b, strong, i, em, u)
- HTML Dasar #5 – Komentar di HTML: Untuk Catatan dan Debugging
BAGIAN 2: TAG HTML YANG SERING DIPAKAI SEHARI-HARI
- HTML Dasar #6 – Membuat Link (a) dan Atribut href, target, title
- HTML Dasar #7 – Menambahkan Gambar (img) dengan src, alt, width, height
- HTML Dasar #8 – Membuat Daftar: Ordered List (ol), Unordered List (ul), List Item (li)
- HTML Dasar #9 – Membuat Tabel Sederhana: table, tr, td, th
- HTML Dasar #10 – Menggabungkan Sel Tabel dengan colspan dan rowspan
- HTML Dasar #11 – Membuat Form (form) dan Method GET vs POST
- HTML Dasar #12 – Input Text, Password, Email, Number, dan Textarea
- HTML Dasar #13 – Radio Button, Checkbox, dan Select Dropdown
- HTML Dasar #14 – Tombol (button) dan Submit
- HTML Dasar #15 – Atribut Penting: placeholder, required, readonly, disabled
BAGIAN 3: DIV, SPAN, DAN LAYOUT DASAR (Tanpa CSS)
- HTML Dasar #16 – Perbedaan div dan span (Block vs Inline Element)
- HTML Dasar #17 – Tag Layout Dasar: header, nav, main, article, section, aside, footer
- HTML Dasar #18 – Membuat Layout Sederhana dengan div (Tanpa CSS)
- HTML Dasar #19 – Menggunakan br dan hr untuk Garis & Spasi
BAGIAN 4: MENGHUBUNGKAN CSS (Agar Tampilan Cantik)
- HTML Dasar #20 – 3 Cara Menambahkan CSS ke HTML: Inline, Internal, External
- HTML Dasar #21 – Mengenal Selector CSS: Tag, Class, ID
- HTML Dasar #22 – Properti CSS Wajib: color, background, font-size, text-align
- HTML Dasar #23 – Mengatur Margin dan Padding untuk Jarak
- HTML Dasar #24 – Mengatur Border dan Border Radius (Membuat Kartu)
- HTML Dasar #25 – Membuat Navigasi Bar (Navbar) Sederhana dengan CSS
BAGIAN 5: MENGHUBUNGKAN JAVASCRIPT (Agar Interaktif)
- HTML Dasar #26 – Cara Menambahkan JavaScript ke HTML (Inline, Internal, External)
- HTML Dasar #27 – Menampilkan Alert dan Prompt dengan JavaScript
- HTML Dasar #28 – Mengambil dan Mengubah Isi Elemen HTML (innerHTML, textContent)
- HTML Dasar #29 – Menambahkan Event Klik (onclick) pada Tombol
- HTML Dasar #30 – Menampilkan/Menyembunyikan Elemen dengan JavaScript
- HTML Dasar #31 – Membuat Counter Sederhana (Tombol + dan -)
BAGIAN 6: TARGET AKHIR – LAYOUT WEBSITE RESPONSIF
- HTML Dasar #32 – Apa Itu Responsive Web Design? Pengertian Viewport
- HTML Dasar #33 – Menggunakan Flexbox untuk Layout (display: flex)
- HTML Dasar #34 – Menggunakan Grid CSS untuk Layout Halaman
- HTML Dasar #35 – Media Query: Membuat Tampilan Berubah di HP, Tablet, PC
- HTML Dasar #36 – Membuat Navigasi Responsif (Hamburger Menu Sederhana)
- HTML Dasar #37 – Proyek Akhir: Membuat Layout Website Responsif (Header, Sidebar, Konten, Footer)
BAGIAN BONUS (Opsional)
- HTML Dasar #38 – Menggunakan Font Google di HTML
- HTML Dasar #39 – Menyisipkan YouTube Video dengan iframe
- HTML Dasar #40 – Menambahkan Favicon (Icon di Tab Browser)
- HTML Dasar #41 – Meta Tag untuk SEO dan Sosial Media (Open Graph)
- HTML Dasar #42 – Mendeploy Website HTML ke Hosting Gratis (Netlify/Vercel)
