Blogging Tips — 优化博客中的图片

在文章中加入图片可以增加文章的吸引力，提高博客的观赏性。然而，图片也是博客加载速度变慢的主要原因，因此做好图片的优化显得非常重要。

1. 图片大小的优化

在把图片上传到你的WP之前，首先要将它的体积尽量变小。以比较常用的PhotoShop为例：打开所要编辑的图片 后， 在工具栏选择 文件–储存为Web所用格式：通过对图片品质数的设定可以改变图片所占的大小，如下图：

对于不使用Photoshop的博友，也可以在线编辑你的图片，这里为大家推荐两个这样的网站：online image optimizer 和 图片仓库 .

2. 图片效果的优化

把图片处理成渐进式的效果，这样在浏览器加载图片的时候会先出现比较粗略的轮廓，然后逐渐细化，最终出现最清晰的图像，这样处理的好处是：访问者不会因为等的不耐烦而离开，具体的效果可以打开：EZY Street, 注意主页那张博客与保险 的图像的加载过程。如何实现图片的渐进效果？以Paint Shop Pro为例：选择Save As–JPEG–单击Option选项–选择Progressive Encoding.

3. 图片属性的优化

对图片的height和width进行设置。如果没有设置好，那么在浏览器加载图片的时候会先判断图片的尺寸，然后再加载其余的部分，也就是说图片下面的文字部分在图片加载好之前不会被显示，这样会往往使你的读者失去耐心。

4. 图片的搜索引擎优化

和你博客中的文章一样，你博客中的图片同样会被搜索引擎收录，然而，搜索引擎是无法识别图片的内容的，比如下面这张图片：

搜索引擎并不能识别你的图片是一只小狗，因此需要做好对图片属性的描述，除了上面的height和width属性外，更重要的是alt和title属性，这将告诉google你的图片是什么内容，在Wordpress中不需要你编辑html代码，你可以在Wordpress后台–manager–uploads中对你所上传的图片进行描述，然后在写post的时候设置图像的属性，如下图：

如果你喜欢本文，想继续关注 《Blogging Tips系列文章》，可以考虑订阅本博客，”后80花园“会陆续为你翻译和创作更多博客技巧类文章，致力于探讨国外优秀的经验，供大家一起学习借鉴。

23条留言

• At 2008.02.14 18:53, chada said:

  补充一点我自己关于图片载入的想法：
  如果是比较大的图片，建议在图片页面中使用缩略图，然后链接到原图片。WordPress用户可以使用类似于Lightbox的插件进行图片调用。缩略图因为在上传的过程中对图片尺寸和像素大小都经过压缩，所以载入的速度会快很多。
  如果你的空间速度不是很良好，那么载入图片必然需要很多时间，这时你可以把图片上载到其他速度比较快的服务器或这是图片在线存储网站，然后调用出来。

  chada’s last blog post..情人节，快乐

  [Reply]
• At 2008.02.14 19:20, Moon said:

  @chada:感谢你的补充，thanx a lot

  [Reply]
• At 2008.02.14 20:53, Newslinking said:

  不好意思最近比较忙所以很久没更新Blog
  也没有及时回复和拜访大家的Blog，见谅见谅~
  提前说声元宵快乐！

  Newslinking’s last blog post..Crayon Physics Deluxe——享受绘画的乐趣

  [Reply]
• At 2008.02.14 20:57, isofter said:

  就是不知道有没有单独的“储存为Web所用格式”的图像编辑软件的

  isofter’s last blog post..Eisoo DiskGenius 3.0.211 Beta 1

  [Reply]
  • At 2008.02.14 22:51, Estyle said:

    以前用ACDSEE（3.x）版的时候，又快又方便，后来4.x就垃圾了～
    OFFICE套件中仿佛有个啥东西可以方便地压缩图片，没仔细看过，用用就过去了，不就图个方便吗？（好像叫picture manager）
    还是怀念以ACDSEE 3.x的美好时光。

    [Reply]
• At 2008.02.14 23:15, JackyCheung said:

  初次光临,很不错的Blog,学到很多…

  [Reply]
• At 2008.02.15 01:42, xxxl said:

  说实话。我还真没有注意什么多呢。学习一把。
  我平时都是图个好看。

  xxxl’s last blog post..襁褓式微笑

  [Reply]
• At 2008.02.15 01:53, Tommy said:

  That’s a good idea to save the photos on some online storage web stations. I think the important things are the first two tips.
  Haha, have a nice day.

  Tommy’s last blog post..Singaporean Writing - Feb 09, 2008

  [Reply]
  • At 2008.02.15 04:30, Moon said:

    The same to you ^.^

    [Reply]
• At 2008.02.15 02:13, 暗流|够趣堂 said:

  那些工具我都有用，只是PS不太习惯，ps有在线版的推荐一下（http://www.splashup.com/splashup/），z-blog可以规定图片的大小，读者看到的是缩小图，读者点之后就会原大小，这个功能不错的

  暗流|够趣堂’s last blog post..Medinalia:提供免费的全球网络电视和广播

  [Reply]
• At 2008.02.15 06:19, 小森 said:

  学习了……

  小森’s last blog post..春节齐欢乐，找茬就送礼！

  [Reply]
• At 2008.02.15 08:56, 大帝007 said:

  恩，自己插入图片都没怎么注意这些，看样以后要多注意了啊，呵呵

  大帝007’s last blog post..情人劫之礼-很傻很天真

  [Reply]
• At 2008.02.15 23:50, cardoffer said:

  不错的博客,居然跟我用一样的theme,呵呵.我个人习惯用photoshop or microsoft picture manager,两者都可存为网页模式.

  [Reply]
• At 2008.02.16 05:51, wang said:

  很好，我平时不注意些alt，看来这个也很重要哦！！

  wang’s last blog post..创意十足的网站

  [Reply]
• At 2008.02.17 02:47, Newslinking said:

  很有用，特别是改大小能节约空间和加载时间
  话说我觉得WP的图片插入实在麻烦
  还是离线编辑器比较好

  Newslinking’s last blog post..Crayon Physics Deluxe——享受绘画的乐趣

  [Reply]
• At 2008.02.17 12:41, 痴情的猪 said:

  支持这篇文章？请你在下面为我digg一下 ^.^ thanks

  痴情的猪’s last blog post..我他妈当了24年的处男了

  [Reply]
• At 2008.02.18 05:47, knight said:

  受用了，刚好在写一整个系列哦，每篇都会有一两张图片，太棒了

  knight’s last blog post..世界顶级杀毒软件之Nod32

  [Reply]
• At 2008.02.19 04:35, Owen said:

  我回来了!看来你寒假的收获不小啊！！

  [Reply]
  • At 2008.02.19 04:45, Moon said:

    呵呵..学了不少东西^.^

    [Reply]
• At 2008.02.19 05:34, 痴情的猪 said:

  一样一样。我博客上的每张图都PS处理过。
  而且发布时也加上ALT！

  痴情的猪’s last blog post..网游CS的联想

  [Reply]
• At 2008.06.12 20:01, WP.ORG.CN | 为你的Wordpress提速教你5个技巧 said:

  […] 博客中图片的优化对于提高加载速度也很重要，我之前已经翻译的《博客图片的优化》一文专门讨论这个问题 […]

  [Reply]
• At 2008.07.25 00:18, Semor said:

  火狐下面图片默认是渐变显示的吧

  Semor’s last blog post..什锦八宝饭

  [Reply]
• At 2008.08.10 18:46, sqwyt said:

  港开始用着个。学习一下

  [Reply]