Nadav Soferman 写了一篇很棒的文章，介绍了开发人员在尝试使图片响应式时可能犯的常见错误
无论您选择哪种响应式设计解决方案或框架，您仍然需要生成和提供每张图片的多个版本。 对于所有方法和框架来说，找到最合适的解析度（即每张特定图片的响应式断点）是一个普遍的挑战。
让我特别惊讶的是，为了获得尽可能高的性能提升，我们需要根据图片本身提供不同数量的缩放图片。 一张图片可能需要五个版本，而另一张图片可能需要九个版本。
Nadav 还向我们介绍了一个名为 Responsive Breakpoints 的新工具，该工具旨在解决许多常见错误。 如果我们上传一张图片，该应用程序将允许我们下载缩小的图片，向我们展示哪些是该特定图片的最佳断点，然后为我们提供一个清晰的标记示例，以便我们可以将其直接添加到我们的设计中。
此工具处理图片创建和 srcset 属性创建，但我一直梦想着一个用于 sizes 属性创建的自动化工具。 例如，您打算使用该图片的页面在一个 iframe 中加载。 该 iframe 在周围调整大小，观察图片宽度发生的变化并记录剧烈变化（可能是断点）。 然后它根据这些信息智能地创建 sizes 属性。 #热门应用想法。 这也让我想起了为尺寸信息设置 <meta> 标签有多么好，因为设计会发生变化。