Tag: WordPress图片优化

随着内容竞争的加剧和用户注意力的下降，图片等视觉元素变得比以往更加重要。因此，选择合适的 WordPress 图片尺寸也很重要。

得益于 WordPress 的灵活性，可以更改默认的图片尺寸，甚至添加自定义图片尺寸。此外，多种图片优化插件让工作更加轻松。

在本篇文章中，我们看看新手如何修改 WordPress 图片尺寸、如何重新生成缩略图（即将更改的设置应用到之前上传的图片）、图片优化技巧，以及不同图片格式的优缺点。

WordPress 图片尺寸概览

每次将图片上传到 WordPress 媒体库时，WordPress 会为该图片生成多种不同的尺寸，例如 700px x 400px。这意味着图片的宽度为 700 像素，高度为 400 像素。

通过这种功能，网站可以根据图片的使用场景显示合适的尺寸，从而提升加载速度和视觉效果。

这些数字通常被称为图片的“尺寸”。换句话说，图片尺寸越大，像素越多，文件的存储大小也越大。

图片大小也指图片在设备上占用的存储空间，通常以字节表示，例如 100KB（千字节）。

如果图片文件过大，用户下载图片所需时间会更长，从而降低网站的运行速度。因此，文件大小应保持较低，同时图片尺寸需适当。关于图片优化的更多内容，我们会在后面讨论。

WordPress 如何处理和管理图片？

当管理员将图片上传到 WordPress 媒体库时，WordPress 会自动创建多种尺寸的图片版本。上传的原始图片被称为“全尺寸图片”，而 WordPress 会根据预定义的尺寸自动生成额外的版本，例如缩略图、中等尺寸和大尺寸。

这些尺寸在 WordPress 设置中定义，并会根据图片在网站上的展示位置（例如文章、画廊或侧边栏）自动使用。

为什么 WordPress 要这样做？可以理解为 WordPress 确保您的图片在各种场景中都能得到最佳展示，无论是在侧边栏、页脚、文章中，还是页面上。

例如，一张 100 像素的小图片可能适合用作文章预览，而相同的图片放大到横幅尺寸也可以保持良好的视觉效果。

WordPress 生成这些不同尺寸的图片，以便满足网站各个区域的常规需求，同时避免图片被过度拉伸或缩小导致失真。

WordPress 默认图像大小

WordPress 生成的图像副本是默认的 WordPress 图像大小。可以根据特定的设计需求调整这些尺寸。我们会在本篇博文中学习如何做到这一点：

• 缩略图（150×150像素）：通常用于小图像预览。
• 中等（300×300 像素）：中等尺寸的图像，通常显示在博客文章或页面中。
• 大尺寸（1024×1024 像素）：主要用于特色图片、全宽图片或任何需要较大图片的情况
• 全尺寸：这是上传的图像的原始尺寸。

要查看这些选项，请将照片上传到网站页面并点击它。图像大小选项将显示在右侧面板上。

推荐的 WordPress 图片尺寸

网站的不同部分有不同的需求，每个区域需要不同的图片尺寸。以下是具体建议：

图片类型	推荐尺寸	注意事项
Logo	200 x 100 像素（或更大，取决于设计）	确保 Logo 为高分辨率 PNG 格式，尽量使用透明背景。
头部/横幅图片	1200 x 600 像素	图片需足够大以填满屏幕宽度，但需优化以防加载速度变慢。
特色图片（博客文章）	1200 x 628 像素（社交分享用）或 800 x 450 像素	为社交媒体平台的分享进行优化。
缩略图	150 x 150 像素	用于博客预览、归档页面和小部件中，不需要过大尺寸。
产品图片（WooCommerce）	主图：800 x 800 像素 目录缩略图：300 x 300 像素 画廊缩略图：100 x 100 像素	产品图片应保持正方形以确保一致性。
背景图片	1920 x 1080 像素	图片需足够大以覆盖全屏宽度，同时文件大小应控制在 500 KB 以下以提升加载速度。
社交媒体图片	1200 x 630 像素	优化以便在 Facebook 和 Twitter 等平台分享。

