最可靠方式是右键“查看页面源代码”后在新标签页中保存，选“所有文件”、UTF-8编码、.html扩展名；动态页面需用开发者工具复制outerHTML；复杂页面推荐SingleFile扩展。
直接右键“查看页面源代码”再保存，最可靠
这是获取原始服务器返回 HTML 的最稳妥方式，尤其适合静态博客（如 Jekyll、Hugo 生成的页面）。关键点在于：必须在「查看页面源代码」的新标签页里操作，而不是在原网页上按 Ctrl+S。
常见错误现象：另存为 时选了“网页，全部”，结果生成 article.html + article_files/ 文件夹——这不是源码，而是浏览器渲染后抓取的资源快照，路径和结构已失真。
- 打开博客文章页，按
Ctrl+U（Windows/Linux）或Cmd+Option+U（Mac）进入源码视图 - 此时地址栏 URL 以
view-source:开头，确认无误后再按Ctrl+S - 保存类型选“所有文件”，文件名填
post-20260826.html，编码选UTF-8 - 不要改扩展名，不要选“.txt”或让系统自动加引号
动态博客（如 Ghost、WordPress 前端 SPA）得用 Elements 面板复制 outerHTML
这类页面靠 JS 渲染内容，Ctrl+U 看到的可能是空壳 <div id="app"></div>。必须用开发者工具抓取最终 DOM 结构。
注意：Copy outerHTML 得右键最外层的 <html> 标签，不是 <body> 或某个 div——否则会漏掉 <head> 里的样式和元信息。
立即学习“前端免费学习笔记（深入）”；
- 按
F12打开开发者工具，切到Elements面板 - 在左侧 DOM 树里找到顶层
<html>，右键 →Copy→Copy outerHTML - 粘贴进 VS Code 或记事本，手动检查开头是否有
<!DOCTYPE html>和完整<head> - 保存时仍要选
UTF-8编码，扩展名必须是.html
想一键存档带图片/样式的完整页面？用 SingleFile 扩展
普通保存或复制 HTML 都不带外部资源，打开时缺图、无样式。SingleFile 能把所有 CSS、JS、图片转成 data: 或 base64 内联，打包成单个 HTML 文件。
它不是“另存为”的替代品，而是专治复杂博客页面的离线存档工具——比如你收藏的 Medium 文章、带交互图表的 Substack 专栏。
- Chrome / Edge / Firefox 应用商店搜
SingleFile，安装后点工具栏图标即可 - 默认设置已足够，不用调参数；若页面含大量视频或 iframe，可关掉“保存嵌入内容”避免文件过大
- 生成的文件双击即开，断网也能显示完整排版和图片
- 别用它存敏感后台页（如登录态页面），可能泄露 token 或 cookies
批量备份多个博客文章？curl + shell 脚本最稳
如果你有几十篇博文链接列表，手动点太慢。curl 直接发 HTTP 请求，拿到的就是服务器吐出的原始 HTML，不含浏览器注入的调试信息或广告脚本。
容易踩的坑是没处理重定向或编码问题，导致中文乱码或跳转到登录页。
- 先测试单条命令：
curl -L -s "https://blog.example/post/1" -o post1.html（-L跟重定向，-s静默模式） - 保存前加
file post1.html确认文件确实是 HTML，不是 binary 或 redirect 页面 - 批量时用 for 循环，文件名建议从 URL 提取 slug，避免
?=等非法字符：basename "https://a.com/p?id=123" | sed 's/[^a-zA-Z0-9._-]/-/g' - 如果博客启用了反爬，需加
-H "User-Agent: Mozilla/5.0"，但别高频请求，小心被封 IP
