Image 调整图像大小-浏览器与Photoshop

我有一个客户坚持在他的网页上显示“清晰”的图片。他给我的一张图片是2592像素宽，但页面只有940像素宽。没问题，我只是用Photoshop调整了图像的大小，但是质量明显下降，有很多锯齿状的边缘。我预计当尺寸调整到三分之一时，质量会下降，但我认为我可以做得更好。因此，我所做的是采取原始图像和浏览器（铬）调整到940像素宽。是的，我知道这绝对是最糟糕的事情，但我只是在试验。事实证明，浏览器在调整大小方面比Photoshop做得好得多——我没有看到锯齿状的边缘，图片的质量看起来与原作相当接近

---

这是怎么回事？为什么Photoshop的尺寸调整不如Chrome好（IE8和Firefox也一样好）？我尝试过调整Photoshop的重采样选项，但没有看到真正的区别

您可以尝试使用基于浏览器的脚本，如TimThumb：

您确实需要调整图像的大小，而不是仅仅为了显示而缩小巨大的图像。这个脚本将创建不同大小的图像副本，如果我没记错的话，它甚至支持某种缓存

---

我让它将相当大的图像调整为非常小的缩略图，它看起来总是很锐利。

Photoshop和web浏览器处理大小的方式不同。我不使用Photoshop，所以我不能帮你

---

但是，如果希望图片看起来像是通过web浏览器调整的大小，请使用web浏览器调整其大小！拍摄一张屏幕截图并剪切调整大小的图片，创建另一张您可以在网站上真正使用的图片。

在photoshop中缩放图像时，需要考虑以下几点：

---

1.）文件类型+压缩

您需要确保，如果使用有损压缩（即JPEG）的文件类型，将质量设置为>8，否则质量会明显下降

2.）重采样方法

Photoshop提供了几种不同的重采样方法，这些方法在缩小比例时会影响像素的组合方式。下面是一些图片的链接，说明了在缩放时可以在何处修改此选项

图像->图像大小

此窗口底部有一个下拉列表：

您可能遇到的情况是，您的图像正在使用“最近邻”或“双线性”重新采样

---

---

试一试。

在photoshop中的图像大小弹出窗口中，底部有一个带有选项（最近邻、双三次等）的下拉列表…您尝试过不同的选项吗？在photoshop中缩小图片时，您不应该有质量损失（当然，如果您做得正确的话）。保存时可能会丢失质量。当保存图片时，Photoshop会为您提供保存图片的质量选项。请确保您选择的是最高质量的图片。我尝试了PS提供的每个重采样选项。即使在Photoshop中，结果也看起来参差不齐。这是保存为JPG/GIF/PNG之前的结果。是否可以发布链接到图像？以及您使用PS调整大小的图像。我将尝试并用我的结果对其进行注释。当然，请在此处查看：第一个图像是全尺寸的，2592 x 414。第二个图像是浏览器调整大小为940 x 150。第三个图像是Photoshop调整大小为940 x 150，另存为PNG-24非隔行扫描图像。放大并注意line在建筑物的顶部…这是我可以很容易地看到差异的地方。坦率地说，我无法在100%缩放时分辨出多大差异，但客户说他可以…他一定有一个非常好的显示器。该页面上的第四个图像与保存为PNG-8的PS精简图像相同。顺便说一句，我知道浏览器在放大时有优势，因为它有原始图像，可以调整大小，而PS图像是静态的，在缩放时会有损耗。我确实尝试过这种方法。它工作得很好，但我希望在Photoshop中有一种更简单的方法。这是一个不错的解决方案，但对我来说，结果与Photoshop相当。