<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "5a764667bbe82aa72ac0a67f4c97ff4a",
  "translation_date": "2025-10-03T09:15:08+00:00",
  "source_file": "3-terrarium/1-intro-to-html/assignment.md",
  "language_code": "bn"
}
-->
# HTML প্র্যাকটিস অ্যাসাইনমেন্ট: একটি ব্লগ মকআপ তৈরি করুন

## লক্ষ্য

একটি ব্যক্তিগত ব্লগ হোমপেজের জন্য HTML কাঠামো ডিজাইন এবং হাতে কোড করা। এই অনুশীলনটি আপনাকে সেমান্টিক HTML, লেআউট পরিকল্পনা এবং কোড সংগঠনের দক্ষতা উন্নত করতে সাহায্য করবে।

## নির্দেশাবলী

1. **আপনার ব্লগ মকআপ ডিজাইন করুন**
   - আপনার ব্লগ হোমপেজের একটি ভিজ্যুয়াল মকআপ স্কেচ করুন। এতে প্রধান অংশগুলি অন্তর্ভুক্ত করুন যেমন হেডার, নেভিগেশন, মেইন কন্টেন্ট, সাইডবার এবং ফুটার।
   - আপনি কাগজে স্কেচ করতে পারেন এবং সেটি স্ক্যান করতে পারেন, অথবা ডিজিটাল টুলস (যেমন Figma, Adobe XD, Canva, বা এমনকি PowerPoint) ব্যবহার করতে পারেন।

2. **HTML উপাদান চিহ্নিত করুন**
   - প্রতিটি অংশের জন্য আপনি যে HTML উপাদানগুলি ব্যবহার করবেন তা তালিকাভুক্ত করুন (যেমন `<header>`, `<nav>`, `<main>`, `<article>`, `<aside>`, `<footer>`, `<section>`, `<h1>`–`<h6>`, `<p>`, `<img>`, `<ul>`, `<li>`, `<a>` ইত্যাদি)।

3. **HTML মার্কআপ লিখুন**
   - আপনার মকআপের জন্য HTML হাতে কোড করুন। সেমান্টিক কাঠামো এবং সেরা অনুশীলনের উপর মনোযোগ দিন।
   - অন্তত ১০টি ভিন্ন HTML উপাদান অন্তর্ভুক্ত করুন।
   - আপনার পছন্দ এবং কাঠামো ব্যাখ্যা করতে মন্তব্য যোগ করুন।

4. **আপনার কাজ জমা দিন**
   - আপনার স্কেচ/মকআপ এবং HTML ফাইল আপলোড করুন।
   - ঐচ্ছিকভাবে, আপনার ডিজাইন সিদ্ধান্ত সম্পর্কে সংক্ষিপ্ত প্রতিফলন (২-৩ বাক্য) প্রদান করুন।

## মূল্যায়ন সূচক

| মানদণ্ড          | চমৎকার                                                                                     | পর্যাপ্ত                                                                         | উন্নতির প্রয়োজন                                                               |
|------------------|--------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------|---------------------------------------------------------------------------------|
| ভিজ্যুয়াল মকআপ  | পরিষ্কার, বিস্তারিত মকআপ যেখানে অংশগুলি লেবেল করা এবং চিন্তাশীল লেআউট রয়েছে               | মৌলিক মকআপ যেখানে কিছু অংশ লেবেল করা হয়েছে                                     | ন্যূনতম বা অস্পষ্ট মকআপ; অংশগুলির লেবেল নেই                                    |
| HTML উপাদান      | ১০+ সেমান্টিক HTML উপাদান ব্যবহার; কাঠামো এবং সেরা অনুশীলনের বোঝাপড়া প্রদর্শন করে         | ৫–৯ HTML উপাদান ব্যবহার; কিছু সেমান্টিক কাঠামো                                   | ৫টির কম উপাদান ব্যবহার; সেমান্টিক কাঠামোর অভাব                                  |
| কোডের গুণমান     | সুসংগঠিত, পাঠযোগ্য কোড যেখানে মন্তব্য রয়েছে; HTML মান অনুসরণ করে                          | বেশিরভাগ ক্ষেত্রে সংগঠিত কোড; কিছু মন্তব্য                                      | বিশৃঙ্খল কোড; মন্তব্যের অভাব                                                   |
| প্রতিফলন         | ডিজাইন সিদ্ধান্ত এবং চ্যালেঞ্জ সম্পর্কে অন্তর্দৃষ্টিপূর্ণ প্রতিফলন                          | মৌলিক প্রতিফলন                                                                   | প্রতিফলন নেই বা প্রাসঙ্গিক নয়                                                  |

## টিপস

- আরও ভালো অ্যাক্সেসিবিলিটি এবং SEO-এর জন্য সেমান্টিক HTML ট্যাগ ব্যবহার করুন।
- ইনডেন্টেশন এবং মন্তব্য দিয়ে আপনার কোড সংগঠিত করুন।
- নির্দেশনার জন্য [MDN HTML Elements Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) দেখুন।
- ভবিষ্যতের অ্যাসাইনমেন্টে কীভাবে আপনার লেআউট প্রসারিত বা স্টাইল করা যেতে পারে তা নিয়ে ভাবুন।

---

**অস্বীকৃতি**:  
এই নথিটি AI অনুবাদ পরিষেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনুবাদ করা হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবে অনুগ্রহ করে মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। মূল ভাষায় থাকা নথিটিকে প্রামাণিক উৎস হিসেবে বিবেচনা করা উচিত। গুরুত্বপূর্ণ তথ্যের জন্য, পেশাদার মানব অনুবাদ সুপারিশ করা হয়। এই অনুবাদ ব্যবহারের ফলে কোনো ভুল বোঝাবুঝি বা ভুল ব্যাখ্যা হলে আমরা দায়বদ্ধ থাকব না।