HTML الدلالي: فائدة header وnav وmain وfooter

<div> يصلح لكل شيء لكنه لا يقول شيئاً. وسوم مثل <nav> و<main> تخبر المتصفح وقارئات الشاشة ومحركات البحث ما هو كل جزء من الصفحة.

<body>
  <header>
    <h1>My site</h1>
    <nav><a href="/">Home</a> <a href="/blog">Blog</a></nav>
  </header>
  <main>
    <article>
      <h2>Post title</h2>
      <p>…</p>
    </article>
    <aside>Related links</aside>
  </main>
  <footer>© 2026</footer>
</body>

• اجعل <main> واحداً في الصفحة.
• رتّب العناوين: h1 ← h2 ← h3 دون تخطي مستوى.
• استخدم <button> للأزرار و<a> للروابط؛ فـ <div onclick> لا يعمل بلوحة المفاتيح.