Faster Loading Images with WebPYouTube↗  IA↗(long shot)
Science & Technology  24.6K views 133 likes 13 dislikes   25 Jun 2014
Google for Developers 2.7M subscribers United States YouTube↗


Please select the problem
You must specify your email and describe the problem in detail
Describe your problem in detail if it's not obvious

Click to Play Video Click to Play Video
HUSAIN BENGALI: Let's talk about reducing the load
フセイン・ベンガリ効率的な 画像圧縮を利用した
time of your website and mobile apps
ウェブサイトやモバイルアプリの
through better image compression.
読み込み時間の短縮について お話ししましょう。
WebP is an image format that delivers
WebPは、従来の 画像フォーマットに比べて
significantly smaller file sizes than traditional image formats.
大幅に小さいファイルサイズを 実現した画像形式です。
I'm Husain, the product manager for WebP,
WebPプロダクト マネージャーのフセインです。
and I'm here to tell you about the format and some
今日はこのフォーマットと
of the recent improvements we've delivered.
最近の改善点について ご紹介します。
Over the past year, the biggest feature we added
この1年間で追加された最大の 機能は、アニメーション
was support for animated images.
画像のサポートでした。
Now you can create high-quality animations
今では、GIFよりも高い 圧縮率を実現しながら、
with rich colors and transparencies,
豊かな色彩と透明度の高い、
all while getting much better compression than GIF.
高品質アニメーションを 作成することができます。
With this addition, WebP now supports
この追加により、現在WebPは
the use cases of all major traditional formats--
JPEG、PNG、GIFなど あらゆる主要な形式の
JPEG, PNG, and GIF.
ユースケースに対応しています。
WebP is already in use across a number of major websites.
WebPはすでに多くの主要な Webサイトで使用されています。
If you use Chrome or Opera to access YouTube or Google Play,
YouTubeやGoogle Playを ChromeやOperaで使用していれば、
you've already been experiencing the benefits of WebP.
WebPの恩恵を すでに体験しているはずです。
When Google Play added support for WebP,
Google PlayがWebPへの 対応を始めてから、
the footprint of image file sizes transferred
ChromeやOperaのユーザーに 転送する画像ファイルサイズの
to Chrome and Opera users dropped by a whole 35%.
フットプリントは35％下がりました。
On YouTube, an increasing number of video thumbnails
YouTubeではWebP形式が 使われている動画サムネイルが
are being served in WebP format, leading to 10% faster page
増えており、ページの 読み込み時間は
loads.
10%速くなっています。
With over one billion users visiting YouTube every month,
毎月10億を超える人が YouTubeを利用する中で、
the aggregate time saved by faster loading images
WebPの運用が完了すれば、 高速の画像読み込み機能により
will be about 140,000 hours each day
短縮される時間は 1日合計約14万時間に
once this rollout is complete.
のぼるでしょう。
So you might be wondering, how can I get started with WebP.
ではWebPを利用するには どうしたら良いでしょうか。
The good news is getting WebP integrated
ご安心ください。 アプリやWebサイトに
into your app or website is easy.
WebPを統合する 方法はいたって簡単です。
You can start by downloading the WebP
このURLでWebPライブラリ をダウンロードすれば
library from the URL shown here.
簡単に始められます。
The included cwebp tool will allow
その中にある cwebpツールを使用すれば、
you to convert your images to the format.
画像をWebP形式に 変換できます。
Note that since not all browsers support WebP yet,
ただ、WebPに対応していない ブラウザもまだあるので、
you will need to fall back to the original image format
互換性のないブラウザに 画像を送信する場合は
when serving to incompatible browsers.
元の画像形式に 戻す必要があります。
WebP is so powerful that many major CDNs have implemented it
WebPは非常に強力なので 多くの主要CDNで
on their side.
実装されています。
That is, the CDN will be able to transcode your images to WebP
つまり、CDNが自動で 画像をWebP形式に変換し、
and serve them to compatible clients on your behalf.
互換性のあるクライアント に送信してくれるのです。
So check with your provider, because they may already
プロバイダ側で対応が始まって いるかもしれませんので、
be able to do much of the heavy lifting for you.
契約中のプロバイダに 確認してください。
If you don't use a CDN, consider the paid speed service
CDNを使用していない 場合は、画像をWebPに
which, amongst many other optimizations,
自動変換してそれを 互換性のあるブラウザに提供する
will automatically transcode and serve
有料の高速サービスが たくさんありますので、
WebP images to compatible browsers.
その中から最適なサービスを 検討してみてください。
If you're the developer of a mobile app that
サイズの大きな 画像コンテンツを持つ
has significant image content, you too
モバイルアプリの 開発者であれば、
can take advantage of the benefits of WebP.
WebPのメリットを 活用することができます。
Android versions 4.0 and above natively support lossy
Androidバージョン4.0以降は 不可逆なWebP Dコードに
WebP D code, and full support across all Android versions
対応、WebP デコードライブラリ すべての機能を利用できます。
can be assured by packaging the WebP D code libs into your app.
Androidの全バージョンで すべての機能を利用できます。
Similarly on iOS, just package the D code libraries
同じくiOS上でも、アプリの 一部としてデコードライブラリを
as part of your app.
パッケージ化してください。
And you'll be able to serve the same content
すると両方のプラットフォームで 同じコンテンツをアプリで
to apps on both platforms.
閲覧できるようになります。
Major native apps such as Google+ and Facebook for both
Google+やFacebookなど、 AndroidとiOSの主要な
Android and iOS already use WebP for faster-loading images
ネイティブアプリには、画像 読み込みが速く帯域幅消費の小さい
and lower bandwidth consumption.
WebPがすでに使われています。
Google+ alone saves over 50 terabytes of bandwidth every
Google+のモバイルアプリに WebPを導入した結果、単独で
day as a result of serving WebP to its mobile apps.
50テラバイトの帯域幅が 毎日節約されています。
To learn more about WebP, visit our developers site.
WebPの詳細は、開発者向け サイトをご覧ください。
Faster-loading images might be less work than you think.
画像読み込み時間の 短縮は思ったより簡単ですよ。
Similar videos:

