WebP格式
WebP是Google推出的一種圖片格式，它基於VP8編碼，可對圖像大幅壓縮。與JPEG相同，WebP也是一種有損壓縮，但在畫質相同的情況下，WebP格式比JPEG圖像小40%。
Wiki
百度百科
它是一個開源項目，我們可以在此獲取其中源碼，以及相關工具。
瀏覽器支持
顯然，Google瀏覽器Chrome首先引入，此外Opera 11.10也增加對WebP的支持。
如果你能看見下面的圖片，說明你的瀏覽器支持WebP。
支持更多的瀏覽器！
WebP的優勢顯而易見，但缺少主流瀏覽器的支持，使得它目前仍然無法推廣。但這並不妨礙我們嘗試！
大多數瀏覽器自身無法解碼WebP格式，但可以交給我們來實現！雖然網頁腳本無法勝任，但借助Flash技術，我們完全可以實現高效快速的解碼。
並且，幾乎所有的瀏覽器都支持Flash...
WebP插件
當前版本共3個文件： WebP.js ， WebP.swf 和 WebP.htc。在此下載打包文件。
在<body></body>之間插入如下代碼，即可使用WebP了。
<script type="text/javascript" src="WebP.js"></script>
插件將會捕捉頁面中使用WebP格式的img元素，並用Flash進行替換。圖像的解碼及顯示都在Flash中完成，因此目前版本對CSS設置的背景圖片無效。
當然，作為JPEG格式的替換，只有對較大的圖像使用才有意義，否則過多的解碼將消耗大量的資源。
Demo1：最簡單的樣列
<img src="Test.webp" />
Demo2：保留原始屬性
<img src="Test.webp" width="250" height="150" title="這是一副WebP圖片！" style="border:red 2px solid" />
Demo3：保留原始樣式
<style>
img
{
filter: alpha(opacity=50);
opacity: 0.5;
}
.t
{
border: blue dotted 2px;
}
</style>
<img class="t" src="Test.webp" />
Demo4：支持動態載入
<div id="con"></div>
<script type="text/javascript">
var d = document.getElementById("con");
function add()
{
d.innerHTML = "<img class='t' src='http://www.etherdream.com/WebP/Test.webp' title='Hello~' />";
}
function del()
{
d.innerHTML = "";
}
</script>
<button onclick="add()">載入</button>
<button onclick="del()">移除</button>
本文轉自：http://www.etherdream.com/WebP/