Dasar PPLGSemester 1Pertemuan 8 · 1 Pertemuan × 5 JP (1 JP = 45 menit)

HTML Dasar

Modul ajar pertemuan 8 mata pelajaran Dasar PPLG: html dasar.

#html#semantik#web#struktur-dokumen

MODUL AJAR — Dasar PPLG

Penyusun(isi nama guru)
JenjangSMK
Sekolah(isi nama sekolah)
Kelas/SemesterX / 1 (Ganjil)
Tahun Pelajaran2025/2026
FaseE
ElemenPemrograman Web Dasar (HTML/CSS/JS)
Kode Tujuan PembelajaranDP-E1.8
Alokasi Waktu5 JP × 45 menit = 225 menit (1 pertemuan)

1. Identitas Modul

KomponenKeterangan
Nama Penyusun(isi nama guru)
Institusi(isi nama sekolah)
Mata PelajaranDasar PPLG (Dasar-dasar Program Keahlian PPLG)
Kelas/SemesterX / 1 (Ganjil)
FaseE
ElemenPemrograman Web Dasar (HTML/CSS/JS)
TopikHTML dasar: struktur dokumen, elemen dasar, form, semantic HTML
Kode Tujuan PembelajaranDP-E1.8
Tahun Pelajaran2025/2026
Alokasi Waktu5 JP × 45 menit = 225 menit (1 pertemuan)

2. Kompetensi Awal

Peserta didik diharapkan telah memiliki:

  1. VS Code dan Live Server yang terpasang (prasyarat dari Modul 05).
  2. Kebiasaan membuka dan melihat halaman web.
  3. Disiplin dan budaya kerja dari Modul 04 (observasi 04 berlanjut).
  4. Tidak diperlukan pengalaman menulis HTML sebelumnya.

3. Dimensi Profil Lulusan

Dimensi yang dikuatkan pada modul ini beserta implementasi konkretnya:

DimensiImplementasi Konkret pada Modul Ini
Penalaran KritisMenyusun struktur informasi yang logis (semantic HTML)
KreativitasMerancang halaman profil pribadi dengan struktur sendiri
KemandirianMenyelesaikan praktik HTML secara mandiri
KesehatanMenerapkan ergonomi menulis kode (postur, jeda — koneksi Modul 03)

Observasi budaya kerja (tenggat tugas praktik) tetap dicatat di 04 - Instrumen Observasi Disposisi PPLG.md Bagian A.

4. Sarana dan Prasarana

  1. Lab komputer dengan VS Code dan ekstensi Live Server terpasang.
  2. Proyektor/LCD untuk demo Inspect dan code-along.
  3. Kartu Tag HTML (Lampiran 5) — print pada kertas tebal, gunting.
  4. LKPD "Halaman Profil Pribadi (HTML)" (Lampiran 1) — print sesuai jumlah peserta didik.
  5. Bahan bacaan peserta didik (Lampiran 4) — print sesuai jumlah peserta didik.
  6. Infografis Struktur Dokumen & Semantic HTML (Lampiran 6) — tayang atau print A3/A4.
  7. Lembar observasi praktik (Lampiran 2) dan instrumen 04 Bagian A.
  8. Soal kuis formatif dan soal TKA sumatif beserta kunci (Lampiran 9 dan Bagian G.3).
  9. Contoh file profil.html lengkap (untuk demonstrasi) di repositori guru.

5. Target Peserta Didik

KategoriLayanan
RegulerSeluruh peserta didik kelas X PPLG mengikuti alur utama pembelajaran
Pencapaian tinggiPengayaan: menambahkan tabel, video, atau menu navigasi tautan internal; mengecek halaman dengan validator HTML
Kesulitan belajarPendampingan; latihan ulang struktur dokumen dengan template; menyusun satu bagian halaman secara bertahap

6. Model Pembelajaran

AspekUraian
PendekatanPembelajaran terdiferensiasi (yang sudah mengenal HTML menjadi mentor pasangan)
ModelDemonstrasi (code-along) dipadukan praktik mandiri
MetodeDemonstrasi, praktik langsung, review pasangan, tanya jawab, refleksi
MediaVS Code + Live Server, Kartu Tag HTML, infografis struktur, validator HTML daring
Sumber belajarBahan bacaan lampiran, MDN Web Docs, W3Schools, dokumentasi VS Code