HTML5 Semantic & Meta Tag Reference | Modern Structure Grids

W3C Structure Standard

HTML5 Semantic & Meta Tag Reference

Verified structural grids for SEO-friendly code and modern document architecture.

Semantic Layout Tags

Tag Role / Purpose SEO Impact
<main> Specifies the unique, primary content of the document. Critical
<article> Self-contained content (blog posts, news items). High
<aside> Secondary content (sidebars, pull quotes). Medium
<nav> Major navigation links for the site or page. High

Essential Meta Snippets

Type Code Snippet Platform
Viewport <meta name="viewport" content="width=device-width, initial-scale=1"> Mobile / UX
Charset <meta charset="UTF-8"> Global Browsers
Social (OG) <meta property="og:title" content="..."> FB / LinkedIn
Twitter <meta name="twitter:card" content="summary"> Twitter (X)
Accessibility Tip: Never use a <div> when a semantic tag like <section> or <nav> is appropriate. Semantic tags provide meaning to Screen Readers and improve your ranking on search engines.

Post a Comment