|
图片优化做的好也能带来不菲的流量，图文并茂可以说是所有站长默认的创作方式，然而图片过大对页面的打开速度影响是很大的，由此才需要我们也给图片做优化。图片优化不仅仅是为了吸引潜在消费者，另一个目的就是增加图片搜索所带来的流量，又或是提升网站加载速度，图片优化图片优化起着至关重要的作用。说到图片优化，最常用的就是给图片加alt属性，图片压缩等，这些只是比较粗线条的优化，想要做好图片优化只是这样是不够的，远远没有这么简单，这只是开始。
图片优化做的好也能带来不菲的流量
% Q3 t1 Z, r9 i6 _ 要做图片优化，首先我们需要先给图片减减肥。 + h2 [4 {" N+ p6 X' j/ O) k
我们先来看看这些数据，大部分PC用户不会等待超过3秒的网站加载速度，而在移动设备上则不会等待超过5秒钟，5秒还没有加载出来，结果就是用户关掉页面，还会给用户留下不好的印象。
. J4 H' c; \6 v$ @+ N# w: e' O
亚马逊发现如果他们的网站加载速度慢了1秒钟，他们一年将损失16亿美元。
( T) [, E M# R2 g( }6 f1 R% @
搜索引擎已经将网站加载速度列入了排名算法之中，如果你网站有大量的图片致使网站非常臃肿，将严重影响网站加载速度，如果超过10秒钟，那你等着和你的客户说拜拜吧。
0 ]7 W# F9 `) h5 q1 ]- E
有些理论说图片的大小应该保持在70kb以下，这个到没有明确的规格，有的时候为了保证图片的清晰度，图片稍微大点是在所难免的。个人觉得，不要用一个标准去限制每一张图片的大小，我们的最终目的只是保证在不影响清晰度的情况下，尽可能的降低图片大小来保证页面的打开速度。 9 Z- t0 {3 L# q$ K. S7 z7 T
不同的图片格式对图片优化也是有影响的。 ' l* b" X1 k: D
目前最流行的三种图片格式就是：JPEG、GIF、PNG。
& R3 ]. k$ i% a# j
JPEG (或者说 .jpg) 是最常用的图片压缩格式，支持最高级别的压缩。通常，对于显示要求比较高的图片来说，JPEG格式展示的图片效果较GIF和PNG有明显的优势。 1 |9 T4 e' e* X2 _
GIF (.gif) 的图片显示质量要比JPEG逊色很多，通常用作非常简单的图片展示，比如素材或者装饰性图案，gif也可以用来制作动画。gif不适合用作高显示质量的图片。 / s; |+ u; \3 ]0 j: C J! }: r! S
PNG(.png)图片是比GIF更好的选择，因为PNG图片支持的色彩要比GIF多。和JPEG一样，PNG反复保存也不会影响图片质量，而且对于小图来说，PNG占用的体积极小，PNG完美支持透明背景，一般logo或一般装饰性图案都会选择PNG格式。注意PNG-24图片体积是PNG-8版本的3倍，对待PNG你要十分小心，看仔细了。
1 |5 X9 m7 u4 [
如下是一个例子，通过对比相同体积下(都是24kb)不同格式的图片
3 R& o3 D% Q; K* A/ `( V+ ]! f
可以很清楚的看到，JPEG显然是获胜者，在同样的体积下，GIF和PNG必须以牺牲图片质量为代价。不过话又说回来，对于非常小的图片来说(比如小于5K)，PNG是比较好的选择，相比GIF，PNG可以在体积很小的情况下依然不会让图片失真。
; w% ^2 [ l+ ] ~! j
对于那些对图片质量要求极高的站长来说，JPEG毫无疑问是首选，绝对不要用GIF来当做产品大图。不然的话文件尺寸会非常大不说，也没有很好的办法去压缩它(一压缩就失真)。可以用GIFs做动画或是装饰性小图。 6 v" c4 T' b- x! }" Z9 g2 i( G* Y
PNG可以作为JPEG和GIF的替代，如果你想把产品图片做成PNG格式，尽量用PNG-8而非PNG-24。PNG同时也擅长处理简单地装饰图而只需很小的体积，PNG将会变得越来越流行。当然了，大部分的图片编辑软件可以转换以上三种形式的图片格式。 " c. o' ]+ T9 e, Q q6 _( @
如果你希望提供更大的图片让用户欣赏，不建议将大图直接放在网页上然后用css将图片缩小，虽然看上去图片变小了，但是图片的真实尺寸还是没有变的，这会严重影响页面加载速度。相反，你可以先放一张较小的图片，然后提供查看大图的功能，不管是点击弹出大图还是另外新页面显示，都是极好的。 5 r1 y% {" i% C' O
还有一些人会把一张大图切成一张张的小图做拼接，这样做虽然可以让图片快速显示，但这样做会增加服务器的请求数，从而会影响网页加载速度。所以，如果对图片的要求非常高的话，建议为图片专门配置专门的服务器。 ' n0 i. j% F, p% T/ y
首页显示缩略图是个不错的选择。 ' A3 l2 ?% s% o4 ]
尽可能压缩缩略图体积，缩略图的图片不要过分追求显示质量，当用户点击到下一层详情页面的时候再给他一张高质量的图片。
# D' g5 g- k" V( G! J
不要为缩略图设置alt标签，我们并不希望搜索引擎索引的是缩略图而应是详情页的高质量原图。
( K0 W9 |& x, b- `
背景图、按钮图，边框图等都可算作装饰图，作为一名SEOer，你需要仔细去检查这些图片的体积是否过大，是否会影响网站载入速度。
9 z# J: @' K8 n A5 y$ c- _" G
如果只是一些边框类的、或是简单的样式图片，使用PNG-8或者GIF，可以创建非常好看的图片并且只占几百byte的体积。如果可能的话，尽量使用css来创建一些特殊效果，而非图片。 : q3 x% d- G2 J: Y3 v
不建议为网站设置背景图片，如果一定要有的话，在保证清晰度的前提下最大程度去压缩体积。你还可以把背景图当中镂空或保持透明来压缩体积。 ; O1 y- n" _, H8 g# O( `
更多的免费友情链接交换，流量交换尽在：2898站长资源平台 8 w. a X) I* d5 g- a- z2 e2 G4 k
图片优化做的好也能带来不菲的流量
) l0 ~( ?# L' T# h9 t0 u
5 [7 m) t8 U; B, {/ ]% ` | 
