New Dimensions
--
File Size
--
Scale
--
使用锁定宽高比和常用预设，将图片调整到精确尺寸。所有处理均在浏览器中完成——不会上传至任何服务器。
每个平台都有特定的图片尺寸要求。使用错误的尺寸会导致您精心设计的视觉内容被裁剪、拉伸或降采样，从而削弱品牌形象。Facebook 推荐链接预览使用 1200x630，动态帖子使用 1080x1080。Instagram 方形帖子使用 1080x1080，竖版使用 1080x1350，横版使用 1080x608。Twitter/X 图片在 1200x675 像素时显示最佳。正确设置这些尺寸不是可选项——它决定了专业形象与业余感之间的差距。
对于网站而言，关键原则是提供与显示尺寸完全一致的图片。若在 CSS 中以 600px 宽度显示的图片使用 3000px 的原始文件——浏览器仍会下载完整文件后再缩小，浪费带宽并降低页面加载速度。例外情况是视网膜显示屏，此时应提供 2 倍 CSS 显示尺寸的图片（即 600px 显示位需要 1200px 的图片），以在高密度屏幕上保持清晰度。
现代网页开发需要为不同设备提供不同尺寸的图片。使用 1920px 宽显示器的桌面用户需要的图片与使用 375px 屏幕的移动用户不同。HTML srcset 属性和 sizes 属性可让您根据视口宽度和设备像素比定义多个图片版本供浏览器选择。这意味着需要为每张图片创建多个尺寸——通常为 400px、800px、1200px 和 1600px 宽度。
视网膜显示（2x 和 3x 像素密度）在相同屏幕面积内容纳两到三倍的物理像素。若未使用视网膜适配的图片，照片在 iPhone、iPad、MacBook 以及大多数现代 Android 设备上会显得柔软模糊。解决方案很直接：将图片尺寸调整为显示尺寸的 2 倍并让 CSS 限制其显示。600x400 的图片位需要 1200x800 的源图。使用此工具创建每个尺寸变体，然后使用我们的 图片压缩器 对其进行压缩，以保持文件大小可控。
最快的图片是仍保持良好视觉效果的最小文件。对于首页横幅区，目标是压缩后不超过 200KB；对于正文内容图片，保持在 100KB 以下；缩略图应控制在 30KB 以下。这些目标基于使用 WebP 等现代格式——若只能使用 JPEG，同等质量下文件会大约增加 25-35%。始终在压缩前将图片调整至显示尺寸。将一张 4000x3000 的照片压缩至 150KB，其视觉效果会逊于先将其调整为 1200x900 再压缩至同等大小的图片，因为压缩需要在相同文件体积内处理更多像素，难度更大。
向下缩放通常能很好地保持质量，因为是合并像素。向上放大（放大）会降低质量，因为浏览器必须插值生成原图中不存在的新像素，导致模糊。为获得最佳效果，请始终使用最高分辨率的源图并向下缩放。切勿对小图进行放大并期待清晰效果。
宽高比是宽度与高度之间的比例关系。常见比例包括 16:9（宽屏）、4:3（标准）和 1:1（正方形）。锁定宽高比可确保在更改一个维度时自动调整另一个维度以保持比例，防止拉伸或压扁。仅在您有意进行非比例缩放时才解锁。
Facebook 帖子：1200x630。Instagram 动态：1080x1080（方形）或 1080x1350（竖版）。Twitter/X：1200x675。LinkedIn：1200x627。Pinterest：1000x1500。各平台的个人头像通常为 400x400 或更大。使用正确的尺寸可确保图片显示时不会出现意外裁剪或质量下降。
视网膜（Retina）和 HiDPI 显示屏的像素密度是标准屏幕的 2-3 倍。若在 2x 视网膜显示屏上以 300x200 CSS 像素显示图片，实际使用 600x400 物理像素。如果您的图片仅为 300x200，则在这些屏幕上会显得模糊。解决办法是提供相当于显示尺寸 2 倍的图片，并使用 CSS 的宽高限制其显示。