我使用Zurb Foundation 5.5.3和CSS（并且不希望使用SASS）。我正在运行Windows XP，如果需要，还有Windows 7。
我的相机中有以下wxh尺寸的JPEG图像：
我应该调整这些内容图片的宽度和高度以获得更好的页面加载速度（我在https://www.dropbox.com/s/343u2ksehlbcete/Screenshot%202016-05-20%2016.34.50.png?dl=0中得分低于40但仍然保持高质量的图像，其中一些将用于填充整个所有屏幕上有12列（类=大12列），有些只有4列（大4列）
以下截图取自http://foundation.zurb.com/sites/docs/v/5.5.3/components/interchange.html，介绍尺寸641px适用于中型，641px，1024px适用于中型，大型1025px和大型仅1025px，1440px和x大型1441px，x大仅1441px ，1920px和xx-large 1921px ...
https://www.dropbox.com/s/kf8j6xgd9qmtcgm/Screenshot%202016-05-20%2016.27.09.png?dl=0
我很困惑！我认为12列等于1000px（62.5rem），因此我认为大12列的图像最大宽度为1000px，我需要调整大小，同时保持相同的宽高比和逻辑上，大6列是该宽度的一半或500px，4列的图像是250px宽。另外我读到有30px的余量，所以我不知道图像的大小应该是1000px还是970px？
我很欣赏确认，也知道我是否可以使用Photoshop并创建一些动作批量调整大小，或者如果使用Gulp（我之前从未使用过）更好。
非常感谢任何帮助！
答案 0 :(得分：1)
这取决于您使用图像的方式，如果您有全宽行或背景图像，这将取决于设备的屏幕尺寸。现在，有些大屏幕设备正在变得越来越流行，如 1920x1080 和 2560x1440 。
如果要在网格中显示图像，如果行尺寸 1000px ，则图像的最大尺寸应为 1000px ，如果您要支持视网膜设备您可以拥有最大 2000px 。顺便说一下，现在常见的网格尺寸是 1200px 或 1280px 。
如果您有全宽行或全背景图片，则需要更高分辨率的图像 ，否则您可以拥有行宽的最大尺寸。
我认为使用gulp会更好，因为它比使用Photoshop操作更自动。
这里是gulp插件，用于生成多个图像https://github.com/mahnunchik/gulp-responsive
