您是否希望将图像上传到您的 WordPress 网站，但不确定图像应该是什么大小或文件类型？ 您是否不熟悉为 Web 调整大小和压缩图像的过程？ 在本文中，我将解释为什么使用正确的图像大小对您的网站很重要，并向您展示如何使用免费的照片编辑器 GIMP 调整图像大小和压缩图像。
目录
- 为什么调整网站图片的大小很重要
- 如何在 GIMP 中为 WordPress 调整图像大小
- 步骤1：打开图片
- 第 2 步：找到图像的尺寸
- 第 3 步：使用裁剪工具更改图像的纵横比
- 第4步：缩放图像
- 第 5 步：通过导出压缩图像
- 第 6 步：将图像上传到 WordPress
为什么调整网站图片的大小很重要
让我们从为什么调整网站图像大小如此重要开始。
根据 WordPress.org，图像的整体“物理尺寸”在网站页面的性能中起着巨大的作用。 “[图像的]文件大小决定了加载页面所需的时间； 文件越大……加载 [一页] 所需的时间就越长。” 换句话说，将大文件上传到您的网站会减慢您添加内容的任何页面的性能，通常在您网站的分析数据中显示为较慢的页面加载速度。
“[图像的]文件大小决定了加载页面所需的时间； 文件越大……加载 [一页] 所需的时间就越长。”
-WordPress.org
页面加载速度，也简称为“网页速度,”是“页面上的内容加载速度”，根据 搜索引擎优化网站 Moz. 页面速度较慢可能会导致更高的“跳出率，”这是一个奇特的指标，表示网站访问者在查看单个页面后离开您的网站的会话。
较慢的页面还可以减少访问者在您网站页面上花费的时间，因为人们可能会不耐烦地等待页面内容加载并更快地离开您的网站。
这些指标很重要，因为您通常希望用户在您的网站上花费更多时间并查看您网站上的更多页面。
它们也很重要，因为它们在您的网站在搜索引擎结果页面或“SERP”中的排名方面发挥着作用。 养老金计划 只是当您在 Google 中输入单词或短语并按 Enter 键时显示的结果页面。 由于较大的图像表明不良的网页设计实践并对用户在您网站上的体验产生负面影响，因此 Google 等搜索引擎可能 惩罚 您的网站拥有这些较大的图像和 将您的网站排在其他表现更好的网站之后.
例如，您的网站在 Google 上的排名越低，您的网站获得的流量就越少，而更多流量将流向在搜索结果中排名高于您的竞争对手。
通过减少您网站上图像的文件大小，您可以改善您的 网页速度 从而改善其他指标，例如 跳出率 和 时间e 最终提高您在搜索引擎上的排名。
请注意，还有许多其他重要的变量会影响搜索排名，因此修复图像只是实体的一部分 搜索引擎优化 （搜索引擎优化）策略。 但是，这对于帮助您的网站在 Google 等网站上排名更高以帮助增加您网站的流量当然非常重要。
如何在 GIMP 中为 WordPress 调整图像大小
那么如何正确调整 WordPress 的图像大小？
您可以通过使用减小图像的整体大小来减小图像的文件大小 缩放 和 种植 在您将其上传到您的网站之前。 另外，您可以应用所谓的“压片” 到您的图像以进一步减小其大小。
GIMP，免费和开源的照片编辑器，可以完成所有这些任务，同时还可以导出为推荐的“下一代”文件格式，以进一步减小图像的文件大小并提高站点的性能。
步骤1：打开图片
要开始此过程，请在 GIMP 中打开要上传到站点的图像。 您可以通过将图像从计算机拖放到 GIMP 的图像窗口中来完成此操作，或者您可以在 GIMP 中简单地转到文件>打开。
如果使用文件>打开方法，从出现的“打开图像”对话框中导航到计算机上图像的位置，然后在找到图像文件后双击它以将其打开到 GIMP 中（或单击对话窗口右下角的“打开”按钮）。
第 2 步：找到图像的尺寸
GIMP 窗口的最顶部是一个名为“标题栏”的功能（上图中的红色箭头）。 在这里，您将看到图像的当前尺寸（照片中放大的绿色框）。 我的图像是 1920×1280——第一个数字 1920 代表图像的宽度（以像素为单位），第二个数字 1280 代表图像的高度。 您要用于图像的最终图像尺寸将取决于您打算在 WordPress 中使用图像的位置以及您使用的主题。
在本教程中，我会将图像调整为推荐用于博客文章图像的标准 1200×630 像素大小。
第 3 步：使用裁剪工具更改图像的纵横比
考虑到这一点，我要做的第一件事是裁剪图像，使原始图像的纵横比与推荐尺寸的纵横比相匹配。 为此，我将通过按键盘上的 shift+c 或单击 GIMP 工具箱中的裁剪工具图标（上图中的红色箭头）来获取我的裁剪工具。
接下来，在此工具的工具选项中，我将选中“固定”（绿色箭头）旁边的框，然后单击下拉菜单以选择“纵横比”（蓝色箭头）。
我将在下拉菜单（黄色箭头）下方的文本字段中输入“1200:630”来设置我的纵横比。 这与我希望最终图像的推荐图像大小的纵横比相匹配。
使用裁剪工具，我现在将在图像上单击并拖动鼠标以绘制裁剪区域。 当我松开鼠标时，裁剪区域之外的所有内容都将变暗（上图中的红色箭头 - 假设在工具选项中选中“突出显示”，通常默认情况下）。
默认情况下，我的裁剪区域的参考线设置为“中心线”（上图中的黄色箭头）。 我可以使用工具选项底部的指南下拉菜单更改此设置。 例如，我会将指南更改为“三分法则”（绿色箭头）。 此处的各种指南选项均基于摄影原理，这使您可以轻松地使用这些原理构图。
您可以将鼠标悬停在裁剪区域的任意边或角上（即上图中红色箭头所指的突出区域），然后单击并拖动以调整裁剪区域的边界大小。 请注意，您始终可以在“工具选项”中的“大小”字段中查看裁剪区域的大小（上图中以绿色勾勒）。 您需要保持裁剪区域的整体尺寸大于图像的 1200×630 最终尺寸。
您还可以在裁剪区域（红色箭头）的中间单击并拖动鼠标以重新定位图像上的裁剪。
准备好裁剪图像后，在裁剪区域内单击一次，您的图像将被裁剪。
请注意，如果未选中“工具选项”中的“删除裁剪像素”选项（上图中的绿色箭头），您的原始图像边界仍将通过黄色虚线（红色箭头）显示在图像周围。 您可以通过转到图像>使画布适合图层来恢复原始图像，从而撤消裁剪。 只会导出画布边界内的图像区域。
第4步：缩放图像
我们的图像现在被裁剪成我们想要的纵横比，但是如果你再次查看我们在“标题栏”中的图像尺寸，你会看到图像是 1532×804（在上面的照片中以绿色勾勒并放大 -根据您在图像上绘制裁剪区域的大小，您的尺寸可能会略有不同）。 我们现在需要缩放我们的图像以匹配我们想要的尺寸。
为此，请转到图像>缩放图像（红色箭头）。
在出现的“缩放图像”框中，在“图像大小”下，确保“宽度”和“高度”框旁边的链接图标已链接（上图中的红色箭头）。 然后，将图像的“宽度”更改为 1200（绿色箭头）。 按制表键。 图像高度将自动更新为“630”。 在“质量”下，确保“插值”下拉菜单（蓝色箭头）设置为“NoHalo”或“LoHalo”，以获得缩放后的最佳图像质量。 （有关插值的更多信息， 查看我关于该主题的教程).
点击“缩放”按钮缩放图像（黄色箭头）。
缩放完成后，检查标题栏中的图像尺寸。 您现在应该看到 1200×630 的图像尺寸——我们想要的确切尺寸！ 那么，我们现在该怎么办？
第 5 步：通过导出压缩图像
裁剪和缩放图像通过将图像的高度从 1920 像素减少到 1200 像素，将宽度从 1280 像素减少到 630 像素来减小文件大小，但是我们可以通过在导出图像时应用压缩来进一步减小图像大小。
因此，我们现在需要将图像导出为一种文件格式，该文件格式将对图像应用压缩，而不会显着降低图像质量。 虽然 JPEG 始终是一个不错的选择，但现在有一个更好的选择： WebP的.
WebP 格式比 JPEG 应用更多的压缩，同时对图像质量的影响小于 JPEG。 换句话说，您将获得具有更小文件大小的更好看的图像。 此外，所有排名前 5 位的网络浏览器都支持 WebP 格式。
要导出到 WebP，请转到文件>导出为（红色箭头）。
单击“位置”部分中的任何文件夹（以绿色轮廓显示）以选择计算机上要保存图像的图像。 您只需双击文件夹即可进入，然后在“保存在文件夹”标题（红色箭头）旁边查看您所在的文件夹。 然后，将您的图像重命名为您想要的任何名称——只需确保您的图像名称以扩展名“.webp”（蓝色箭头）结尾即可以 WebP 格式导出图像。 准备好后，单击窗口右下角的“导出”（黄色箭头）。
接下来，将出现“将图像导出为 WebP”对话框。 确保未选中“无损”（红色箭头）。 我通常将“图像质量”设置为 80（蓝色箭头 - 这是一个百分比，因此百分比越低，图像质量越低，但图像文件大小越小）。 如果您的图像不包含透明度（即没有背景的徽标），您不必担心“Alpha 质量”滑块（事实上，在我执行的一个实验中，实际上将 Alpha 质量从 100 降低到 90将具有透明背景的图像的文件大小从 8.50 kb 增加到 8.52 kb）。 您可以将“源类型”下拉菜单设置为“默认”。
您是否要选中或取消选中任何元数据选项，包括 Exif 数据、ITPC 数据和 XMP 数据，取决于您。 Exif 和 XMP 数据是通常由您的相机分配的元数据，用于描述有关您的照片的信息，例如使用的相机型号或使用的镜头类型。 另一方面，ITPC 被媒体成员使用，并为您的图像分配信息，例如所有权、权利和许可。 如果您不确定该怎么做，只需选中这些选项即可。
同样，您可以不选中“保存颜色配置文件”选项，因为大多数浏览器会自动使用 sRGB 颜色空间来显示您的图像，这是 GIMP 使用的。 如果您使用不同的颜色配置文件，则需要保留此选项。 此外，如果您担心图像无法在某些浏览器上正确显示，则选中它只会使整体图像大小增加几 kb。
最后，“保存缩略图”选项可以保持未选中状态，这将进一步节省我们一些千字节。
单击“导出”（上图中的黄色箭头）将图像导出为 WebP 格式。 将导出的 WebP 文件与大小相同且质量设置为“80”的 JPEG 文件进行比较时，WebP 图像的大小比 JPEG 小约 30 kb，或约 25%。
第 6 步：将图像上传到 WordPress
您现在可以登录您的 WordPress 网站并导航到要上传图片的页面或帖子，或者只需使用主导航导航到“媒体”部分，然后将图片拖放到媒体库中。 在我的例子中，我将使用主导航（上图中的红色箭头）导航到“帖子”，然后单击“博客帖子 1”（蓝色箭头）来编辑该博客帖子。
然后，我将打开帖子设置侧边栏（红色箭头）并向下滚动到“特色图片”部分并展开此部分（蓝色箭头）。 然后，我将单击图像以将其替换为我的新图像。
我将导航到“上传文件”选项卡（红色箭头），然后可以将我的图像从我的计算机拖放到 WordPress 中（蓝色箭头）。
最后，我将单击“设置特色图片”以应用此更改（红色箭头）。
单击“更新”（红色箭头）以使用新的特色图片更新您的页面。
如果我点击“查看帖子”，（蓝色箭头）...
…您现在会在我的博客顶部看到新的特色图片。
这就是本教程的内容！ 如果您想了解有关设计 WordPress 网站的更多信息，我建议您查看我的 非编码员课程的 WordPress 6.0！ 或者，如果您想了解有关 GIMP 的更多信息，请查看我的 Udemy 上的 GIMP 2.10 大师班!
