تیترهای HTML
از قبل میتوانید عنصر و attribute بنویسید. این جلسه روی تیترها تمرکز دارد — تگهایی که عنوان اصلی و عنوان بخشهای صفحه را مشخص میکنند. تیتر خوب به خواننده کمک میکند صفحه را مرور کند و به مرورگر و ابزارهای کمکی کمک میکند ساختار را بفهمند.
تیترهای HTML چیستند؟
تیترهای HTML شش سطح عنواناند: h1، h2، h3، h4، h5 و h6. h1 بالاترین سطح تیتر در صفحه است. h6 پایینترین است. این تگها برای معنا و ساختارند. اندازهٔ ظاهری را بعداً با CSS میتوان عوض کرد؛ سطح تیتر را فقط بهخاطر بزرگتر یا کوچکتر بودن متن انتخاب نکنید.
پاسخ مستقیم
از تیترها برای ساختن یک طرح کلی روشن استفاده کنید. برای موضوع صفحه یک h1 روشن ترجیح دهید. برای بخشهای اصلی زیر آن موضوع از h2، سپس برای زیربخشها از h3 و به همین ترتیب استفاده کنید. وقتی میتوانید سطوح را مرتب نگه دارید — پرش از h1 مستقیم به h4 معمولاً دنبال کردن طرح کلی را سختتر میکند.
سطوح تیتر
html<h1>عنوان اصلی صفحه</h1>
<h2>عنوان بخش</h2>
<h3>عنوان زیربخش</h3>
<p>متن پاراگراف زیر زیربخش.</p>خواندن مثال
h1موضوع کل صفحه را معرفی میکندh2یک بخش اصلی زیر آن موضوع را شروع میکندh3بخش کوچکتری داخل آن بخش را شروع میکند- پاراگراف متن عادی بدنه است، نه تیتر
چرا ترتیب تیتر مهم است
تیترها یک طرح کلی سند میسازند، شبیه فهرست مطالب. صفحهخوانها و بعضی ابزارهای SEO از آن طرح استفاده میکنند. اگر فقط برای ظاهر سطوح را رد کنید، ساختار گیجکننده میشود حتی اگر صفحه برای شما «خوب به نظر برسد».
یک h1، سپس بخشها
برای صفحات مبتدی این کورس، یک h1 روشن نگه دارید. سپس محتوا را با h2 و سطوح عمیقتر در صورت نیاز سازمان دهید. الگوهای پیشرفتهتر طرح کلی را بعداً میبینید؛ اول این الگوی ساده و خوانا را مسلط شوید.
یک طرح کلی کوچک صفحه
html<h1>راهنمای شهر</h1>
<h2>جابهجایی</h2>
<p>نکتههایی برای اتوبوس و قطار.</p>
<h2>غذا</h2>
<h3>غذای خیابانی</h3>
<p>تنقلات محلی سریع.</p>
<h3>رستورانهای نشسته</h3>
<p>جاهایی برای وعدهٔ طولانیتر.</p>تیتر برای فاصلهٔ خالی نیست
از تگ تیتر خالی برای ساختن فضای عمودی خالی استفاده نکنید. هر عبارت پررنگ را داخل تیتر نگذارید. اگر متن عنوان واقعی یک بخش نیست، بهجایش پاراگراف یا عنصر مناسب دیگر به کار ببرید.
خودتان امتحان کنید
- یک فایل HTML با اسکلت پایه بسازید یا باز کنید
- یک
h1اضافه کنید که موضوع صفحه را نام میبرد - دو بخش
h2با یک پاراگراف کوتاه زیر هر کدام بگذارید - زیر یکی از
h2ها یکh3و یک پاراگراف کوتاه اضافه کنید - ذخیره کنید و صفحه را باز کنید — بررسی کنید طرح کلی راحت مرور شود
اشتباهات رایج
- انتخاب سطح تیتر فقط بر اساس اندازهٔ فونت بهجای ساختار
- پرش از
h1بهh4بدون دلیل - استفاده از چند
h1در صفحهٔ سادهٔ مبتدی وقتی یک عنوان اصلی روشن کافی است - گذاشتن پاراگرافهای بلند داخل تگ تیتر
- استفاده از تیتر بهعنوان فاصلهگذار تزئینی بدون عنوان واقعی بخش
خلاصه
- تیترها از
h1تاh6سطوح عنوان را مشخص میکنند - ساختار و طرح کلی میسازند، نه فقط اندازهٔ ظاهری
- یک
h1روشن، سپس بخشهای مرتبh2–h6را ترجیح دهید - فقط برای استایل سطوح را رد نکنید
- متن تیتر را کوتاه و عنوانمانند نگه دارید
- اندازه را بعداً با CSS تنظیم کنید؛ تیتر HTML را معنایی نگه دارید
🧠 دانش خود را بیازمایید
دانش خود را بیازمایید
خود را با این آزمون تعاملی به چالش بکشید و ببینید موضوع را چقدر خوب درک کردهاید
📝 دستورالعملها
- هر سوال را با دقت بخوانید
- بهترین پاسخ را برای هر سوال انتخاب کنید
- میتوانید آزمون را هر چند بار که میخواهید تکرار کنید
- پیشرفت شما در بالا نمایش داده میشود