企业官网必须使用语义化标签，因搜索引擎和屏幕阅读器依赖等标签解析内容；仅用类名无法传递结构意义，导致seo权重流失、可访问性不达标及维护成本上升。
企业官网必须用语义化标签，不是“可选优化”，而是基础合规要求。 搜索引擎和屏幕阅读器对 <header></header>、<nav></nav>、<main></main> 等标签的解析已成硬性信号；不用它们，等于主动放弃 SEO 权重分配和 WCAG 2.1 AA 级可访问性最低门槛。
为什么企业官网不能只用 <div> 套类名
<p>类名（如 <code>class="header"）对机器无意义：Googlebot 不会因为看到 <div class="nav"> 就认定这是主导航，它只能靠概率猜测；屏幕阅读器也不会给这个 <code><div> 自动加上 “导航区域” 的朗读提示或键盘焦点逻辑。
<ul>
<li>搜索引擎可能将页脚链接误判为主内容跳转路径，稀释首页权重</li>
<li>视障用户无法用快捷键（如 Ctrl+Shift+O）直接跳转到 <code><nav></nav>，必须逐个 tab 遍历所有 <div>
<li>内部 CMS 或前端框架升级时，<code><div class="main-content"> 和 <code><div class="primary-section"> 含义模糊，维护成本陡增
<h3>
<code><main></main> 必须且只能出现一次，且不能嵌套在 <article></article> 或 <section></section> 内
这是 W3C 规范强制要求：<main></main> 表示整个页面唯一不可替代的主体内容区。企业官网中，它应包裹公司简介、核心服务、产品列表、客户案例等用户真正来访问的目标信息，而非轮播图、合作品牌墙这类辅助模块。
- 错误写法：
<section><main>...</main></section>——<main></main>是顶层容器，不得被语义化区块包裹 - 常见陷阱：把“新闻动态”栏目页的整页内容包进一个
<main></main>，但其中每条新闻又各自用了<article></article>；此时<main></main>仍只有一层，内部<article></article>是合法嵌套 - SEO 影响：多个
<main></main>会被 Google 视为结构错误，降低页面可信度评分
<nav></nav> 不是所有链接集合，仅用于“全局/主要导航路径”
企业官网的主导航（首页、关于我们、服务、案例、联系）必须用 <nav></nav>；但页脚中的“隐私政策”“招聘信息”“友情链接”不应塞进同一个 <nav></nav>，否则会干扰爬虫对核心路径的识别优先级。
- 正确做法：顶部主导航用一个
<nav aria-label="主导航"></nav>；页脚法律类链接用<footer></footer>直接包裹，不加<nav></nav> - ARIA 补充：给
<nav></nav>加aria-label是必要操作，避免多导航时（如侧边栏也有<nav></nav>）屏幕阅读器混淆 - 性能注意：
<nav></nav>本身无渲染开销，但若内部用 JS 动态生成大量链接且未做懒加载，会影响 LCP
<section></section> 必须有标题（<h2></h2>–<h6></h6>），否则语义失效
<section></section> 不是视觉分组工具，而是“有主题的逻辑区块”。企业官网中，“我们的服务”“技术优势”“客户评价”这些模块，每个都应以 <h2></h2> 开头并包裹在 <section></section> 内；纯装饰性分割线或空白占位 <div> 不该强行套 <code><section></section>。
- 错误现象：页面出现
<section><p>我们专注企业数字化转型</p></section>—— 缺少标题，浏览器和 AT 设备无法建立该区块的上下文 - SEO 影响：没有标题的
<section></section>对爬虫而言等同于普通<div>，不参与内容权重建模 <li>可访问性后果：屏幕阅读器用户无法用标题导航（T 键跳转）快速定位到“服务”区块</li> <p>最常被忽略的一点：语义化不是贴标签，而是重构信息架构。一个 <code><article></article>里嵌了五个<section></section>，但每个<section></section>都没标题，或者<main></main>被三个<div> 包着 —— 这类“伪语义化”比不用更危险，它制造了结构幻觉，让问题更难被检测和修复。</div>
