智能手机上模糊的网页图形 - 双倍图像大小或分辨率？

Question

与桌面屏幕不同，我在高分辨率智能手机屏幕上创建的各种网页图形模糊不清。

我需要：

1. 将图像尺寸加倍并以编程方式将其调整为一半
2. 提高分辨率（例如72到300）。

我的理解是后者只影响印刷而不是数字屏幕。

是否有其他人遇到此问题，如果是，推荐的解决方法是什么？

Answer 1

您的假设是正确的。您需要将图像尺寸加倍，如果您想要挑剔，可能需要更多，因为某些屏幕分辨率的像素密度比桌面显示器高3倍或更多。 Double虽然很好，但我会从那里开始。

分辨率，与DPI一样，除了使图像资源的文件大小超出其需要之外，对屏幕上的Web图形不会做任何事情。您可以获得5 DPI的分辨率，它们在屏幕上看起来与300 DPI相同。降低Web图形DPI的主要问题是当用户想要打印页面时，任何具有极低DPI的图像都会非常像素化。

根据您创建的图形，除标准图像格式外，您还有一些选项。您可以使用SVG或创建自己的图标字体。两者都是矢量图像，因此它们在支持它们的任何设备上看起来都很清晰。图标字体得到广泛支持，SVG很不错，但根据您的需要，可能需要一个小垫片。

Answer 2

双倍图像尺寸。

您甚至应该渲染图像（简单或加倍），具体取决于设备/视口分辨率。

提高分辨率是一件非常复杂的事情。打印/数字/ DPI / PPI;它可以在一堆设备上运行，但不是全部。