Kā semantiski sadalīt saturu lapā?

Sēmaniskās satura sadalīšanas sasniegšanai tiek izmantotas atbilstošas HTML5 tagi.

Galvenās semantiskās tagi:

• <header>: Ievads vai navigācijas vai ievada elementu grupa. Bieži satur vietnes nosaukumu, navigāciju, logotipu.
• <nav>: Navigācijas saiteņu bloks.
• <main>: Dokumenta galvenais saturs. Tam jābūt unikālam lapā (nejāduplējas kājā, galvenē, sānu joslā).
• <article>: Pašpietiekama, neatkarīga satura daļa (raksts, emuāra ieraksts, komentārs).
• <section>: Atsevišķa dokumenta sadaļa (nodaļa, paragrāfs, galvenās lapas satura bloks). Tam jābūt virsrakstam (<h1>-<h6>).
• <aside>: Satura daļa, kas netieši saistīta ar galveno saturu (sānu josla, citāts, reklāma).
• <footer>: Sadaļas vai dokumenta apakšdaļa. Parasti satur informāciju par autoru, autortiesībām, saites uz saistītiem dokumentiem.
• <figure>: Neatkarīgs saturs (attēls, diagramma, tabula), kuru var pārvietot ārpus dokumenta galvenā plūsmas bez zaudēšanas nozīmes. Bieži lieto ar <figcaption>.
• <figcaption>: Nosaukums <figure> elementam.
• <mark>: Izceļ (zīmē) tekstu, kuram ir īpaša nozīme vai interese kontekstā ar apkārtējo tekstu.
• <time>: Attēlo konkrētu laiku vai laika intervālu.

Semantisko tagu lietošana uzlabo pieejamību, SEO un koda uzturēšanu. Meklētājprogrammas un palīgtehnoloģijas (ekrāna lasītāji) labāk saprot lapas struktūru.