【问题标题】：HTML Minification: Whitespace between element attributesHTML 缩小：元素属性之间的空白
【发布时间】：2015-05-24 06:20:24
【问题描述】：

我想从我的输出中删除更多不必要的字节，而且似乎可以接受（在实践中）去除可以加起来相当多的内容通过省略/折叠 DOM 元素属性之间的间隙，HTML 标记中的空格。

虽然我已经测试和研究过（在这两种情况下都做了一点），但我想知道它会有多安全？

我在 Chrome (43.0.2357.65 m)、IE (11.0.9600.17801)、FF (38.0.1) 和 Safari 中进行了测试(5.1.7 (blah-di-blah)) 他们似乎并不介意，并且在 The Specs 中找不到任何关于属性之间空格的具体内容。

w3.org's Validator 抱怨，这强烈表明这不安全并且不应该期望工作，但是（总是有一个“但是”）它可能是要求仅当不存在引号时（出于显而易见的原因），空格才是严格的。
^{另外（尖刻但尖锐）：它们的 SSL “过时”不会激发对他们意见的信心。}

我还注意到someone's HTML compressor 可以（启用时）在属性值中去掉引号（例如 id），这意味着如果不是，至少大部分所有 HTML 解析都集中在等号两侧的文本（当然布尔值除外），并且在使用引号的情况下，它们将被视为优先分隔符。

所以，会：

<!DOCTYPE html><html><body>
<a href="http://example.org"target="_blank"title="This is a test">Yabba Dabba Doo!</a>
</body></html>

▲ 曾经出错，如果出错，在什么条件下？

还有什么其他原因可以在生产输出中维护这个空白（代码“可读性”在这种情况下不是问题）？

更新（因为找到一个答案）：

虽然我基本上回答了我自己的问题，即有一个规范来管理属性之间是否应该有一个空格，但我仍然想知道在使用带引号的值时是否可以考虑省略它们实际上安全，并希望得到有关这一点的反馈。

考虑到在生产 HTML 中意外省略空格的频率，并且我测试的浏览器似乎并不介意它们何时出现，我认为如果浏览器无法处理带有这些的文档的情况非常罕见空格省略。

尽管在几乎所有情况下都遵循规范是明智之举，但这可能是一次作弊可能可以接受吗？

毕竟 - 如果我们能够神奇地在不影响输出质量的情况下节省数百字节，为什么不呢？

【问题讨论】：

这是一个有趣的问题，但是相关的 html 规范是怎么说的呢？如果规范说它是有效的，那么它是有效的，否则不应该依赖浏览器的宽容性质（在我看来，这种宽容是第一代浏览器的一个长期错误，尽管可以说它帮助了网络早期）。
@DavidThomas ：如前所述，我在读过的规范中没有发现任何甚至提到空格的内容 - 更不用说是否需要它们了。这就是我问这个问题的原因。希望有人真正知道，或者知道没有关于它们的规范——在这种情况下，可以假定默认授予权限。

标签： html cross-browser whitespace minify specifications

【解决方案1】：

有规范（毕竟）

事实证明我应该更加努力。我的错。

根据these specs：

如果使用空属性语法的属性后跟另一个属性，则必须用空格字符分隔两者。

和

如果使用不带引号的属性语法的属性后跟另一个属性或上面开始标记语法的第 6 步中允许的可选 U+002F SOLIDUS 字符 (/)，则 必须有一个空格分隔两者的字符。

和

如果使用单引号属性语法的属性后跟另一个属性，则必须用空格字符分隔两者。

和

如果使用双引号属性语法的属性后跟另一个属性，则必须用空格字符分隔两者。

除非我（再次）弄错了，否则这意味着属性之间必须始终有空格。

【讨论】：

好发现！我记得在规范中提到了空白，但是，在移动设备上，我找不到它们。是的，强制空白也是我阅读这些陈述的方式。不过，您是否考虑过发送压缩后的 html 和 CSS 以减少带宽？
@DavidThomas ：哦，一切可能已经被压扁了。我只是从不满足，总是寻找摩尔。灵感实际上是通过使用 schema.org 标记来充实网站的 HTML 标记（按字节）。已经有通常的classs、ids 等等，还有一些data-*s - 然后还有更多属性！我只是注意到潜在的节省和测试使它看起来可行。但是不-无论如何都不安全。感谢您考虑一下:-)

【解决方案2】：

您可以尝试在线 HTML 缩小器，例如 http://www.whak.ca/minify/HTML.htm 或 http://www.scriptcompress.com/minify-HTML.htm（搜索 google 以获取更多信息）并找到它们更改的一些小东西，以提示可以取出哪些内容但仍然呈现 HTML 代码。

在第一个链接上你的代码：

<!DOCTYPE html><html><body> <a href="http://example.org"target="_blank"title="This is a test">Yabba Dabba Doo!</a> </body></html>

变成：

<!DOCTYPE html><html><body><a href=http://example.org target=_blank title="This is a test">Yabba Dabba Doo!</a>

已经为您节省了 18 个字节...

【讨论】：

您的浏览器可能会忽略额外的空白，但带宽确实很重要，数据传输会花钱。因此，减少 HTML 页面的传输文件大小可以为某些人省钱（网络托管公司、计划有限的手机用户）。许多第三世界国家只有拨号，所以较小的页面意味着更快的加载...我确实看到了 200KB 的网页，其中 20KB 是无用的空白，另外 30KB 用于无用的隐藏 cmets...