msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '24e4040c9e'
${ noResults }
Web-Dev-For-Beginners/translations/ms/3-terrarium/1-intro-to-html/assignment.md

4.0 KiB
Raw Blame History Escape

Tugasan Amali HTML: Membina Reka Bentuk Blog

Objektif

Reka bentuk dan kodkan struktur HTML untuk laman utama blog peribadi. Latihan ini akan membantu anda mempraktikkan HTML semantik, perancangan susun atur, dan pengorganisasian kod.

Arahan

  1. Reka Bentuk Reka Bentuk Blog Anda

    • Lukiskan reka bentuk visual untuk laman utama blog anda. Sertakan bahagian utama seperti header, navigasi, kandungan utama, sidebar, dan footer.
    • Anda boleh menggunakan kertas dan imbas lakaran anda, atau gunakan alat digital (contohnya, Figma, Adobe XD, Canva, atau PowerPoint).

  2. Kenal Pasti Elemen HTML

    • Senaraikan elemen HTML yang anda rancang untuk digunakan bagi setiap bahagian (contohnya, <header>, <nav>, <main>, <article>, <aside>, <footer>, <section>, <h1>–<h6>, <p>, <img>, <ul>, <li>, <a>, dll.).

  3. Tulis Markup HTML

    • Kodkan HTML untuk reka bentuk anda secara manual. Fokus pada struktur semantik dan amalan terbaik.
    • Sertakan sekurang-kurangnya 10 elemen HTML yang berbeza.
    • Tambahkan komen untuk menerangkan pilihan dan struktur anda.

  4. Hantar Kerja Anda

    • Muat naik lakaran/reka bentuk anda dan fail HTML anda.
    • Secara pilihan, berikan refleksi ringkas (2–3 ayat) tentang keputusan reka bentuk anda.

Rubrik

Kriteria Cemerlang Memadai Perlu Penambahbaikan
Reka Bentuk Visual Reka bentuk yang jelas, terperinci dengan bahagian berlabel dan susun atur yang teliti Reka bentuk asas dengan beberapa bahagian berlabel Reka bentuk minimum atau tidak jelas; tiada label bahagian
Elemen HTML Menggunakan 10+ elemen HTML semantik; menunjukkan pemahaman struktur dan amalan terbaik Menggunakan 5–9 elemen HTML; beberapa struktur semantik Menggunakan kurang daripada 5 elemen; tiada struktur semantik
Kualiti Kod Kod yang teratur, mudah dibaca dengan komen; mematuhi piawaian HTML Kod yang agak teratur; sedikit komen Kod tidak teratur; tiada komen
Refleksi Refleksi yang mendalam tentang pilihan reka bentuk dan cabaran Refleksi asas Tiada refleksi atau tidak relevan

Petua

  • Gunakan tag HTML semantik untuk aksesibiliti dan SEO yang lebih baik.
  • Susun kod anda dengan indentasi dan komen.
  • Rujuk Rujukan Elemen HTML MDN untuk panduan.
  • Fikirkan bagaimana susun atur anda boleh diperluaskan atau digayakan dalam tugasan masa depan.

Penafian:
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI Co-op Translator. Walaupun kami berusaha untuk memastikan ketepatan, sila ambil perhatian bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang berwibawa. Untuk maklumat yang kritikal, terjemahan manusia profesional adalah disyorkan. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.