[使用场景](https://openscreenshot.app/zh-cn/use-cases/)

# 如何保存网页的视觉副本

把整个网页截取为 PNG 或 PDF，按日期和域名命名文件，并处理会保存为多张图片的超长页面。

作者 [OpenScreenShot](https://github.com/pghqdev/OpenScreenShot)

要保留网页的视觉副本，用**整页**截取页面，并在文件名中带上日期和网站，保存为 PNG 或 PDF。OpenScreenShot 滚动页面，把各部分拼接成一张图片，并把文件保存在你的电脑上。截图记录的是页面在你屏幕上的样子；它不能证明页面是真实的或未被更改。

## 逐步保存页面副本

1. 从弹出窗口或工具栏图标的右键菜单打开**设置**。把**文件名模板**设为包含 `{date}` 和 `{domain}` 的格式，例如 `Archive/{domain}/{date}_{title}`。
2. 打开页面。把页面完整滚动一遍，让延迟加载的图片和评论加载出来，然后回到顶部。
3. 点击 OpenScreenShot 图标。在默认设置下，这会开始一次**整页**截图，并在**编辑器**中打开结果。
4. 检查顶部、底部，以及滚动时才加载的所有部分。
5. 点击**保存图片**。在**导出**对话框中选择 **PNG** 或 **PDF**，检查文件名，然后点击**导出**。

要不经过编辑器直接保存，在**设置**中把**截图后**设为**下载**。之后每次截图都以 PNG 格式直接进入你的下载文件夹，并按你的模板命名。

## PNG 还是 PDF？

要保留截图的每个像素，选择 **PNG**。它是无损格式，因此界面文字保持清晰，任何图片查看器都能打开。

当副本要放进文档文件夹或需要打印时，选择 **PDF**。在**页面大小**下，**完整**生成一页与图片同尺寸的页面。**A4** 或 **Letter** 配合**拆分为多页**，会把长截图分成多页，页与页之间重叠 5 mm。PDF 以图片形式保存截图，因此其中的文字无法搜索或选择。[截图转 PDF 指南](https://openscreenshot.app/zh-cn/blog/save-screenshot-as-pdf/)比较了各种版式。

## 为文件命名，方便以后查找

文件名模板接受以下标记：

- `{date}`：日期，格式为 YYYY-MM-DD，取自你电脑的时钟
- `{time}`：时间，格式为 HHMMSS
- `{domain}`：网站的主机名，不含 `www.`
- `{title}`：页面标题，文件名不能包含的字符会被替换
- `{w}` 和 `{h}`：图片的宽度和高度，单位为像素

模板中的 `/` 会保存到“下载”内的文件夹中，因此 `Archive/{domain}/{date}_{title}` 会先按网站、再按日期整理副本。**设置**中的实时预览会在截图前显示结果。

## 超长页面

一张图片最多可容纳 32,000 设备像素高的页面。更高的页面最多保存为六张图片。使用**下载**时，每个部分按你的模板命名，并带有 `_part1of3` 这样的后缀。使用**编辑器**或**剪贴板**时，每个部分在各自的编辑器标签页中打开，你在那里分别导出。

六张图片也放不下的页面会被拒绝并报错。这时请改用**可见区域**或**选定区域**截取你需要的部分。[整页截图指南](https://openscreenshot.app/zh-cn/blog/full-page-screenshot-chrome/)介绍了其他情况，例如嵌套滚动区域和固定页头。

## 截图能显示什么，不能显示什么

截图是你的浏览器在某一时刻所显示内容的视觉记录。它没有签名，也没有防篡改校验，任何人都能编辑图片文件。`{date}` 标记取自命名文件时你电脑的时钟。当你需要证明某个页面曾以某种形式存在时，请使用专为此用途打造的服务，并把截图留作个人参考。

整页截图也会漏掉页面从未渲染的内容：折叠的部分、页面的其他标签页、信息流中你没有滚动到的部分，以及你没有打开的登录后内容。

## 副本存储在哪里

OpenScreenShot 在你的浏览器中处理截图，并把它们存储在你设备的本地存储中。它不会把截图上传到服务器。导出的文件进入你的下载文件夹。在你分享或上传之前，它们一直留在你的电脑上，而你上传到的服务有自己的存储规则。详情请参阅[隐私政策](https://openscreenshot.app/zh-cn/privacy/)。

[设置参考](https://openscreenshot.app/zh-cn/docs/#settings)介绍了文件名模板。要为同事标注截图，请参阅[为设计评审截取页面](https://openscreenshot.app/zh-cn/use-cases/design-review/)。

## 继续阅读

[阅读文档](https://openscreenshot.app/zh-cn/docs/)、[浏览所有指南](https://openscreenshot.app/zh-cn/blog/)，或[获取截图帮助](https://openscreenshot.app/zh-cn/support/)。

---

Canonical page: https://openscreenshot.app/zh-cn/use-cases/archive-web-pages/