# Tugasan Amali HTML: Membina Reka Bentuk Blog ## Objektif Pembelajaran Gunakan pengetahuan HTML anda dengan mereka bentuk dan menulis kod struktur laman utama blog yang lengkap. Tugasan praktikal ini akan mengukuhkan konsep HTML semantik, amalan terbaik kebolehaksesan, dan kemahiran organisasi kod profesional yang akan anda gunakan sepanjang perjalanan pembangunan web anda. **Dengan menyelesaikan tugasan ini, anda akan:** - Berlatih merancang susun atur laman web sebelum menulis kod - Menggunakan elemen HTML semantik dengan betul - Mencipta markup yang boleh diakses dan tersusun dengan baik - Membangunkan tabiat pengekodan profesional dengan komen dan organisasi ## Keperluan Projek ### Bahagian 1: Perancangan Reka Bentuk (Reka Bentuk Visual) **Cipta reka bentuk visual laman utama blog anda yang merangkumi:** - Header dengan tajuk laman dan navigasi - Kawasan kandungan utama dengan sekurang-kurangnya 2-3 pratonton pos blog - Sidebar dengan maklumat tambahan (bahagian tentang, pos terkini, kategori) - Footer dengan maklumat hubungan atau pautan **Pilihan Penciptaan Reka Bentuk:** - **Lakaran tangan**: Gunakan kertas dan pensel, kemudian ambil gambar atau imbas reka bentuk anda - **Alat digital**: Figma, Adobe XD, Canva, PowerPoint, atau mana-mana aplikasi lukisan - **Alat wireframe**: Balsamiq, MockFlow, atau perisian wireframe yang serupa **Labelkan bahagian reka bentuk anda** dengan elemen HTML yang anda rancang untuk digunakan (contohnya, "Header - `

`", "Pos Blog - `

`"). ### Bahagian 2: Perancangan Elemen HTML **Cipta senarai yang memetakan setiap bahagian reka bentuk anda kepada elemen HTML tertentu:** ``` Example: - Site Header →

- Main Navigation →