因为工作需要，我开始接触网站。用了二十多年的互联网，对于网页的基础架构并不了解，以至于只是一个半自动化的wordpress，很多内容都不会弄。最近学了HTML相关知识，总算有了些许了解。将内容分享出来，希望能够帮助到对网站结构和HTML一窍不通的读者朋友们。
首先，先发一张我的网站首页上半部分的截图。这一部分整体叫做网站的全局页眉，在HTML中用<header></header>标签嵌套起来，属于<body></body>的子元素。其中包含经云的清净小站这几个字的站台名称，“首页、Docker、Go技术…”这样的导航栏菜单，还有一张首页图片。
位于右上角的导航菜单，以<nav></nav>标签嵌套起来，代表导航栏部分。在我的站点，导航栏<nav>包裹在了页眉<header>内部。成为了页眉的一部分。但导航栏<nav>也可以单独作为网站基础结构的一部分来展示。
再来看看我的网站首页的中部。左边的部分是我的所有的文章列表，整体列表的部分称为网站的主体部分，也称为主内容，用<main></main>嵌套起来。
每一篇都用一个<article></article>嵌套起来。其中，每一篇文章的标题，都是用一个<header></header>嵌套起来的，不同于网站的全局页眉，将它放在<article></article>中，作为这个部分的页眉。
右侧的部分称为侧边栏，用<aside></aside>嵌套起来，可以是包含一些外围信息，比如日历、标签云、归档等等。
最后再来看看网站的最下部分。这一部分就是页脚了，用<footer></footer>嵌套，一般会加入一些合作站点、网站链接，以及版权信息、联系方式等内容。
下面用表格总结一下网站的基础架构：
| 标签 | 说明 | 备注 |
|---|---|---|
| <header> | 页眉 | 通常放在网站顶部，含有大标题、Logo、图片等内容。 |
| <nav> | 导航栏 | 网站的导航菜单，指向网站各个部分的超链接。 |
| <main> | 主内容 | 网站的主要内容放在这里，文章、视频、地图、新闻等内容。 |
| <aside> | 侧边栏 | 网站的一些外围信息，比如日历、标签云、归档等等。 |
| <footer> | 页脚 | 一些合作站点、网站链接，以及版权信息、联系方式等内容。 |
大家如何想了解更多细节，在我的站点经云的清净小站 (skycreator.top)，右键->查看页面源代码，可以对比以上内容进行查看。
标签：网站,嵌套,HTML,页眉,内容,基础架构,导航 From： https://blog.csdn.net/weixin_42206314/article/details/140266031