很多新手做网站，代码写得乱成一锅粥，浏览器打开还报错。这篇不讲大道理，只教你怎么把骨架搭对，让你的页面在电脑和手机上都能正常显示。看完这篇，你至少能分清哪里是头，哪里是身体，不再对着空白页发呆。

刚入行那会儿，我也觉得HTML简单得令人发指。不就是写几个标签吗？结果第一次自己搭页面，字体乱飞，图片错位，导航栏直接跑到页面最底下。那时候我就明白，光知道标签没用，得懂结构。所谓的html网页的基本结构，其实就是房子的梁柱。梁柱歪了，装修再豪华也是危房。

咱们别整那些虚的，直接看代码。打开你的记事本，或者VS Code，新建一个文件。第一步，先写doctype。这行代码虽然短，但它是告诉浏览器：“嘿，我是HTML5，别用老眼光看我。”少了它，浏览器可能进入怪异模式，你的样式全乱。

接下来是html标签。这是最外层的壳，所有东西都得塞在里面。记得有个lang属性，写上zh-CN，这对SEO友好，也让屏幕阅读器知道这是中文。别偷懒，好习惯是从第一天养成的。

然后是head部分。这里放的是给机器看的东西，用户看不见。比如title，这是浏览器标签页上显示的标题。很多兄弟喜欢写“首页”，太俗了。要写具体点，比如“张三的个人博客-专注技术分享”。还有meta标签，描述你的网站，关键词。虽然百度说关键词权重低了，但写上总没坏处，至少搜索引擎能更准地抓取你的意图。这里也是放CSS链接的地方，虽然内联样式也能用，但分开写更清晰。

body部分才是重头戏。这是给用户看的内容。别一上来就写div，先理清逻辑。header是头部，通常放logo和导航。nav是导航菜单，用ul和li包起来，语义化最重要。main是主体内容，一个页面最好只有一个main。section和article用来划分内容块。footer是底部，放版权信息、联系方式。

我见过太多人，把整个页面塞在一个div里，然后里面再套无数个div。这种html网页的基本结构，看着都累。其实，浏览器解析是有优先级的。结构清晰，加载才快。

举个例子，你想做个简单的介绍页。先写header，里面放h1标题。然后写main，里面放几个p段落，加几张img。最后写footer，放个p标签写版权。就这么简单。别整花里胡哨的，先跑通，再美化。

有时候你会遇到布局问题。别急着怪CSS，先检查HTML结构。是不是标签没闭合？是不是层级搞错了？比如li标签必须放在ul或ol里面，不然浏览器会自动帮你修正，但结果往往不是你想要的。

记住，语义化标签不是为了好看，是为了让代码更有意义。h1是主标题，h2是副标题，别为了加粗就用b标签，用strong。别为了斜体用i标签，用em。这些细节，老手和新手一眼就能看出来。

写代码就像盖房子，地基不稳，楼必塌。html网页的基本结构就是你的地基。不要指望靠后期修补来掩盖前期的错误。一次性写对，比后期改十次都强。

我干了七年，见过太多项目因为初期结构混乱，后期维护成本极高。改一个样式，牵一发而动全身。所以，从一开始就规范起来。

如果你还是觉得头大，或者遇到具体的结构问题搞不定，别硬扛。可以找我聊聊。我不一定帮你写代码，但能帮你理清思路。毕竟，踩过的坑，能让你少绕弯路。

最后说一句，代码是写给人看的，顺便给机器运行。结构清晰，心情才好。别把简单的事情复杂化，从写好第一个html网页的基本结构开始，一步步来。