header和footer应按节段祖先就近绑定，页面级需直接嵌套在body下；main必须唯一且不嵌套于header/footer/aside中；footer内全局导航链接须用nav包裹。
header 和 footer 不是“放页面最顶/最底的盒子”，用错嵌套层级会稀释语义权重，反而拖累 SEO。
为什么一个页面能有多个 <header></header> 和 <footer></footer>？
因为它们绑定的是「最近的节段祖先」——即离它最近的 @#@#@#@#@#@#@#@#@#@0<p>© 2026 公司名称</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx"><img
src="https://img.php.cn/upload/skill/000/000/081/179051045119472.jpg" alt="html-to-pptx" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="overflowclass">html-to-pptx</a>
<p class="overflowclass">将多页 HTML 演示文稿转换为美化的 PPTX 文件，便于分享和分发。</p>
</div>
<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<nav></nav> 的 footer 链接，屏幕阅读器会当作普通文本读出，SEO 权重也弱于导航上下文中的链接<nav></nav> —— 多个小型 <nav></nav>（如「法律条款」「社交链接」）比一个大杂烩更利于语义解析最容易被忽略的是 <footer></footer> 的「就近绑定」原则：它永远属于离它最近的那个节段元素，而不是视觉位置。写完记得检查 DOM 层级，别让一个 <footer></footer> 意外挂在了 <section></section> 外面却想表达文章尾注的意思。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
