مبانی HTML
·
۹ دقیقه مطالعه
تگ‌های معنایی، چیدمان و ری‌سپانسیو
تگ‌های معنایی
به‌جای div همه‌جا، از تگ‌هایی که معنا دارند استفاده کن:
<header>سرصفحه</header>
<nav>منو</nav>
<main>
<article>محتوای مستقل</article>
<aside>سایدبار</aside>
</main>
<footer>پاورقی</footer>
| تگ | نقش |
|---|---|
| header | سرصفحه |
| nav | منو |
| main | محتوای اصلی (یکی) |
| article | محتوای مستقل |
| section | بخش موضوعی |
| aside | فرعی |
| footer | پاورقی |
چرا؟ سئوی بهتر، دسترس‌پذیری بهتر، کد خواناتر.
چیدمان و ری‌سپانسیو
ساختار کلی را با این تگ‌ها بچین، و برای واکنش‌گرایی (نمایش درست روی موبایل) حتماً این خط را در head بگذار:
<meta name="viewport" content="width=device-width, initial-scale=1">
ظاهر و چیدمانِ دقیق، کارِ CSS است (مسیر بعدی).