为您的网站优化图像的4个必知技巧
如果您没有为网站优化图像,则可能会损害搜索排名-并给潜在的客户和客户增加成本。
根据Google的最新更新,页面加载的速度是其性能的关键因素。网站在用户体验方面的排名越来越高,而Google在用户访问和与您的网站互动时的行为取决于Google的用户体验。如果有人访问您的网站并迅速离开网站而没有采取第二次操作(称为“退回”),则可以告诉Google该网站没有达到预期的效果。
您可以想象,加载缓慢的网站将导致潜在的访问者放弃。
内容[ 隐藏 ]
如何优化图像
1.图像尺寸
2.图片格式
3.图像压缩
4.文件大小
如何优化图像
首先在Google Analytics(分析)中或以下位置检查您的网站速度负载:Google PageSpeed Insight。
图片是大多数网站上负载最重的项目,因此需要特别注意以确保图片不会造成长时间的拖延,而拖延会干扰移动访问者。您可以拥有高质量的文本内容,但是如果没有人等待足够长的时间来阅读它,那么它将变得毫无价值。
大多数数字营销策略包括定期更新新闻和博客内容-您可以在此内容策略文章中获得我们的网站审核清单和电子表格。视觉效果是增强旧内容并使其更具吸引力的最佳方法之一。但是,如果图像正在减慢您网站的加载时间,则弊大于利。
关键不是减少图像的使用或完全停止使用它们,而是对其进行优化! 我们整理了一份清单,以优化您网站上的图像。
1.图像尺寸
第一步是查看图像在网站中的显示位置以及所需的尺寸。当我们处理响应式浏览器宽度时,最重要的是图像的宽度(高度成比例地跟随)。
大多数博客的尺寸会有所不同,因此请确保您测量图片的位置! 有一些可以帮助您测量实际屏幕像素尺寸的工具,例如 Page Ruler和Jing。
对于Forge和Smith博客,文字内图片的最大宽度为780px。如果您使用的是台式机,则可以尝试扩展浏览器的宽度-它将始终以780px最大(不缩放)为上限。在移动设备上,图像会缩小到480px(甚至更小),但永远不会更大。优化图像提示1:博客宽度780px
超出此尺寸的每个像素都会增加不必要的额外加载时间,而不会带来任何好处。视网膜显示屏将显示两倍的像素(上图为1560像素),这很好,但是额外的加载时间不值得为此付出回报。视网膜显示屏上的照片看起来仍然很棒。
您会发现本文顶部有一个全角横幅区域。对于这些全角图片,我们使用1800-2000px的宽度。
2.图片格式
您应该使用两种主要的网络图像格式(动画GIF文件除外):
优化图像技巧2:优化图像:JPG和PNG
JPG:由于其压缩选项(在下一节中介绍),通常是大多数图像类型的最佳格式。
PNG:非常适合插图或带有大量平面,纯色块(例如图表和图标)的图表。
通常,JPG是最好的备用,但是您也可以在两个版本中保存图形,并查看哪个文件大小最小。
3.图像压缩
JPG图像为照片提供最佳压缩选项。我使用Photoshop来优化图像,但是有许多免费工具可以达到类似的效果。
JPG压缩设置的范围从1到100(请注意颜色和细节上的差异)的质量:
优化图像技巧3:JPG压缩比例
这里的技巧是在美观的图像和压缩的文件之间找到适当的平衡。我使用的范围是60-80。
WordPress网站最大的优点是拥有丰富的插件,可以协助图像压缩,甚至可以自动化整个过程,因此您不必担心文件大小。查看我们的博客,了解适用于商业网站的最佳WordPress插件,以了解有关我们的两个首选的Imagify和Smush Pro的更多信息。
4.文件大小
所有这些优化都是为了减小文件大小,因此在上传之前,请最后检查一下图像大小是否合适。超过400kb的任何内容都会引发一个标志,并表明您可能尚未对其进行优化。
为您的网站优化图像是确保最佳客户体验的重要一步。满意的客户可以在您的网站上停留更长的时间,并在访问时浏览更多页面。这些行为告诉Google您的网站是高质量且有用的-应该在搜索结果中将其显示在较高的位置。