扫二维码与项目经理沟
我们在微信上24小时期待你的声音
解答本文疑问/谷歌外链咨询/GEO咨询/外贸建站咨询
外贸网站的优化中,具有新鲜、独特的图片对于吸引在线用户来说非常重要,尤其是在注意力被海量内容分散的当下。图片能够快速传达信息,让人一眼就能理解内容要点。
文字虽然能详细说明,但图片往往能够加深人对你内容的印象。经过优化的网页图片,不仅能强化品牌识别,还能改善浏览体验,引导用户继续在你的网站上深入探索。

微看科技提供的这篇指南将为你系统讲解网站图片优化的所有要点,包括如何通过图片优化做好谷歌SEO(Google SEO)。
图片优化始于图片选择,随后涉及合理的命名规则、替代文本(alt text)的设置,以及确保文件大小和格式恰当。但在此之前,我们必须先弄清:为什么网站需要图片。
本质上,图片本身就是一种极具冲击力的内容形式。阅读一段简短文字需要一定时间,而图片的处理速度仅需13毫秒,比纯文字快6万倍。多数情况下,你会将图片与文字结合使用来加深观点,这种方式非常高效。如果再把文字信息加工成信息图,视觉表现力会更上一层楼。
信息图有助于品牌传播,但即便是一张恰当的普通照片,也能显著提升受众对内容的理解。包含图片、视频等视觉元素的网页内容,获得的浏览量可能比纯文字网站高出94%。类似地,含有图片的邮件简报会带来更多点击和互动,图片还能延长用户在页面上的停留时间。
你所使用的图片风格,有助于传达品牌特性。每张图片都能增强、优化并巩固品牌形象。这些视觉元素让你有机会传递一致的品牌信息,进而建立品牌熟悉度,最终培养客户忠诚度。这种无需文字就能让用户联想到品牌的能力,价值极高。
图片搜索产生的查询约占谷歌全部搜索查询的10.1%。自谷歌将图片搜索中的“查看图片”按钮更新为“访问[页面]”后,来自图片搜索的网站访问量明显增加。
一个设计精良的网站会将高质量的图片、标志与文字有机整合。在发布任何网站内容时,都应秉持同样态度——不要为图省事而使用模糊不清的图片。
SEO图片优化,是指创建并提供高质量、理想尺寸、格式和分辨率的图片,以提升用户互动。它还包括为图片准确添加标签,使搜索引擎爬虫能够发现并理解图片内容。
网站图片优化的7个步骤
鉴于图片对品牌和在线形象的重要性,仍有不少人对将图片优化纳入谷歌SEO策略感到陌生。以下7个步骤,可帮你改变这一状况:
选择合适的图片
认真处理与图片关联的文本
调整图片大小与格式
考虑采用懒加载
开启浏览器缓存
别忽视图片元数据
创建图片站点地图
搜索引擎致力于向用户展示最相关的内容,图片也不例外。因此,应选择与内容主题紧密相关的图片。例如,如果你专注于社交媒体内容营销,不要为了吸引眼球而随意使用某位名人的照片——除非你的业务真的与该名人有关并获得了授权。不要只为填版面而添加图片。图片存在的意义是补充内容、分隔长段落,并帮助受众更好地理解相关概念。
可能的话,优先使用自有图片。网络世界充斥着图库照片,自创内容会显得与众不同。原创图片独一无二,更能准确表达你的观点。除了照片,你还可以制作图表、信息图和其他视觉辅助材料。例如,经营一家餐厅时,自己拍摄的菜品图片远比通用图库照片更能代表实际出品,还能避免无意中造成虚假宣传。长远来看,掌握产品拍摄的最佳实践能带来明显差别。
当没有自有的、与写作主题匹配的图片,并且图片主要用于辅助说明(而非展示所售产品)时,只要具备合适的授权许可,使用图库照片完全可行。了解图片授权至关重要,因为照片属于知识产权。授权协议规定了图片使用的法律范围。有些图片只要适当标注来源,即可用于多种用途甚至商业用途;而另一些则严格禁止商用。本质上,图片授权是摄影师授予客户/使用者特定权利的合约。你可以通过聘请摄影师委托拍摄,或选用既有作品来获取授权。网络上的既有作品有时可免费使用,但通常需要为使用权付费。
人类天生会被面孔吸引。因此,包含人脸的图片通常在促进转化方面,比其他类型的图形或动画更有效。当然,很多情境下使用人脸图片并不合适。但一旦存在合适的机会,就别错过。
如果你习惯在WordPress等后台直接上传图片,大概记得系统会提示你填写“附件详情”。由于很多人不清楚这些额外信息对谷歌SEO图片优化的影响,往往缺乏耐心去填写。请不要跳过这些文本细节。这些信息对提升图片的SEO效果至关重要。
尽管WordPress是流行的内容管理系统,但以下讨论的原则普遍适用于各种建站工具。我们逐一来看:
为每张图片添加准确、相关的标题非常重要。图片默认标题通常反映上传的文件名,如果是随机的字母数字组合,对搜索引擎帮助很小。因此,上传图片前,请用能准确描述画面内容的关键词来命名文件,并去掉停顿词。关键词之间建议用连字符“-”而非下划线“_”分隔,因为搜索引擎不识别下划线。恰当的关键词有助于搜索引擎更好地理解图片内容,进而改善SEO表现。
搜索引擎通过“蜘蛛”程序抓取网站并记录信息。这些蜘蛛无法“看见”并理解图片,它们只读取代码,需要依赖关联信息来认识图片。Alt文本的设计初衷,是在浏览器无法显示图片时提供文字描述。它也能帮助搜索引擎理解图片内容,并对网站可访问性很重要——方便屏幕阅读器和无法加载图片的浏览器使用者获取信息。在alt文本中植入关键词,能为SEO带来小幅提升,但务必避免关键词堆砌。
做任何图片相关决策时,都应把可访问性纳入考量。对于内联SVG图片,添加<title>元素并通过aria-labelledby关联,能帮助屏幕阅读器解读内容。对于标准图片文件,描述性的alt文本必不可少。alt文本应说明图片展示的内容,而不是充当关键词堆砌的场所。清晰、准确的描述对用户和搜索引擎理解内容均有助益。
图片说明是图片下方所有用户可见的描述性文字。它可以补充图片中不明显的信息,例如拍摄日期、地点和人物,也能用于强化图片的表达意图,即提供更多上下文。若同一图片用于多篇文章,更改配套说明对SEO和用户互动都有帮助。
图片描述常被认为是附件页面“秘而不宣”的利器。你输入的描述,会被储存为附件页面的内容。因此,一旦有人点击该图片附件,就会被带到独立页面,上面会展示图片、标题、说明以及作为页面正文的图片描述。
进行谷歌SEO图片优化时,图片尺寸、文件格式和压缩方式都会影响用户体验。这些因素共同影响加载时间、视觉质量和整体性能。如果图片处理不当,页面加载缓慢可能导致用户流失。
高分辨率图片会拖慢页面加载速度,在移动端尤为明显,而如今超半数搜索来自移动设备。适当缩小图片尺寸是提升加载速度同时保持可接受画质的有效方法。需要分清图片尺寸与文件大小:图片尺寸指像素维度(如1024 x 680像素),文件大小指存储空间(如350 KB)。更大尺寸往往导致文件体积更大,但通过压缩和格式选择可显著减小文件大小。轻微降低图片画质通常不会影响屏幕显示效果,只是限制了打印或放大的能力,而这基本不影响在线浏览体验。
选对文件格式有助于图片优化,因为不同格式适用于不同场景。最常见的网页图片格式为JPEG、GIF和PNG。各格式适用场景如下:
SVG:最适合标志、图标及需要跨屏幕尺寸干净缩放的简单插画,无损画质。
BMP:仅当兼容性要求必需时才用,文件通常偏大。
GIF:适合简单动画和颜色有限的小图形。
JPEG:最适合照片,能兼顾画质与文件大小。
PNG:适合需透明背景或边缘锐利的图片,如图标和图形。
WebP:专为高效压缩和更快的加载设计,在支持的浏览器上体验佳。
AVIF:在浏览器支持时,提供出色的压缩和画质表现。
JPEG:作为最老牌格式之一,特别适合照片,允许用户在文件大小和画质间平衡。最大优点是易压缩,能进一步缩小体积,但色彩可能随时间逐渐变差。
GIF:除了广为人知的动态图片特性,当图像有大面积同色且总颜色数少于256时,GIF是理想选择。同样图像若用JPEG,文件会大很多。此外,小图标和动图也宜采用GIF。
PNG:多数浏览器支持,比GIF色彩更丰富且文件更小,色彩也不像JPEG那样容易变差。但透明PNG在IE浏览器上有时存在缺陷,因此处理非透明图像时用PNG更稳妥。
SVG:可缩放矢量图形,非常适合需处处保持清晰锐利的图像,如Logo。SVG文件能任意缩放,可用CSS控制样式而不损失品质。谷歌支持正确使用SVG,使其兼具设计友好和搜索友好特性。网站中使用SVG有两种常见方式:
内联SVG:将SVG代码直接嵌入HTML,你便能更好地控制样式和可访问性。可通过添加<title>元素并用aria-labelledby关联,帮助屏幕阅读器理解内容。
文件型SVG:用<img>标签或在<picture>元素中引用SVG文件。当你想在响应式设计中提供多种图片格式(例如将SVG与WebP或PNG后备结合)时,此方式很适用。
图片还可通过Data URI(数据URI)内联,将图像数据直接嵌入HTML。这能减少HTTP请求,但可能增大页面体积,需谨慎使用。谷歌支持的“img src”属性内联格式包括:BMP、GIF、JPEG、PNG、WebP、SVG、AVIF。
若选定图片格式后文件仍太大,可考虑压缩。关键要选对压缩率。过度压缩会同时降低文件大小和画质。60%至75%的压缩率通常能保持不错的画质,建议以此为起点,再尝试不同大小和比例,找出最适合自己网站的方案。
图片压缩工具推荐:
在WordPress内直接压缩,可选择Shortpixel或Smush等插件。
在WordPress外部优化,Pixlr(处理JPEG)或GIMP是不错的选择。
图片较多的网站,可考虑WP Rocket、Imagify等工具,它们具备GZIP压缩、缓存及图片优化功能,有助于减小文件体积而不明显牺牲画质。
若不想依赖插件,也可使用Photoshop的“存储为Web所用格式”功能,在最小化文件大小的同时优化画质。
另外可通过下载较小尺寸的图库照片来减小文件体积:若下载前在尺寸预览中看起来没问题,放在网站上效果也相似。还可创建响应式图片,使其根据浏览器和设备大小自动缩放,这有助于提升网站速度和SEO表现。
在响应式设计中,SVG可借助<picture>元素或<img>标签的srcset属性提供多版本。考虑到部分浏览器或抓取工具可能不完全支持这些属性,务必提供标准的src回退。<picture>元素能将不同格式和设备特性整合,确保新格式不兼容时有备选方案。
懒加载是指浏览器延迟加载图片,直到它们即将进入可视区域。这意味着,处于首屏以下、用户需滚动才能看到的图片,一开始不会被加载。懒加载能显著提升网站速度,对于图片较多的长页面效果尤为明显。尽管懒加载对SEO的影响仍有讨论,但谷歌的PageSpeed Insights工具推荐使用它——而谷歌在搜索领域拥有主导话语权。实现懒加载有几种方式,多涉及手动编码。如果使用WordPress,A3 Lazy Load插件备受好评。
浏览器缓存是指将你的文件(包括图片)储存在访客的浏览器中,以便他们日后再次访问时能够更快加载。你可以通过W3 Total Cache等插件来启用浏览器缓存。也可在.htaccess文件中手动添加以下代码来开启:
<IfModule mod_expires.c> ExpiresActive On # Images ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresByType image/png "access 1 year" </IfModule>
可根据实际内容更新频率,将代码中的“1 year”修改为“1 month”或“1 week”等合适时长。
元数据是文件内存储的辅助信息,包括文件的创建或最后编辑时间等。其他图片元数据可能包含缩略图、版权信息和色彩配置文件等。这类信息属于结构化数据,存在于文件或记录的固定字段中。为图片添加结构化数据,有助于搜索引擎将你的图片作为富媒体结果展示。谷歌图片搜索支持产品图片、视频和食谱的结构化数据。例如,如果你网站上有食谱并为其图片添加了结构化数据,谷歌可能会在图片上添加标识,显示它来自食谱。要创建此类结构化数据,建议遵循谷歌的结构化数据指南。
站点地图非常重要,它告知搜索引擎你网站上的所有页面。与常规站点地图强制跨域限制不同,谷歌允许图片站点地图包含来自其他域名的网址。这意味着你可以利用内容分发网络(CDN)来托管图片,从而提升网站性能。好消息是,你无需手动构建图片站点地图。如果使用WordPress,Yoast SEO插件可自动将内容(包括图片、视频、缩略图和文章)添加到站点地图。但Yoast不会包含图片说明,你可能需要参考谷歌开发者文档,通过代码手动添加。
图片对网站不可或缺:它们强化品牌,并大幅提升网站对用户的影响力。然而,图片文件也可能拖慢网站速度,甚至限制你触及用户、损失客户。为对抗这种拖累,同时提升谷歌SEO效果,优化网站图片至关重要。图片优化工作看似繁琐,即便了解了如何选择图片、关联数据和合适的尺寸,也很容易感到应接不暇。但只要你参照本指南分步推进,就能系统性地做好图片优化,为谷歌SEO筑牢基础。
图片优化能帮助搜索引擎更好地理解图片内容,提升网页在图片搜索中的可见性,同时改善页面加载速度和用户体验,这些都是谷歌排名算法中的重要考量因素。优化得当的图片还可能以富媒体结果形式展现,吸引更多点击。
alt文本应准确描述图片内容,像一个简短的图片说明。可以自然融入与页面主题相关的关键词,但要避免堆砌。优先考虑为视障用户和无法加载图片的场景提供有效信息,这既是可访问性要求,也对SEO有益。
没有绝对最优的格式,应根据用途选择:照片多用JPEG以平衡画质与大小;需要透明背景或边缘清晰的图标用PNG;标志和简单插图考虑SVG保证缩放清晰;动画场景用GIF。条件允许时,可提供WebP或AVIF等现代格式以提升加载效率,这对SEO有间接帮助。
合理实现的懒加载不会损害SEO,反而能提升页面加载速度,这是谷歌鼓励的做法。谷歌能够处理遵循标准的懒加载内容。但需确保重要图片能正常被抓取和索引,避免影响其在图片搜索中的展示。
图片站点地图能帮助谷歌发现并索引那些可能无法通过常规抓取找到的图片(例如通过JavaScript加载的图片),为图片出现在搜索结果中创造更多机会。如果网站图片较多或使用了CDN托管,提交图片站点地图是一项值得推荐的优化措施。

我们在微信上24小时期待你的声音
解答本文疑问/谷歌外链咨询/GEO咨询/外贸建站咨询