Componentize the Web
Google for Developers
28.1K views 231 likes 12 dislikes 25 Jun 201437% match


Designing for Google Cast
Google for Developers
28K views 69 likes 2 dislikes 25 Jun 201433% match

The ServiceWorker: The network layer is yours to own
Google for Developers
67.4K views 1.5K likes 18 dislikes 25 Jun 201432% match

Unleash the power of Kiosk Apps
Google for Developers
64.6K views 237 likes 14 dislikes 16 Jun 201432% match

Fabulous Forms for the multi-device web
Google for Developers
25.6K views 115 likes 44 dislikes 25 Jun 201432% match

Getting Your PageSpeed Score Up
Google for Developers
95.2K views 1K likes 30 dislikes 25 Jun 201432% match

Getting your events into the Knowledge Graph
Google for Developers
25.5K views 183 likes 8 dislikes 25 Jun 201432% match

Activity Transitions
Google for Developers
85.1K views 541 likes 25 dislikes 25 Jun 201431% match

Polymer: Creating responsive UIs
Google for Developers
42.9K views 323 likes 14 dislikes 25 Jun 201431% match

Silky smooth Web Animations
Google for Developers
36.7K views 450 likes 6 dislikes 18 Jun 201430% match

From Holo to Material
Google for Developers
64.8K views 792 likes 20 dislikes 25 Jun 201430% match

Designing for Android Wear
Google for Developers
26K views 115 likes 5 dislikes 25 Jun 201429% match


Polymer: Interacting with Google Services using nothing but HTML
Google for Developers
64K views 665 likes 7 dislikes 17 Jun 201429% match

Android Work
Google for Developers
38.5K views 141 likes 6 dislikes 25 Jun 201429% match

The new Gmail API
Google for Developers
119.7K views 434 likes 11 dislikes 25 Jun 201429% match

Bluetooth Low Energy
Google for Developers
37.7K views 212 likes 6 dislikes 25 Jun 201428% match

WebRTC tutorial
Google for Developers
134.5K views 649 likes 23 dislikes 30 Jun 201428% match

DevBytes - What is BigQuery?
Google for Developers
95.7K views 373 likes 19 dislikes 24 Mar 201428% match

Creating a style guide for...Everything!
Google for Developers
30.6K views 208 likes 52 dislikes 24 Jun 201428% match

Building sites for the multi-device web
Google for Developers
35.7K views 138 likes 4 dislikes 25 Jun 201428% match

Google Cloud Messaging
Google for Developers
33.1K views 139 likes 6 dislikes 25 Jun 201428% match

Using the Android Job Scheduler
Google for Developers
43.1K views 300 likes 57 dislikes 25 Jun 201428% match

Polymer: making Web Components accessible
Google for Developers
27.6K views 195 likes 11 dislikes 13 Jun 201427% match

Google Play Services 5.0
Google for Developers
30.9K views 109 likes 18 dislikes 25 Jun 201427% match


DevBytes - Google Compute Engine Core Concepts
Google for Developers
49.3K views 238 likes 8 dislikes 24 Mar 201426% match

ExoPlayer: Adaptive video streaming on Android
Google for Developers
77.5K views 388 likes 31 dislikes 25 Jun 201426% match

Building location-based apps with the Places API
Google for Developers
79.8K views 530 likes 22 dislikes 25 Jun 201426% match

Material design
Google for Developers
4.4M views 16.5K likes 885 dislikes 25 Jun 201426% match

Building a WebRTC app - LIVE!
Google for Developers
85.6K views 322 likes 36 dislikes 30 Jun 201425% match

Maps Made Easier: GeoJSON in the Maps API
Google for Developers
29.9K views 242 likes 11 dislikes 25 Jun 201425% match


Settings Privacy About Contact Donate