こんにちは
当ブログ管理人のこだま(@wptankentai)です。
今日はワードプレスに大きすぎる画像を取り込まないように設定できるプラグイン、【imsanity】の使い方と設定方法を紹介します。
簡単に使えるし、一回設定してしまえば基本的に放置で大丈夫。
ワードプレスでブログを立ち上げたらすぐに設定しておくと良いと思います。
目次
画像圧縮プラグイン「imsanity」はこんな事ができます。
- 大きすぎる画像を適切なサイズにしてくれます。
- もう既にワードプレスに取り込んだ画像を一括圧縮もできます。
【imsanity】は画像をワードプレスに取り込む際に、大きすぎる画像は小さくしてくれます。
画像が大きすぎるとなんでダメなの?
最近のデジカメやスマホに搭載のカメラで撮影した画像は、ファイルサイズ的に大きすぎてブログに表示する際に時間がかかったり、サーバーの容量を無駄に消費してしまいます。
ブログ自体の表示速度を落とす原因にもなってしまい、ブログが表示されるまでの時間があまりにも遅いと、検索順位も下がってしまうと言われています。
検索順位が下がるとあなたのブログは誰の目にもふれず読まれなくなってしまいます。
なのでワードプレスに取り込む際に出来るだけコンパクトにしておく必要があるんですね。
imsanityは簡単なセットアップで不必要に大きい、高解像度の画像を圧縮してくれるのでワードプレスを使っているブロガーさんやサイト運営者さんには必須のプラグインだと思います。
imsanity のインストール方法
imsanityのインストール方法は簡単です。
他のプラグイン同様に、管理画面の【プラグイン】から【新規追加】をクリック。
検索窓に【imsanity】を入力します。
「imsanity」が出てきますので【いますぐインストール】をクリックします。
インストールが完了したら【有効化】をクリックで設定の準備ができました。
次は実際に使う前に設定をしていきます。
imsanity の設定と使い方
imasanityの設定と使い方はかんたんです。
はじめにも書きましたが、imsanityは一度設定してしまえば後に変更する必要を除いてそのまま放置で良いのでとても簡単です。
imsanityの設定項目を見てみる
imsanityの設定項目は上から以下の通りに並んでいます。
- 固定ページ/投稿でアップロードされた画像
- メディアライブラリへ直接アップロードされた画像
- その他の方法でアップロードされた画像(テーマヘッダー、背景、ロゴなど)
- JPG画像品質
- BMP形式をJPG形式へ変換する
- PNG形式をJPG形式へ変換する
- Deep Scan
step
1固定ページ/投稿でアップロードされた画像
1固定ページ/投稿でアップロードされた画像
ここでは「固定ページ」と「投稿画面」でアップロードされた画像を設定します。
最近の画面は横幅が1200px(ピクセル)ぐらいの記事画面幅が良いという事で、ワードプレステーマ自体がワイド画面(記事部分の幅が1200pxぐらい)に対応している事が多いと思います。
大きい画像が多少小さく表示された場合にはキレイに表示されますけど、小さい画像を引き延ばして大きく表示した場合、粗さが目立つ画像になってしまうので、色々調節してみてください。
私は、実際の幅である1200pxよりも少し大きめの1400を設定しています。
この設定にする事で、ブログの表示幅1200pxに表示された時もしっかりした解像度を維持したまま表示されると思います。
はてな
2カラムの表示(サイドバーが右か左にある設定)の場合は1200pxで十分なのですが、私は1カラムでページを表示する場合を考慮して最大幅1400px、最大の高さ800にしています。
step
2メディアライブラリへ直接アップロードされた画像
2メディアライブラリへ直接アップロードされた画像
ここでは【メディアライブラリ】画面でアップロードした画像の数値設定になります。
ここでも上の【固定ページ/投稿でアップロードされた画像】と同じ設定で大丈夫です。
step
3その他の方法でアップロードされた画像(テーマヘッダー、背景、ロゴ)
3その他の方法でアップロードされた画像(テーマヘッダー、背景、ロゴ)
ここではヘッダー画像やロゴ、背景画像などの最大サイズを指定します。
テーマによって推奨されるロゴやヘッダーサイズなどがちがうのでそれぞれに応じた数値を入力してください。
step
4JPG画像品質
4JPG画像品質
サイトに取り込みたいJPG画像の品質を設定します。
数値が高ければ高品質、低ければ粗い、低品質の画像になります。
メモ
デフォルトでは「82」と設定されています。
step
5BMP形式をJPG形式へ変換する
5BMP形式をJPG形式へ変換する
ここではBMP 形式からJPG形式に変換するかどうかを設定します。
デフォルトでは「はい」になっていると思いますが、そのままで大丈夫です。
BMP形式って何?
BMPはビットマップ形式の略だそうです。
縮小した際に色が失われる傾向が有るのが特徴の画像形式なので、ブログやアフィリエイトサイトなどには必要無いと思います。
私は通常JPG形式で画像をアップロードしています。
step
6PNG形式をJPG形式へ変換する
6PNG形式をJPG形式へ変換する
PNG形式をJPG形式に変換するかどうかを設定します。
ここもデフォルトでは「はい」が選択されていますのでそのままで大丈夫です。
PNGとJPGはどうちがうの?
画像の形式で良く見かける「PNG」と「JPG」この違いはなんだかよく分からない人多いと思います。
私もその一人です。
基本的にはJPGの方が画質を保ったままファイルサイズを小さく出来るので、PNGよりもJPGを選ぶ様にした方が良いみたいです。
また、PNGは古いブラウザーでは表示されなかったりする場合があるようですので、この事からもjPGを選ぶようにした方が良い理由ですね。
step
7Deep Scan
7Deep Scan
通常ココはチェックをいれないで大丈夫です。
【Deep Scan】はなんのことか良く分らなかったので調べてみると、どうやらワードプレス内にある画像全体をスキャンした際になんども同じ画像をなぞってしまう場合が有る様です。
この現象が起きたときにだけチェックを入れるとの事。
step
8変更を保存
8変更を保存
設定が完了したらひとまず「変更を保存」をクリックします。
まだこの段階では画像は圧縮されていません。
注意ポイント
画像の圧縮を開始する前には必ずバックアップを取ってから行うようにしてください。
「imsanity」では、設定されたサイズよりも小さい画像は圧縮はせずそのままになります。
圧縮された画像は元に戻らない事と、オリジナル画像は削除されてしまうのでそこも踏まえた上で使う様にしてください。
次に実際に画像を圧縮していきます。
【画像を検索】ボタンをクリックすると、今回の私のブログの場合4つ検索されました。
最後に【選択した画像のサイズを変更する】ボタンをクリックして圧縮完了です。
imsanityの良いところ
設定した数値よりも画像が小さい場合は圧縮されません。
imsanityは、上で設定したサイズよりも小さい画像を取り込んだ際には圧縮されず何も変更されません。
imsanityの圧縮はタテヨコの比率を維持してくれます。
【imsanity】は圧縮の際にタテヨコの比率を維持してくれますので圧縮した際に比率がおかしくなる事がないので使いやすいです。
まとめ
最後に
imsanity自体の設定や使い方はとても簡単だったと思います。
ただ、扱う画像の種類などがいろいろあってややこしいと思ったかもしれません。
そんな時は【基本的にブログやサイト運営ではJPG形式を使う】ぐらい大雑把に覚えておけば大丈夫だと思います。
それから、画像の圧縮率を高めて設定してしまうと画像がギザギザになってしまったり粗さが目立つ画像になってしまうので、一度設定したら一つ画像を取り込んでみて設定を確認する様にしてください。
あわせて読みたい