为什么要在网站上调整上传的图片

Question

我有一个人们可以上传图片的网站。我已经看到很多网站将图像缩小到缩略图大小并在搜索页面上显示，例如，直到用户实际点击一个以全尺寸查看它。

为什么生成上传图片的缩略图版本是一种好习惯？为什么不使用img标记设置高度和宽度？

[编辑]：在阅读了几个答案后，我意识到我可能很难说出我的问题。那么，我的意思是，即使它们具有CSS中指定的大小，图像是否以完整大小下载？在页面加载完成后，它们是否会在渲染时缩小？

谢谢！

Answer 1

较大的图像具有较大的文件大小。如果您有1MB图像，但只需要显示大小为10KB的缩略图，那么只需在需要时显示完整图像，即可节省99％的带宽。

除带宽外，客户通常内存有限......想想移动设备。另外，CPU需要在滚动期间处理它们，而不是。

Answer 2

如果你使用宽度和高度的img标签，那张图片仍然是原始图片，数据大小不会改变（它只会在你的浏览器中看起来更小）。

如果你有缩略图，那些缩略图的数据尺寸较小，但通常在页面的某个位置将它们链接到数据尺寸较大的原始缩略图。

如果用户下载缩略图，他将获得小尺寸图片，如果他下载原件，他就会获得大尺寸。 注意：缩略图与原始图片不同。

Answer 3

较小的图像尺寸较小=加载速度较快。

当用户实际想要查看图像时，您打开实际图像并可能等待加载。

如果您在搜索中有多个帖子且每个帖子都有图片，那么加载缩略图的速度会比原始图片快得多。

如果使用css（设置宽度和高度）缩小原始图像，则仍需要先加载原始图像。

Answer 4

  

图像是否以完整尺寸下载，即使它们具有CSS中指定的尺寸？

是的图像将以原始尺寸（全尺寸）下载。 CSS仅更改图像视图而非主图像文件。

  

在页面加载完成后，它们是否会在渲染时缩小？

不，除非有脚本要做这样的工作。