فصل ۶ | متن و محتوا

تیترها؛ از h1 تا h6

HTML شش سطح تیتر در اختیار شما می‌گذارد: از <h1> که مهم‌ترین و بزرگ‌ترین تیتر صفحه است، تا <h6> که کم‌اهمیت‌ترین و کوچک‌ترین سطح به‌شمار می‌رود.

headings.html
<h1>تیتر سطح یک</h1>
<h2>تیتر سطح دو</h2>
<h3>تیتر سطح سه</h3>
<h4>تیتر سطح چهار</h4>
<h5>تیتر سطح پنج</h5>
<h6>تیتر سطح شش</h6>

چرا تیترها فقط برای بزرگ‌نمایی متن نیستند؟

یک اشتباه رایج این است که از تیترها فقط برای بزرگ و پررنگ کردن متن استفاده شود. اما نقش واقعی تیترها، مشخص کردن ساختار منطقی محتوا برای مرورگر، موتورهای جست‌وجو و ابزارهای دسترسی‌پذیری مثل صفحه‌خوان‌هاست.

نکته: اگر فقط به دنبال متنی بزرگ یا پررنگ هستید، به‌جای تیتر باید از CSS برای تغییر اندازه و وزن فونت استفاده کنید.

یک قاعده‌ی مهم

در هر صفحه معمولاً باید فقط یک <h1> وجود داشته باشد که موضوع اصلی صفحه را نشان می‌دهد؛ سطوح پایین‌تر برای تقسیم‌بندی زیرمجموعه‌های آن موضوع به‌کار می‌روند. همچنین بهتر است سطح‌ها را بدون پرش استفاده کنید؛ یعنی از <h2> مستقیم به <h4> نپرید.

موتورهای جست‌وجو مثل گوگل از تیترها برای فهمیدن ساختار و اهمیت بخش‌های مختلف صفحه استفاده می‌کنند؛ بنابراین استفاده‌ی درست از تیترها می‌تواند در نمایش بهتر صفحه در نتایج جست‌وجو هم تأثیرگذار باشد.