Html 如何减小网页下载的大（ish）图像的大小
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4504497/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to reduce size of Large(ish) image for web page download
提问by David
I have a site which uses a large image as a background. It's a jpeg that's 134KB in size - I can't really get it below that so far. I have saved it for web in photoshop on low quality jpeg setting. It's dimensions are: 1920 x 1028.
我有一个使用大图像作为背景的网站。这是一个大小为 134KB 的 jpeg - 到目前为止我真的无法让它低于这个大小。我已将其保存在 Photoshop 中的低质量 jpeg 设置中用于网络。它的尺寸是：1920 x 1028。
How can I reduce the size further?
我怎样才能进一步缩小尺寸？
Could I resize it extremely small and resize it with width and height attributes in the image tag - as long as the aspect ratio is the same?
我可以将其调整为极小，并在图像标签中使用宽度和高度属性调整其大小 - 只要纵横比相同吗？
Its killing my page speed. Please help - any advice welcome.
它杀死了我的页面速度。请帮忙 - 欢迎任何建议。
回答by Rockbot
Without knowing the picture I can provide different ways:
在不知道图片的情况下，我可以提供不同的方法：
1) If you dont want your picture to be too prominent in the background, try to blur it (could be a lot - depending on the picture!) -> then you can us a higher compression rate without seeing the artifacts too much.
1) 如果您不希望您的图片在背景中太突出，请尝试对其进行模糊处理（可能会很多 - 取决于图片！）-> 然后您可以使用更高的压缩率而不会看到太多伪影。
2) depending on your picture, try to reduce it to certain color-ranges (that you use a max. amount of colors) -> with this method you might end up using a .png or gif file, photoshop will show you what is best.
2）根据您的图片，尝试将其减少到某些颜色范围（您使用最大数量的颜色）-> 使用这种方法，您可能最终会使用 .png 或 gif 文件，photoshop 将向您展示什么是最好的事物。
One last thought: As this is you BACKGROUND image, try to keep it in 'the back' - this way you can try and alter (destroy) the image in a way to reduce colors! On the other hand, try using smaller pictures (800x600) and let css scale them, again - depending on your intention.
最后一个想法：因为这是您的背景图像，请尝试将其保留在“背面” - 这样您就可以尝试以减少颜色的方式更改（破坏）图像！另一方面，尝试使用较小的图片 (800x600) 并让 css 再次缩放它们 - 取决于您的意图。
I use 1280x1024px bg-images at about 55Kb.
我使用大约 55Kb 的 1280x1024px 背景图像。
hope this helps.
希望这可以帮助。
回答by Matt Asbury
Try smushing it http://www.smushit.com/ysmush.it/
回答by sleske
Yes, you can use a smaller image. Your main options are
是的，您可以使用较小的图像。您的主要选择是
- resize it on display (using something like
<img src="xxx" height="200%" width="200%">) - tile it
- 在显示器上调整它的大小（使用类似的东西
<img src="xxx" height="200%" width="200%">） - 平铺
If it is a uniform background (pattern or similar), tiling probably looks nicer, as scaling up the image will degrade its visual quality. If it is a picture, you'll have to scale it.
如果它是统一的背景（图案或类似的），平铺可能看起来更好，因为放大图像会降低其视觉质量。如果是图片，则必须对其进行缩放。
回答by Hyman
use Photoshop for resizing and make it according to your need such as 1024*800 or whatever u want,and then save it for web and device and there reduce the Optimized value of jpg hope it will work.
使用 Photoshop 调整大小并根据您的需要进行调整，例如 1024*800 或您想要的任何大小，然后将其保存为网络和设备，并降低 jpg 的优化值希望它会起作用。
回答by Pekka
Unless you're willing to reduce the image's pixel resolution (like suggested by @sleske), there is probably no way to get image size much beyond what you have now. Photoshop's JPG export filter is top of the line in terms of quality vs. file size.
除非您愿意降低图像的像素分辨率（如@sleske 所建议的那样），否则可能无法使图像大小远远超过您现在拥有的大小。Photoshop 的 JPG 导出过滤器在质量与文件大小方面处于领先地位。
The only possible method could be splitting the image into sub-images, and compressing them with different settings ("slicing"). Large homogeneous areas can be saved at massively reduced quality without much visible loss, while detailed areas can retain higher quality. I think Photoshop has ImageReady for that.
唯一可能的方法是将图像拆分为子图像，并使用不同的设置（“切片”）压缩它们。大的同质区域可以以大幅降低的质量保存而没有太多可见的损失，而细节区域可以保持更高的质量。我认为 Photoshop 有 ImageReady。
回答by Hanna
If possible, save it as a GIF. GIFs are generally smaller than Jpegs.
如果可能，请将其另存为 GIF。GIF 通常比 Jpeg 小。
回答by Kamran
you can use this online tool to reduce the size of image from MBs to KBs http://www.jpegmini.com/
您可以使用此在线工具将图像大小从 MB 减小到 KB http://www.jpegmini.com/
回答by Archit Aggarwal
I found a simple solution. It is to use office photo editor 2010 . just launch the application navigate to the directory with the images and simply click edit pictures on the right and then compress pictures . select what type you want i chose website. Successfully reduced size of jpg from 5mb to 50kb .
我找到了一个简单的解决方案。是使用office photo editor 2010。只需启动应用程序，导航到包含图像的目录，然后单击右侧的编辑图片，然后压缩图片。选择你想要的类型我选择了网站。成功将 jpg 的大小从 5mb 减少到 50kb。
回答by JerryGoyal
I tried many online image compressors but I liked this one most: http://compressimage.toolur.com/. You can play with various things like quality, compression methods etc.
我尝试了许多在线图像压缩器，但我最喜欢这个：http: //compressimage.toolur.com/。你可以玩各种东西，比如质量、压缩方法等。
回答by Demian Brecht
I would definitely recommend resizing the image but keeping the aspect ratio. The smaller the better. Keep in mind however, that the smaller you go (less than 1:1), will reduce image quality. Having said that, generally image quality isn't mandatory to be super high for most backgrounds.
我绝对会建议调整图像大小但保持纵横比。越小越好。但是请记住，尺寸越小（小于 1:1），图像质量就会降低。话虽如此，对于大多数背景来说，通常图像质量并不一定要超高。
