每次写新页面，我都会先搭出下面这个骨架，再往里填内容。语义化的结构不仅让代码好读，也对搜索引擎更友好。
基本骨架
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>页面标题</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>站点头部与导航</header>
<main>
<article>主要内容</article>
</main>
<footer>版权与备案信息</footer>
</body>
</html>常见标签的分工
<header>：页面或区块的头部，通常放站点名、导航。<nav>：导航链接的集合。<main>：页面独有的主内容，一个页面只应有一个。<article>：可独立分发的完整内容，如一篇文章。<section>：按主题划分的段落区块，常配标题。<footer>：页脚，放版权、备案号、联系方式。
经验：能用语义标签就不用万能的<div>；<div>留给纯粹的样式分组。
移动端必加
viewport 那行 meta 千万别漏，否则手机上会以桌面宽度缩小显示，字小得没法看。