Я уже давно присматривался к webp — новому формату изображений от Google. Размер меньше, грузится быстрее, а качество страдает совсем не заметно среднестатистическому пользователю. В сети сейчас есть единственное стоящее решение по быстрому и простому внедрению формата webp — это WebPJS — javascript/flashscript скрипт от Dominik Homberger. Всё, что нужно сделать — загрузить на свой сайт два скрипта: webpjs-0.0.2.min.js и webpjs-0.0.2.swf. А потом добавить в код Вашего сайта следующие команды:
<script type=”text/javascript” src=”js/webpjs-0.0.2.min.js”></script>
Естественно, Вы должны указать правильные пути. В примере используется директория js.
Сегодня ещё все браузеры поддерживают формат webp. И для того, чтобы пользователь с любым браузером смог увидеть Ваши изображения используйте следущий скрипт:
<script>(function(){var WebP=new Image();
WebP.onload=WebP.onerror=function(){ if(WebP.height!=2)
{var sc=document.createElement(‘script’);sc.type=’text/javascript’;sc.async=true;
var s=document.getElementsByTagName(‘script’)[0];sc.src=’js/webpjs-0.0.2.min.js’;
s.parentNode.insertBefore(sc,s);}};
WebP.src=’data:image/webp;base64,UklGRjoAAABXRUJQVlA4IC4AAACyAgCdASoCAAIALmk0mk0iIiIiIgBoSygABc6WWgAA/veff/0PP8bA//LwYAAA’;})();
</script>
Этот скрипт проверяет поддерживает ли браузер нативно webp формат. Если поддерживает, то скрипт использует код WebPJS.
Такое решение работает практически во всех браузерах. В IE используется flashscript.
