آموزش جامع هدینگ‌ها در HTML

🎯 اهداف یادگیری

• آشنایی با تگ‌های h1 تا h6 در HTML
• یادگیری اهمیت سلسله مراتب هدینگ‌ها
• توانایی استفاده صحیح از هدینگ‌ها برای SEO
• آشنایی با استایل‌دهی هدینگ‌ها

📌 تگ‌های هدینگ در HTML

۱. انواع تگ‌های هدینگ

HTML شش سطح هدینگ از h1 تا h6 ارائه می‌دهد:

<h1>عنوان اصلی صفحه (سطح 1)</h1>
<h2>عنوان فرعی (سطح 2)</h2>
<h3>زیرعنوان (سطح 3)</h3>
<h4>عنوان جزئی (سطح 4)</h4>
<h5>عنوان کم اهمیت (سطح 5)</h5>
<h6>عنوان کم‌اهمیت‌ترین (سطح 6)</h6>

۲. سلسله مراتب هدینگ‌ها

• h1: مهم‌ترین عنوان صفحه - فقط یک بار استفاده شود
• h2: عنوان‌های اصلی بخش‌های صفحه
• h3: زیربخش‌های h2
• h4-h6: عنوان‌های جزئی‌تر - کمتر استفاده می‌شوند

📌 اهمیت هدینگ‌ها برای SEO

۱. بهینه‌سازی برای موتورهای جستجو

هدینگ‌ها نقش مهمی در سئو دارند:

<h1>آموزش کامل HTML برای مبتدیان</h1>
<h2>معرفی HTML</h2>
<h3>تاریخچه HTML</h3>

۲. نکات کلیدی برای SEO

• همیشه از h1 برای عنوان اصلی صفحه استفاده کنید
• از پرش بین سطوح هدینگ خودداری کنید (مثلاً از h2 مستقیم به h4 نروید)
• هدینگ‌ها باید محتوای بخش بعدی را به دقت توصیف کنند
• از کلمات کلیدی در هدینگ‌ها استفاده کنید، اما به صورت طبیعی

📌 استایل‌دهی هدینگ‌ها

۱. تغییر ظاهر هدینگ‌ها با CSS

می‌توانید ظاهر پیش‌فرض هدینگ‌ها را تغییر دهید:

h1 {
    color: #2c3e50;
    font-family: 'Tahoma', sans-serif;
    border-bottom: 2px solid #3498db;
    padding-bottom: 10px;
}

۲. استفاده از کلاس‌ها برای هدینگ‌ها

برای کنترل بهتر می‌توانید از کلاس‌ها استفاده کنید:

<h2 class="section-title">عنوان بخش</h2>

📌 تمرین عملی

ساختار هدینگ‌های زیر را برای یک مقاله آموزشی اصلاح کنید:

<h3>آموزش برنامه‌نویسی وب</h3>
<h1>یادگیری HTML</h1>
<h4>معرفی تگ‌های پایه</h4>
<h2>تگ‌های هدینگ</h2>

راهنمای تمرین:

1. سلسله مراتب صحیح هدینگ‌ها را رعایت کنید
2. تنها یک h1 در صفحه داشته باشید
3. ترتیب منطقی هدینگ‌ها را حفظ کنید
4. برای زیربخش‌ها از h3 استفاده کنید

📌 نکات طلایی استفاده از هدینگ‌ها

• خوانایی: هدینگ‌ها باید محتوای بخش را به وضوح توصیف کنند
• ساختار منطقی: از سلسله مراتب صحیح استفاده کنید
• طول مناسب: هدینگ‌ها نباید خیلی طولانی یا خیلی کوتاه باشند
• استفاده به جا: فقط برای عناوین واقعی از هدینگ‌ها استفاده کنید، نه برای متن‌های معمولی

📌 قدم بعدی

در درس بعدی با پاراگراف‌ها و متن‌ها در HTML آشنا خواهیم شد!