WordPress 图片优化

没有必要用超过需求的图片尺寸。

过大的图片文件会导致网页加载速度变慢，很多访问者没耐心的话，会导致他们离开网站。同时，这也可能对搜索引擎排名产生负面影响。（加载速度也是收录因素之一）

理想情况下，WordPress 图片大小应控制在 150KB 以下，但对于较大的图片，可以适当容忍更大的文件大小。

以下是优化 WordPress 图片尺寸时需要注意的一些事项：

压缩 WordPress 图片

压缩是通过减少文件大小而不影响图片质量的过程。

在 WordPress 网站上压缩图片是提升网站速度的有效方法之一。

可以使用以下几种在线工具来进行压缩：

• TinyPNG
• Squoosh
• Imagify
• Optimizilla
• Compressor.io

通过压缩所有的 JPEG（照片）和 PNG（图形）图片，可以显著提升网站的速度和效率。

压缩有两种主要类型：有损压缩和无损压缩。

• 有损压缩：通过去除一些可能看不到的图像数据来大幅减少文件大小。适用于网页图片，但如果压缩过度，会导致图像质量略有下降。
• 无损压缩：保持图像的质量，同时在有限程度上减少文件大小。如果希望保留尽可能多的图像细节，无损压缩是很有用的。

插件可以大大帮助进行图片压缩，更多内容将在后面介绍。

调整图片大小

调整图片大小是指改变图片的实际尺寸（而非像素大小），包括宽度和高度。

大尺寸图片占用更多的磁盘空间，并且加载时需要更长的时间，因此需要优化。

许多主题已经提供了多种图片尺寸，可以从中选择。不过，在上传图片到网站之前，最好还是手动调整其尺寸。

SEO 优化

在 WordPress 中进行图片的 SEO 优化对搜索引擎排名和网站性能至关重要。压缩图片是提升加载速度和优化 SEO 的重要步骤。

优化图片的有效技巧

✅ 在上传图片之前，确保重新命名。不要使用“IMG1425”。应为图片赋予描述性的名称，如“WordPress 图片大小： 如何修改和优化图片.jpg”。

✅ 使用 alt 文本。这对于访客（增强可访问性）和爬虫（帮助理解图片内容并可能提高排名）都很有帮助。

✅ 使用响应式图片，因为它们有助于保持或提升移动端的性能，这可能成为搜索引擎排名的一个因素。

✅ 为特定类型的图片添加 schema 标记，例如产品图片，以改善 SEO。此外，创建图片站点地图，帮助搜索引擎更好地索引网站图片。

选择合适的图片格式（JPEG、PNG、GIF 等）

除了调整尺寸，选择合适的图片格式也非常重要。每种图片格式都有其优缺点。

以下是几种常见格式及其优缺点：

格式	优点	缺点
JPEG	高度压缩，适用于颜色较多的图片，广泛支持浏览器和设备	有损压缩会降低质量，不支持透明背景
PNG	无损压缩保留图片质量，支持透明背景，适用于图形、logo 和需要清晰度的图片	文件大小比 JPEG 大，不适合大尺寸照片，旧版浏览器支持有限
WebP	优越的压缩效果，支持透明背景，文件大小更小，比 JPEG 和 PNG 更好	旧版浏览器（如 Internet Explorer、旧版 Safari）支持有限，需要更多处理能力进行编码/解码，尚未普遍应用于所有平台

可以参阅文章《超详细保姆级教程：手把手教你在 WordPress 中实现 WebP 图片转换，加速网站速度》

WordPress 图片尺寸优化插件

插件在优化 WordPress 图片尺寸时非常有帮助。有许多易于使用的插件可以满足不同的需求。

对于压缩和调整尺寸，您可以使用以下插件：

EWWW Image Optimizer

EWWW Image Optimizer 是一款流行的图片优化插件，可以自动压缩图片。主要功能包括：

• 支持无限文件大小
• 支持 WebP 转换
• 付费服务可达到 80% 的压缩率
• 支持 PNG、JPEG、GIF、WebP 和 PDF 文件
• 评分：5/5（1,725 评价）

