EWWW Image Optimizer で 画像を軽量化してSEO効果を上げる!




1年以上前に更新された記事です。
情報が古い可能性がありますので、注意してください。

ページの表示速度が遅いだけでPVが低下してしまったり、Googleの評価が下がったりするので、アップロードする画像、またはアップロード済みの画像を圧縮してページ表示速度を上げるためにEWWW Image Optimizerというプラグインをインストールする。

このプラグインは、画像を適切に圧縮してくれるのだが、画像についているコメントなども削除してくれる。このあたり気を使って画像を編集してあげればいいのだけど、一発で変換してくれるツールがなかったりで結構めんどくさかったりする。
これを自動で行ってくれるのでかなり重宝する。
RaspberryPi3にはちょっと重たい仕事かもしれないけど…

また、テーマやプラグインで使用される画像も最適化できる所もポイントが高い。

インストール

管理画面のプラグイン→新規追加から「EWWW Image Optimizer」を検索してインストール。または、wordpress.org からダウンロードして手動でインストール。

EWWW Image Optimizer の設定

必要なパッケージのインストール

ewwwi-plugin-status
Missing となっているパッケージをインストールする。

また pngout は、 apt-get でインストール出来ないので、別途ダウンロードして手動でインストールする事となるが、Raspberry Pi用のバイナリは無いようなのでここではインストールしない。

$ sudo apt-get install libjpeg-progs optipng gifsicle imagemagick

使い方

特に設定を変更することなく、いつも通りアップロードすれば自動的に最適化してくれる。

メディアライブラリ画像の最適化

すでにアップロードされている画像は、管理画面のメディアメニューにある「一括最適化」から一括で最適化することが出来ます。
EWWW Image Optimizer メディアライブラリ以外の最適化 3

メディアライブラリ以外の画像の最適化

テーマ内やプラグインで使用する画像を最適化するようにしましょう。
詳細設定の「最適化するフォルダを指定」にプラグインとテーマのフォルダパスを絶対パスで指定します。
EWWW Image Optimizer メディアライブラリ以外の最適化 1
設定後、メディアメニュー配下にある一括最適化から「メディアライブラリ以外の最適化」を実行します。
EWWW Image Optimizer メディアライブラリ以外の最適化 2
これで、テーマやプラグインで使用される画像も最適化されます。

jpegtranの最新版を手動でインストール

apt-getでインストールしたjpegtranのバージョンが古かったので、最新版を手動でインストールする。

コンパイル

$ cd /opt
$ sudo wget http://www.ijg.org/files/jpegsrc.v9b.tar.gz
$ sudo tar zxvf jpegsrc.v9b.tar.gz
$ sudo rm jpegsrc.v9b.tar.gz
$ cd jpeg-9b
$ sudo ./configure CPPFLAGS='-g -O2 -fstack-protector-strong -Wformat -Werror=format-security -D_FORTIFY_SOURCE=2' LDFLAGS='-Wl,-z,relro'
$ sudo make

パッケージ作成

管理をしやすくするために、パッケージを作成してインストールする。

$ sudo checkinstall --install=no

checkinstall 1.6.2, Copyright 2009 Felipe Eduardo Sanchez Diaz Duran
           このソフトウェアはGNU GPLの下でリリースしています。


The package documentation directory ./doc-pak does not exist.
Should I create a default set of package docs?  [y]: y

パッケージのドキュメンテーションを準備..OK

このパッケージの説明を書いてください
説明の末尾は空行かEOFにしてください。
>>(エンターキーを押す)

*****************************************
**** Debian package creation selected ***
*****************************************

このパッケージは以下の内容で構成されます:

0 -  Maintainer: [ root@raspberrypi3 ]
1 -  Summary: [ Package created with checkinstall 1.6.2 ]
2 -  Name:    [ jpeg ]
3 -  Version: [ 9b ]
4 -  Release: [ 1 ]
5 -  License: [ GPL ]
6 -  Group:   [ checkinstall ]
7 -  Architecture: [ armhf ]
8 -  Source location: [ jpeg-9b ]
9 -  Alternate source location: [  ]
10 - Requires: [  ]
11 - Provides: [ jpeg ]
12 - Conflicts: [  ]
13 - Replaces: [  ]

変更するものの番号を入力してください。Enterで続行します:(エンターキーを押す)

