零起点可用记事本+浏览器搭建个人主页，关键在于HTML骨架正确：<meta charset="UTF-8">须置于<head>最前端且无前置空行或注释，保存为UTF-8（无BOM）编码的index.html；结构推荐<header>、<main>、<footer>划分内容，图片路径用相对路径并注意大小写。
不需要任何框架或工具链，用纯文本编辑器加浏览器就能完成——零起点搭建个人主页，关键在理解 HTML 的骨架逻辑，而不是堆砌样式。
怎么写第一个 <html> 文件才不会被浏览器当成乱码
浏览器打开空白页或显示乱码，大概率是编码声明缺失或位置错了。HTML5 要求 <meta charset="UTF-8"> 必须放在 <head> 最前面，且不能晚于前 1024 个字节。
- 新建文件时，用记事本（Windows）或 TextEdit（macOS 切换为纯文本模式）保存为
index.html，编码选 UTF-8（无 BOM） -
<meta>标签必须紧贴<head>开始，不要空行、不要注释挡在前面 - 别用 Word 或 WPS 直接存为 HTML——它们会塞入大量冗余标签和私有样式，破坏结构
用 <header>、<main>、<footer> 还是直接用 <div>
语义化标签不是“加分项”，而是影响可访问性和 SEO 的基础。但初学阶段，优先保证结构清晰，不必强求一步到位。
- 对个人主页这种单页内容，用
<header>包姓名/头像，<main>放简介/技能/项目，<footer>放邮箱/社交链接，是最自然的划分 - 如果用了
<section>或<article>，里面至少得有标题（<h2>或更高），否则语义断裂 - 别为了“语义”而嵌套过深：三层
<div>套一层<section>再套<div>，反而增加维护成本
图片不显示？检查这三处 src 路径写法
本地双击打开 HTML 时，图片路径错误比 CSS 更隐蔽——浏览器控制台可能只报 net::ERR_FILE_NOT_FOUND，不提示具体哪个文件。
立即学习“前端免费学习笔记（深入）”；
- 图片和 HTML 在同一目录：用相对路径
<img src="avatar.jpg">，不要加./或file:// - 图片在子目录
images/下：写<img src="images/avatar.jpg">，注意斜杠方向统一用/（Windows 也适用） - 绝对路径慎用：
<img src="/images/avatar.jpg">中的开头/指网站根目录，本地双击打开时等价于磁盘根目录（如C:/images/），基本找不到
最易被忽略的是：改完 HTML 后没刷新浏览器缓存，或者图片文件名大小写不一致（macOS/Linux 区分大小写，Avatar.jpg 和 avatar.jpg 是两个文件）。
