一、HTML 文档基石：基础结构标签
HTML 页面的构建，始于一套基础结构，它是网页的“骨架”，决定了页面的基本组成。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>我的第一个网页</title>
</head>
<body>
<h1>你好，HTML 世界！</h1>
</body>
</html>
-
<!DOCTYPE html>：作为 HTML5 文档的声明，放在页面最开头，告知浏览器当前文档遵循 HTML5 标准 ，让浏览器以正确模式渲染页面。 -
<html>：是整个页面的根元素，所有其他 HTML 标签都嵌套在其中， lang="zh-CN" 表明页面内容使用的是中文，有助于搜索引擎识别页面语言属性 。 -
<head>：用于存放页面的元信息，像字符编码、页面标题等，这些内容不会直接显示在浏览器的可视区域，但对页面的渲染、 SEO（搜索引擎优化）等至关重要 。 -
<title>：定义了 HTML 文档的标题，会显示在浏览器的标题栏或标签页上，不仅让用户直观了解页面主题，也能辅助搜索引擎抓取页面关键信息 。 -
<body>：页面的“舞台”，所有要展示给用户的实际内容，比如文本、图片、视频、链接等，都放置在这个标签内，是浏览器可视区域呈现内容的容器 。
二、页面布局与语义：结构标签
为了让网页内容的结构更清晰，便于浏览器理解和搜索引擎优化，HTML 提供了一系列语义化的页面结构标签 。
***标签 用途说明 ***
-
<header>通常用于定义页头区域，可包含网站的 logo、页面标题、导航栏等内容，是页面起始部分的标识 。 -
<nav>专门的导航区域，里面放置页面导航链接，方便用户快速跳转至不同页面或页面内不同板块 。 -
，突出核心内容范围 。<main>承载页面的主要内容区域，一个页面建议只使用一个 -
<section>用于划分页面中可独立分组的板块，比如一篇文章里的不同章节、商品展示的不同类别等 。 -
<article>作为独立文章、帖子、新闻块等的容器，即使把它单独拿出来，也具备完整的内容意义。 -
<aside>存放辅助信息，常见的如侧边栏内容，像相关文章推荐、广告、站点信息等非核心但有补充作用的内容 。 -
<footer>定义页脚，一般放置版权信息、联系方式、站点地图链接等页面底部的常规内容。
语义化的结构标签，能让页面结构逻辑更清晰，不仅利于开发者维护代码，也有助于搜索引擎更好地抓取页面内容（对 SEO 友好 ），同时提升屏幕阅读器等辅助设备对页面的可访问性解析，让更多用户便捷访问网页 。
