Let's Diet JPG Image! JPGダイエットする３つの理由
•Download as PPTX, PDF•
0 likes•426 views
アイデアマンズ株式会社のLightFile CoreはJPGファイルの容量削減を行います。そもそもどうしてJPGダイエットしないといけないのか、ということを説明します。
Recommended
Recommended
More Related Content
Featured
Featured (20)
Let's Diet JPG Image! JPGダイエットする３つの理由
- 1. Let’s Diet JPG Image!! JPGダイエットする３つの理由 アイデアマンズ株式会社 新規事業部グロースハッカー 能勢
- 2. コミュニティ：MT東京実行委員 MTDDC Meetup TOKYO 2016実行委員長
- 7. ①テキストファイルよりもJPG テキストファイルをminify化しても、割合はいいけど容量が減らない 種類 元ファイル 削減後 削減割合 削減容量 jQuery 268KB 87KB 約68% 181KB Bootstrap 157KB 125KB 約20% 32KB Photoshop 90% JPG 1026KB 739KB 約28% 287KB 上のJPGをLFCで処理 739KB 421KB 約43% 318KB
- 11. ②表示速度改善で収益が上がる？ ページ読み込み時間が1秒増えると、 1. コンバージョン数が7%減少 2. PVが11％減少 3. ユーザの満足度が16％減少
- 18. まとめ 1. JPGダイエットすると 2. ウェブページを表示する容量が減る 3. ウェブページの表示が早くなる 4. コンバージョンが上がる！
- 21. まずやってみよう！
- 23. 間に合えばデモ
- 24. 人間だけじゃなく、JPGも。
- 25. ご清聴ありがとうございました
Editor's Notes
- レッツ・ダイエット・JPGイメージ！夏も終わり、食欲の秋になりました。 JPGファイルをダイエットする３つの理由 ということで、 わたくし、アイデアマンズのグロースハッカー能勢がお届けします。
- Movable Typeのコミュニティ：MT東京で実行委員をやっています。去年の１１月に開催したMTDDC Meetup Tokyo 2016 では、実行委員長をやらせていただきました。この時、トフのLINEスタンプなんかも発表されていますね。 みなさん、購入しましたか？シックス・アパートさん、どのくらい売れましたか？
- 今日のテーマですが、JPGファイルをダイエットしないといけないんです。その必要性を説明します。
- 人間もメリットがないと、ダイエットしないですよね。 どんなメリットがあるかというと、w部サイトで設定しているコンバージョンが上がる！かもしれないというメリットがあります。
- JPGファイルをダイエットすると、ページを見ている人が、今までよりも早くページを見ることができるようになるんです。この説明をしていきます。
- さてここで、JPGダイエットには３つのポイントがあります。
- まず一つ目は、テキストファイルよりもJPGをダイエットしたほうがよい、ということです。 JSのjQueryは、10,254行もある巨大なテキストファイルです。minify化されたものは割合こそ７割近い削減ですが、容量としては181KBの削減です。 Photoshopで約１MBあるファイルを、画質90%で書き出すと、削減の割合は３割弱ですが、容量としては287KBも削減しています。jQueryよりも100KB近く削減しており、ほぼ1.5倍も削減しているんです。 弊社のLightFileCoreでその画像をさらに処理すると、さらに318KBも削減します。合計で約600KB。jQueryの3倍の容量を削減しています。単一のファイルであれば、テキストファイルよりもJPGをダイエットするほうが効果的というのがよくわかります。
- まず一つ目は、テキストファイルよりもJPGをダイエットしたほうがよい、ということです。 JSのjQueryは、10,254行もある巨大なテキストファイルです。minify化されたものは割合こそ７割近い削減ですが、容量としては181KBの削減です。 Photoshopで約１MBあるファイルを、画質90%で書き出すと、削減の割合は３割弱ですが、容量としては287KBも削減しています。jQueryよりも100KB近く削減しており、ほぼ1.5倍も削減しているんです。 弊社のLightFileCoreでその画像をさらに処理すると、さらに318KBも削減します。合計で約600KB。jQueryの3倍の容量を削減しています。単一のファイルであれば、テキストファイルよりもJPGをダイエットするほうが効果的というのがよくわかります。
- 二つ目は、表示速度の改善で、収益が上がるということです。 このインフォグラフィックスは、2012年にストレンジループという企業が作ったものです。この中でもっともインパクトがあるものを一つあります。
- アマゾン・ドット・コムでは、読み込み時間がたった0.1秒改善されるだけで、なんと売上が1%あがったという事実があります。これはamazonが公表している情報です。
- また、ラドウェアという、ミッションクリティカルなアプリケーションに最適なソリューションを扱う会社があるんですが、「FastView Webアクセラレーション」についてのデータでは、２〜４番目の統計情報が出ています。 読み込み時間が１秒増えると、コンバージョンもPVも下がります。最近注目されているUXにあたる満足度も１６％も下がるんです。 どうですか？読み込み時間増えると、マズいですよね？
- まず一つ目は、テキストファイルよりもJPGをダイエットしたほうがよい、ということです。 JSのjQueryは、10,254行もある巨大なテキストファイルです。minify化されたものは割合こそ７割近い削減ですが、容量としては181KBの削減です。 Photoshopで約１MBあるファイルを、画質90%で書き出すと、削減の割合は３割弱ですが、容量としては287KBも削減しています。jQueryよりも100KB近く削減しており、ほぼ1.5倍も削減しているんです。 弊社のLightFileCoreでその画像をさらに処理すると、さらに318KBも削減します。合計で約600KB。jQueryの3倍の容量を削減しています。単一のファイルであれば、テキストファイルよりもJPGをダイエットするほうが効果的というのがよくわかります。
- そして、３つ目はウェブページにおける画像の割合です。 まずはポータルサイトのヤフーのトップページですが、ヨンブンのサンが画像ですね。
- 続いては、レシピサイトのクックパッドです。 レシピサイトだと画像の割合は半分程度ですが、かなりの割合ですね。
- 最後はブログサイトということで、アメブロです。 これはもう、ほぼ画像しかないという感じです。 というように、例外はあるかもしれませんが、かなりのサイトで画像の軽量化は有効ということがわかります。
- ３つの論点からわかるのが、 テキストのminifyも重要だけど、画像の方が容量を削減できるよ。 ウェブページでは、画像はかなりの割合を占めているよ。 ということがわかります。
- ３つの論点からわかるのが、 テキストのminifyも重要だけど、画像の方が容量を削減できるよ。 ウェブページでは、画像はかなりの割合を占めているよ。 ということがわかります。
- ３つの論点からわかるのが、 テキストのminifyも重要だけど、画像の方が容量を削減できるよ。 ウェブページでは、画像はかなりの割合を占めているよ。 ということがわかります。
- というわけで、画像ファイルをダイエットすると、データが軽くなって、ページも早く表示されるようになります。 その結果、知りたい情報を素早く手に入れるようになります。
- 誰得なのかですが、 閲覧者は今までよりも早く情報を得ることができる。 サイトの運営者は、その結果コンバージョンが上がる。 というメリットがあります。
- まずはやってみましょう！ JpegMiniやTinyPNGでかんたんに画像を軽量化できます。まずはこれらのサイトで軽量化を体感してみてください。
- もう面倒なことは嫌！全部自動にしたい！ という場合は、弊社のLightFileCoreをぜひご利用ください。MT7で構築したサイトでも（たぶん）利用できます。 トライアルに申し込みいただければ、トライアルサイトのご案内をしています。
- もう面倒なことは嫌！全部自動にしたい！ という場合は、弊社のLightFileCoreをぜひご利用ください。MT7で構築したサイトでも（たぶん）利用できます。 トライアルに申し込みいただければ、トライアルサイトのご案内をしています。
- 人間だけじゃなく、JPGもダイエットしましょう。
- ごせいちょう、ありがとうございました