Installing with make install...

インストール

$ sudo dpkg -i jpeg_9b-1_armhf.deb

OptiPNGの最新版を手動でインストール

コンパイル

$ cd /opt
$ sudo wget http://downloads.sourceforge.net/project/optipng/OptiPNG/optipng-0.7.6/optipn.tar.gz
$ sudo tar zxvf optipng-0.7.6.tar.gz
$ sudo rm optipng-0.7.6.tar.gz
$ cd optipng-0.7.6
$ sudo ./configure
$ sudo make

パッケージ作成

$ sudo checkinstall --install=no

checkinstall 1.6.2, Copyright 2009 Felipe Eduardo Sanchez Diaz Duran
           このソフトウェアはGNU GPLの下でリリースしています。


The package documentation directory ./doc-pak does not exist.
Should I create a default set of package docs?  [y]: y

パッケージのドキュメンテーションを準備..OK

このパッケージの説明を書いてください
説明の末尾は空行かEOFにしてください。
>>(エンターキーを押す)

*****************************************
**** Debian package creation selected ***
*****************************************

このパッケージは以下の内容で構成されます:

0 -  Maintainer: [ root@raspberrypi3 ]
1 -  Summary: [ Package created with checkinstall 1.6.2 ]
2 -  Name:    [ optipng ]
3 -  Version: [ 0.7.6 ]
4 -  Release: [ 1 ]
5 -  License: [ GPL ]
6 -  Group:   [ checkinstall ]
7 -  Architecture: [ armhf ]
8 -  Source location: [ optipng-0.7.6 ]
9 -  Alternate source location: [  ]
10 - Requires: [  ]
11 - Provides: [ optipng ]
12 - Conflicts: [  ]
13 - Replaces: [  ]

変更するものの番号を入力してください。Enterで続行します:(エンターキーを押す)

Installing with make install...

インストール

$ sudo dpkg -i optipng_0.7.6-1_armhf.deb

Gifsicleの最新版を手動でインストール

コンパイル

$ cd /opt
$ sudo wget https://www.lcdf.org/gifsicle/gifsicle-1.88.tar.gz
$ sudo tar zxvf gifsicle-1.88.tar.gz
$ sudo rm gifsicle-1.88.tar.gz
$ $ cd gifsicle-1.88
$ sudo ./configure CPPFLAGS='-g -O2 -fstack-protector-strong -Wformat -Werror=format-security -D_FORTIFY_SOURCE=2' LDFLAGS='-Wl,-z,relro'
$ sudo make

パッケージ作成

$ sudo checkinstall --install=no

checkinstall 1.6.2, Copyright 2009 Felipe Eduardo Sanchez Diaz Duran
           このソフトウェアはGNU GPLの下でリリースしています。


The package documentation directory ./doc-pak does not exist.
Should I create a default set of package docs?  [y]: y

パッケージのドキュメンテーションを準備..OK

このパッケージの説明を書いてください
説明の末尾は空行かEOFにしてください。
>>(エンターキーを押す)

*****************************************
**** Debian package creation selected ***
*****************************************

このパッケージは以下の内容で構成されます:

0 -  Maintainer: [ root@raspberrypi3 ]
1 -  Summary: [ Package created with checkinstall 1.6.2 ]
2 -  Name:    [ gifsicle ]
3 -  Version: [ 1.88 ]
4 -  Release: [ 1 ]
5 -  License: [ GPL ]
6 -  Group:   [ checkinstall ]
7 -  Architecture: [ armhf ]
8 -  Source location: [ gifsicle-1.88 ]
9 -  Alternate source location: [  ]
10 - Requires: [  ]
11 - Provides: [ gifsicle ]
12 - Conflicts: [  ]
13 - Replaces: [  ]

変更するものの番号を入力してください。Enterで続行します:(エンターキーを押す)

Installing with make install...

インストール

$ sudo dpkg -i gifsicle_1.88-1_armhf.deb

EWWW Image Optimizerを日本語化

ざっと使いそうなところだけ翻訳してみました。
機械翻訳がベースなので、所々日本語がおかしい場合があります。
間違っているところ、こう訳した方が分かりやすい等ありましたら連絡をお願いします。

解凍後、common.phpとlanguagesフォルダをアップロードして下さい。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です