html - 哪个更好？用于显示图像的数据 URL 方案或图像链接？

Question

我对此有点困惑。为了在我的 HTML 页面中显示图像，在 HTML img 标签中嵌入图像代码是好的（使用数据 URL 技术）或提供指向该图像文件的链接会更好（传统方式）？如果有人能以比较的方式告诉我它们的优缺点，那将是一个很大的帮助。

Answer 1

数据 URL 嵌入：

• ↑ 加载页面的 HTTP 请求更少；
• ↓ 超长代码行，图片不小；
• ↓ 很难（非常难）维护（想想什么时候需要更换图像）；
• ↓ IE 6 和 7 不支持。

图片链接：

• ↑ 易于维护（您只需更换文件）；
• ↑ 独立于 HTML 缓存；
• ↑ 代码更简洁；
• ↑ 所有版本的IE都支持；
• ↓ 更多 HTTP 请求加载页面。

一般来说，我建议对较大的图像（照片、布局元素、大图标）和可能随时间变化的图像使用链接。仅对非常小的图标使用数据 URL。

我不得不说你可以避免前两个数据 URL 问题（长代码和可维护）从物理图像文件生成数据 URL，使用服务器端语言（例如 PHP）进行编码。