在你的WordPress网站上拥有吸引人、清晰和快速加载的图片是吸引用户/客户最有效的方法之一。汽车经销商花这么多时间确保新车型一尘不染、闪闪发光是有原因的。产品的视觉冲击力往往是决定成败的关键。在线展厅也不例外,而且图片会影响你的加载速度。这是一个被广泛使用和著名的指标,如果一个网站的加载时间超过3秒,用户就会离开这个网站。如果一个网站的加载时间超过3秒,那么很有可能是你网站上的图片造成的。所以作为一个WordPress网站的拥有者,你能做什么来确保你网站上的图片既吸引用户又能让你的网站快速加载呢?您最初的直觉可能只是将图像从1800×1400大小缩小到300×200大小。这将是错误的做法,因为虽然您的图像文件的大小现在可能会小很多,但图像的质量和用户体验都因此受到影响。例如,如果你有一个汽车展示厅销售网站,客户将想要得到一个真正好的汽车,能够看到所有的功能和细节。由于图像变得如此之小,任何对汽车的详细检查都是不可能的——这让潜在客户感到沮丧,转而寻找其他地方。那么你有什么选择呢?值得庆幸的是,有几十种不同的图像文件可供选择,从高质量但文件大小较大的BMP、久经考验的JPEG,到新的、广泛未知的WebP格式。除了选择正确的格式外,重要的是要记住,无论您选择哪种格式,您都可以通过使用一个通过wp – optimization称为“压缩”的过程来减少图像文件大小。
网站速度是十大最重要的因素之一谷歌机器人爬行你的网站观察,当他们在搜索结果中排名你的网站。较差的加载速度会严重影响站点的排名,很容易使您的站点从第一页,到无法被谷歌索引。谷歌在他们的搜索算法中对网站的排名非常严格,如果他们发现该网站由于加载时间较慢而提供了较差的用户体验,他们甚至可能不会经历抓取它并通过谷歌搜索发现它的麻烦。
应该选择哪种图像格式?高质量的图片对于任何现代WordPress网站都是非常重要的,你需要知道使用哪种格式,它们如何影响你的网站的性能,以及如何从你的文件选择中获得最好的效果。网站上最流行的两种图像文件格式是PNG和JPEG/JPG。根据w3techs的数据,超过70%的网站使用这些文件类型。大约30%的网站使用SVG, 22%使用GIF。
这是图像文件类型发挥作用的地方,因为用于上传图像的文件类型发挥着重要作用。在我们进入文件类型之前,我们需要先了解一些概念,比如什么是栅格和位图图像?压缩是什么?有损压缩和无损压缩的区别是什么?
压缩-有损Vs无损
这两种压缩类型都旨在减小文件大小,但真正重要的是它们删除了什么。在有损压缩;与图像质量相关的重要数据被删除。这可以反映在图像被像素化在某些情况下,因为您的计算机可能有麻烦重建图像。在无损压缩中,图像中不相关的数据(如元数据)被减少,这有助于减小文件大小。在此过程中,图像质量完全不受影响。
光栅Vs矢量
最常用的图像文件类型通常是基于栅格的。这意味着它们与每个像素都有一个固定的RGB颜色值,所有这些像素被组合起来,用于创建一个完整的图像。这类文件格式的例子包括jpg、png和gif。另外,一个矢量图像是使用形状和线创建的,可以无限缩放,而不被像素化。这些矢量是使用数学公式创建的,允许用户在不影响图像质量的情况下更改值。现在我们已经浏览了映像的基础知识,现在我们可以查看不同文件类型的详细信息。
JPEG:
这是一种包含压缩图像数据的数字图像格式。JPEG图像的压缩比为10:1,因为它们非常紧凑。JPEG格式包含重要的图像细节,是在互联网上分享照片和其他图像的最流行的图像格式。JPEG图像的小文件大小还可以让用户存储数千张图像(例如在艺术网站上),而不需要站点上额外的存储空间。
JPEG是一种有损压缩文件类型,它很好地适用于照片,但建议在处理图形时使用另一种格式,如PNG。
JPEG图像文件示例。你可以看到在上传时细节和质量都得到了保持。
PNG:
PNG是一种流行的位图图像格式,是“便携式图形格式”的缩写。这种格式是作为图形交换格式(GIF)的替代而创建的。PNG有一些很棒的功能,比如包含24位RGB调色板、灰度图像和显示透明背景。在处理高质量图像或图形时,PNG图像也使用无损数据压缩方法。在图像编辑中也经常使用PNG图像,因为与传统的JPEG格式相比,它可以为用户提供更多的控制和选项。
PNG也使用无损压缩算法,这意味着这种格式可以比JPG保留更多的数据。当使用PNG图像文件时,用户还可以用透明背景保存这些图像。通过使用这种格式,用户可以选择使用可以显示清晰背景的分层图像(例如,只显示下图中的花朵,而不是背景墙),使用户可以将图像添加到其他图像中,而不需要像使用JPEG图像那样删除现有的背景。这是为什么它是图表和插图等图形的首选的主要原因之一。比起上传标准照片,png更受图形用户的欢迎。PNG图片保持高质量,同时也允许你对图片有更多的控制。GIF:你可能最了解“GIF”这个词,因为你在即时通讯应用程序上收到的无数短剪辑。GIF代表“图形交换格式”,主要用于支持没有音频的动画
,与JPEG和PNG不同,GIF用于更小众的情况,通常不用于静态图像(尽管这是可能的)。如果你在你的WordPress网站上使用GIF,它很可能是为了向你的访问者展示一个简单的动画或过程。动图的颜色范围有限,最好用于简单的图形。它们使用无损压缩,往往比jpg更小。一般建议你只在你的网站中少量使用动图,因为它们会增加加载时间(考虑到文件大小),并且限制在256色。
GIF图片示例。为了制作动画,原始图像的质量大大降低了。
SVG:
可缩放矢量图形(SVG)是一种web友好的矢量文件格式。与jpeg等基于像素的光栅图像文件不同,矢量文件通过基于网格上的点和线的数学公式存储图像。这意味着像SVG这样的向量文件可以显著地调整大小而不会丢失任何大小他们的质量,这使他们成为理想的标志和复杂的在线图形。向量只适用于简单的图形、形状和插图。svg是logo的一个很好的选择,特别是如果你需要你的logo响应迅速,并且大多数浏览器都支持,包括Chrome, Firefox, Edge和Opera。
一个向日葵的SVG格式的例子,您可以将其用于标识。
BMP:
位图现在被认为是一种过时的图像格式。BMP以无损图像格式加载图像,由于缺乏压缩,这可能导致巨大的文件大小。考虑到加载速度的重要性,以及站点创建者如何将图像大小保持在最小(更不用说SVG和JPEG格式的流行),这种格式在很大程度上已经不用于在线图像。
当以BMP格式上传时,图像的原始质量是保持的,但文件大小会严重减慢您的网站,不建议。
WebP:
这种图像格式是由谷歌在2010年创建的,并开始在那些上传大量图像到他们的网站的人中流行,因为它比JPEG和PNG有几个优点,例如具有更好的有损和无损压缩性能。
WebP通常上传的文件比JPEG或PNG格式更小,因为它改进了压缩性能,并将占用更少的空间,使其加载更快。虽然不是所有的浏览器都支持它,但所有最流行的浏览器都支持它,包括Chrome、Firefox、Edge和Opera。虽然不像JPEG和PNG那么有名,但WebP可能会成为未来的图像格式选择。结论:在你的WordPress网站上可以使用很多类型的图像格式,但评估图像的用途是很重要的。例如,如果你的网站是一个婚礼摄影师,你会想要保持高质量的图片,仍然加载速度快,用户友好(JPEG)。然而,如果你是在网上海报商店出售图片,那么你就需要尽可能多地保留细节和图片信息(PNG)。作为一个一般的经验法则,如果你只是上传你的在线商店,博客,文件夹,社交媒体或社交媒体网站的标准图像-那么它建议你上传你的图像在一个标准的JPEG格式,然后使用wp -优化进一步压缩你的图像
然而,如果你希望你的图像的未来,并提高你的加载速度尽可能多,那么WebP可以提供优越的有损和无损压缩,同时保持高水平的细节。无论你做什么决定,记住总是使用市场领先的wp – optimization压缩你的图像。