价格：免费或起价 $8/月

Smush

Smush 是一款非常适合压缩和调整图片尺寸的插件，拥有超过 100 万次安装，成为非常受欢迎的 WordPress 图片插件。主要功能包括：

• 延迟加载图片
• 支持 WebP 转换
• 提供免费的无损压缩
• 与 Gutenberg 块集成
• 评分：5/5（6,000 评价）

价格：起价 $6/月

Imagify

Imagify 是另一款图片优化插件，提供调整大小和压缩功能，同时不会降低图片质量。主要功能包括：

• 支持转换为 AVIF 和 WebP 格式
• 移动设备图片优化
• 批量优化
• 评分：4.5/5（1,406 评价）

价格：免费或起价 $4.99/月

更改 WordPress 默认图片尺寸

如前所述，WordPress 已经提供了三个默认的图片尺寸。如果默认设置不满足需求，可以进行更改。

例如：认为默认的缩略图尺寸（150×150）太大，需要调整为更小的尺寸（例如 100×100）。

下面是更改步骤：

• 进入 WordPress 管理后台。
• 在左侧面板中，点击 设置 > 媒体。

• 在 媒体设置 部分，可以调整每种尺寸的像素。在此示例中，我更改了缩略图尺寸。
• 点击 保存更改 按钮保存设置。

注意：现在更改的设置仅适用于新上传的

如何重新生成缩略图

不用担心，可以轻松地将新的设置应用到现有的图片。只需使用 Regenerate Thumbnails 插件即可。

以下是操作步骤：

• 进入网站 WordPress 管理后台。
• 在左侧面板中，点击 插件 > 安装插件。

• 搜索 Regenerate Thumbnails 插件。
• 点击 安装。
• 点击 启用。

• 启用后，返回仪表盘，点击左侧面板中的 工具 > 重新生成缩略图。

• 在这里，点击 重新生成所有缩略图附件，以将所有图片更新为新的设置。

如何在 WordPress 中添加自定义图片尺寸

WordPress 提供了三种默认的图片尺寸，但如果需要更多的图片尺寸选项，可以通过编辑 functions.php 文件来添加自定义的图片尺寸。

下面是操作步骤：

1. 进入网站 WordPress 管理后台。

2. 在左侧面板中，点击 外观 > 主题文件编辑器。

3. 在右侧找到 functions.php 文件。

4. 在 functions.php 文件中，添加一个函数来定义新的图片尺寸，使用 add_image_size()。

例如：

phpCopy codeadd_image_size('custom-size-name', 800, 600, true); // 800px 宽，600px 高，裁剪

其中：

• 'custom-size-name' – 自定义图片尺寸的唯一名称。
• 800, 600 – 图片的宽度和高度（以像素为单位）。
• true 或 false – 裁剪模式。true 启用硬裁剪（精确尺寸），false 保持原始宽高比（软裁剪）。

5. 点击 更新文件 按钮以保存文件。
6. 要在主题中显示自定义图片尺寸，粘贴以下代码：

phpCopy code<?php the_post_thumbnail( 'your-specified-image-size' ); ?>

💡 在进行任何更改之前，请备份网站数据！

7. 将“your-specified-image-size”替换为你在前一步中设置的名称。例如，可以将其更改为 custom-size-name。

常见问题解答

Q) 在 WordPress 中使用什么尺寸的图片？
常见尺寸包括：

• 1200×628 px 用于特色图片
• 300×300 px 用于缩略图
• 1024×768 px 用于内容图片

根据主题需求选择尺寸，并进行优化以加快加载速度。

Q) 如何调整 WordPress 中的图片尺寸？
进入 设置 > 媒体 来设置默认尺寸，或者在 媒体库 中单独选择并调整图片尺寸。

Q) 如何增加 WordPress 中的图片上传大小？
通过编辑 php.ini 文件、修改 .htaccess 文件，或在主机面板中调整设置来增加上传大小。

Q) 如何让 WordPress 中的所有图片尺寸一致？
使用图片编辑插件（例如 Regenerate Thumbnails）或调整自定义 CSS 以确保网站中的图片尺寸一致。