图像压缩后质量损失问题

Question

我在一个JS轮播中显示图片。这些图片尺寸非常大，所以我在HTML中将它们缩小了。我进行了一些数学计算以保持其长宽比，在最终显示时，这些大图片的质量降低了。需要注意的是，这些图片已经存在于服务器上，我不应该改变原始文件的大小。

是什么导致了这种降低的质量？我应该坚持使用较小尺寸的图片吗？还是增加最终显示的大小？以下是代码，其中最大宽度和高度目前分别为270和180。所有内容都使用C＃编写。

// srcccccc is the image file. Can be any kind of extension jpg, png, etc.
if (srcccccc != "")
{
    Globals.NavigateURL();
    string path = PortalSettings.HomeDirectory + srcccccc;
    using (System.Drawing.Image img = System.Drawing.Image.FromFile(@Server.MapPath(path)))
    {
        int[] newSizes = ResizeWithRatio(img);
        contentsall += "<img src=\"" + PortalSettings.HomeDirectory + srcccccc + "\" alt=\"Image "
            + folderidddin + "\" height=\"" + newSizes[1] + "px\"" + "\" width=\"" + newSizes[0] + "px\" />";
    }
}

// HTML is dynamically added later....

private int[] ResizeWithRatio(System.Drawing.Image img)
{
            int[] sizes = new int[2];
            if (img.Width > maxWidth || img.Height > maxHeight)
            {
                float ri = (float)img.Width / (float)img.Height;
                float rs = (float)maxWidth / (float)maxHeight;
                if (rs > ri)
                {
                    sizes[0] = (int)((float)img.Width * (float)maxHeight / (float)img.Height);
                    sizes[1] = maxHeight;
                }
                else
                {
                    sizes[0] = maxWidth;
                    sizes[1] = (int)((float)img.Height * (float)maxWidth / (float)img.Width);
                }
            }
            else
            {
                sizes[0] = img.Width;
                sizes[1] = img.Height;
            }
            return sizes;
}

- Mitchell

---

可能是高质量图像缩放C#的重复问题。 - Diodeus - James MacFarlane

使用这种方法，调整大小后的图像质量将取决于浏览器，因为您只是操作图像标签，而不是图像本身。如果您在服务器端调整大小System.Drawing.Image ，并将其作为完全不同的图像返回到浏览器，则可以控制质量。 - Cᴏʀʏ

Answer 1

你遇到的问题是你没有对图片进行缩放，你只是告诉浏览器将完整大小的图像呈现为较小的图像。不幸的是，浏览器在这方面并不是很好，我认为它只使用了一个非常简单的算法来处理。

解决方法是在服务器上缩放图像。我建议设置一个页面处理程序，以某种方式接收图像引用（文件名、ID 等），并在输出到客户端之前进行调整大小。以下问题涉及 C# 中的缩放。 高质量图像缩放库

- Chris

---

正如我所想的那样。现在我要看看我们的一些服务器上传的适当尺寸的图像看起来如何。如果图像质量良好，我就不会担心了。我只是想确认为什么质量如此之差。 - Mitchell

Answer 2

如果您在服务器端缩小图像请查看此文档，这样可以节省网络流量并创建更好的图片。

- Felice Pollano