视网膜/高分辨率图像

时间:2013-07-29 10:01:57

标签: css image web retina

创建网站/移动应用并适应视网膜/高分辨率屏幕(需要两倍大小的图像)时,为什么只包含更大的图像,大小只有一半大小,所以你只有一张图像在非视网膜图像上会变得更小(图像中的细节数量相同)。

这样你不需要加倍图像数量,因为你只有一个更高的图像,可以缩小到一半大小以适应两个屏幕?

5 个答案:

答案 0 :(得分:2)

  

为什么仅包含较大的图像并将其大小设置为一半大小不是一个好主意,因此您只有一个图像,在非视网膜图像上,它将变得更小(具有相同的细节数量)在图像中)

这不是一个好主意,因为对于人们没有高分辨率/视网膜移动设备的情况,你只是浪费了大约40%的图像带宽。

根据流量的大小,额外带宽的成本会非常快地增加。

答案 1 :(得分:1)

所有关于加载时间,视网膜图像需要更长的加载时间。因此,在没有高分辨率的设备上,它们只会减慢速度......

答案 2 :(得分:1)

3个理由:

  • 保存带宽(绝不下载超出必要的大图)
  • 保存性能(缩放需要一些CPU功率)
  • 改善图像渲染 (当渲染的尺寸接近原始尺寸时,图像看起来最佳 尽可能大小。不确定是否存在重大差异 设备,但肯定在一些)

答案 3 :(得分:0)

这通常是为了节省资源。虽然保存两个图像而不是一个图像所需的空间并不重要,但是用于保存额外分辨率的ram(在非视网膜设备上)确实很重要。此外,每次都必须使用CPU来调整图像大小。

答案 4 :(得分:0)

JPEG:
获得2倍大小的图像,并通过硬压缩保存(最多20-30%)。使用Retina的原始尺寸和其他设备的半尺寸。这种方式可以节省(有时减少)图像重量,并提高视觉质量。

示例: 1024 × 640, 99 Kb vs 2048 × 1280, 75 Kb
来源(RU): http://pepelsbey.net/pres/clear-and-sharp/