Softonic

HTML 压缩工具

步 1 / 3

可粘贴代码片段、邮件正文或整个页面，最多 1,000,000 个字符。

下一步：选择选项

粘贴 HTML 或打开 HTML 文件，选择要删除的程度，然后复制或下载更小的版本，并查看节省了多少字节。“安全”级别绝不会把两个单词连在一起，因此页面的外观和功能保持不变，内联的 CSS 和 JavaScript 也会一并压缩。

如何使用 HTML 压缩工具

  1. 1

    添加 HTML

    将标记粘贴到编辑器中，或打开以 UTF-8 保存的 .html、.htm 或 .xhtml 文件，最多 1,000,000 个字符。

  2. 2

    选择级别和选项

    任何 HTML 都可以保持“安全”，要测试的完整页面可以选择“最大”。然后决定是否删除注释，以及是否压缩内联 CSS 和 JavaScript。

  3. 3

    复制或下载结果

    检查压缩后的 HTML 和大小，然后复制或下载为文件。在结果页面更改选项后，会重新压缩。

压缩工具会改动什么

本工具使用广泛采用的开源 HTML 压缩库 html-minifier-terser，并搭配 clean-css 处理 CSS、Terser 处理 JavaScript。两个级别都会保留单词之间以及 <b>、<a> 等内联标签之间的空格。对完整页面而言，“最大”级别能省下更多空间。

改动 安全 最大
换行和连续空格 变成一个空格 变成一个空格，并在 <div>、<li> 等块之间删除
单词和内联标签之间的空格 保留 保留
</p>、</li>、<head>、<body> 等可省略的标签 保留 删除
属性值两侧的引号 保留 在 HTML 允许时删除
checked="checked" 等布尔属性 保留 缩写为 checked
空的 class、id 和 style 属性 保留 删除
<br/> 中的结束斜杠 保留 删除
type="text/javascript" 和 type="text/css" 删除 删除

XHTML：打开 .xhtml 文件时，或者 HTML 以 <?xml version="1.0"?> 等 XML 声明开头时，两个级别都会保留可省略的标签、属性值两侧的引号、checked="checked" 等布尔属性以及结束斜杠，并且不压缩 JavaScript，因此结果仍然可以作为 XML 读取。

选项

  • 删除注释（默认开启）：删除普通注释。以 <!--! 开头的注释（如许可证声明）、服务器端包含（SSI）注释和 Internet Explorer 条件注释会保留。
  • 压缩 CSS（默认开启）：缩短 <style> 元素和 style 属性中的 CSS。@import 保持原样，也不会下载任何内容。
  • 压缩 JavaScript（默认开启）：缩短内联脚本和 onclick 等事件属性。局部变量名会变短，全局名称保持不变，/*! ... */ 形式的许可证注释会保留。JSON-LD 等结构化数据的内容不会被压缩。

永远不会改动的内容

  • <pre> 和 <textarea> 中的文本，因为其中的空格和换行会直接显示在页面上。
  • &nbsp;、&amp;、&eacute; 等字符引用。
  • PHP（<?php ... ?>）和 ASP 风格（<% ... %>）的代码块，以及两个 <!-- htmlmin:ignore --> 注释之间的所有内容。
  • doctype、<a name> 锚点、输入框上的 type="text"，以及 SVG 中的大小写和结束斜杠。

可能出现的提示

  • 无法解析某个脚本：本身不是有效 JavaScript 的内联脚本或事件属性会保持原样不压缩，工具会显示错误所在的行和列。页面其余部分仍会压缩。
  • 无法解析某个 CSS 块：该 CSS 会保持原样不压缩。
  • 非 UTF-8 的字符集：下载的文件始终以 UTF-8 保存，因此请把页面的 <meta charset> 改为 UTF-8，或将结果复制到你自己的文件中。
  • 无法再缩小：在这些选项下，此 HTML 已经是最小的了。

如果某个 <script> 或 <style> 元素没有闭合，则不会压缩任何内容，工具会显示该元素开始的行和列。无论使用哪个级别，发布前都请打开压缩后的页面并实际操作一遍。

常见问题

使用“安全”级别时是一样的。空白会合并成一个空格，但绝不会被删除，所以 <b>Hello</b> <i>world</i> 仍然显示为“Hello world”，并排的元素之间也会保留间隙。只有 CSS 保留空格显示的文本（例如使用 white-space: pre 时）可能发生变化。

用于发布前会进行测试的完整页面。它会删除块之间的空白以及 </p> 等可省略的标签，从而节省更多字节。请检查两点：用 display: inline-block 并排显示的元素之间的间隙可能会消失；删除了最后一个 </p> 的片段可能会把之后添加的 HTML 也包进去。

开启“删除注释”后，普通注释会被删除。以 <!--! 开头的注释、<!--#include virtual="/footer.html" --> 这样的服务器端包含注释，以及 <!--[if IE]> 这样的 Internet Explorer 条件注释会保留。如果想让某一部分完全保持原样，可以把它放在两个 <!-- htmlmin:ignore --> 注释之间。这两个标记本身会被删除。

只有能作为有效代码解析的 JavaScript 才会被压缩。如果某个内联脚本存在语法错误，或包含本身不是 JavaScript 的模板代码，该脚本会保持原样不压缩，页面其余部分照常压缩，工具还会显示错误所在的行和列。

不会。你粘贴或打开的 HTML 会留在浏览器中，不会发送到我们的服务器，也不会添加到页面链接中。在各步骤之间，它会保存在当前浏览器标签页中，直到你关闭标签页或选择“重新开始”。当你请求结果时，页面会下载压缩工具的代码，并告知我们的服务器进行了一次压缩，但不会发送 HTML。

最多 1,000,000 个字符，无论是粘贴的还是从以 UTF-8 保存的文件中打开的。如果文件使用其他编码，工具会提示你：请在编辑器中打开文件，复制其中的 HTML 并粘贴到这里。耗时超过 30 秒的压缩会被停止，这时请尝试较短的 HTML 片段。

相关工具

Webpack 配置生成器

通过简短表单为 webpack 5 生成 webpack.config.js：设置 entry、输出文件夹和 mode，然后开启 TypeScript、Babel、CSS 加载器、HtmlWebpackPlugin 和开发服务器。

ASCII 表参考

完整 ASCII 表，覆盖 0 到 127；列出每个代码的十进制、十六进制、八进制、二进制值和 HTML 数字字符引用写法，包括 NUL、LF、DEL。

HTML 字符参考

可搜索的 HTML 实体列表，含命名代码与数值代码，并支持一键复制特殊字符和符号。

tsconfig.json 生成器

选择 target、module、moduleResolution、JSX 和常用的 strict 系列开关，生成一份干净的 tsconfig.json，直接复制到你的项目里。

键盘快捷键参考

搜索 macOS、Windows 和 Linux 上 VS Code、Chrome 以及使用 GNU Readline 的 Bash 的文档默认快捷键。

Markdown 图片生成器

生成带替代文本、title 属性和可选链接的 Markdown 图片语法。支持内联格式和引用格式输出。

此工具还提供其他语言版本