Twitter でフォロー

imsanityの使い方

https://www.wordpresstankentai.tokyo

imsanity プラグイン

画像圧縮プラグイン「imsanity」の設定方法と使い方まとめ

投稿日:

こんにちは

当ブログ管理人のこだま(@wptankentai)です。

 

今日はワードプレスに大きすぎる画像を取り込まないように設定できるプラグイン、【imsanity】の使い方と設定方法を紹介します。

 

簡単に使えるし、一回設定してしまえば基本的に放置で大丈夫。

ワードプレスでブログを立ち上げたらすぐに設定しておくと良いと思います。

 

画像圧縮プラグイン「imsanity」はこんな事ができます。

imsanityは画像圧縮プラグインだけどどんな事ができるの?

 

  • 大きすぎる画像を適切なサイズにしてくれます。
  • もう既にワードプレスに取り込んだ画像を一括圧縮もできます。

 

【imsanity】は画像をワードプレスに取り込む際に、大きすぎる画像は小さくしてくれます。

 

画像が大きすぎるとなんでダメなの?

最近のデジカメやスマホに搭載のカメラで撮影した画像は、ファイルサイズ的に大きすぎてブログに表示する際に時間がかかったり、サーバーの容量を無駄に消費してしまいます。

ブログ自体の表示速度を落とす原因にもなってしまい、ブログが表示されるまでの時間があまりにも遅いと、検索順位も下がってしまうと言われています。

検索順位が下がるとあなたのブログは誰の目にもふれず読まれなくなってしまいます。

なのでワードプレスに取り込む際に出来るだけコンパクトにしておく必要があるんですね。

imsanityは簡単なセットアップで不必要に大きい、高解像度の画像を圧縮してくれるのでワードプレスを使っているブロガーさんやサイト運営者さんには必須のプラグインだと思います。

 

imsanity のインストール方法

imsanityのインストール方法は簡単です。

他のプラグイン同様に、管理画面の【プラグイン】から【新規追加】をクリック。

imsanityの使い方

 

検索窓に【imsanity】を入力します。

imsanityインストール

 

「imsanity」が出てきますので【いますぐインストール】をクリックします。

 

imsanityインストール

 

インストールが完了したら【有効化】をクリックで設定の準備ができました。

 

次は実際に使う前に設定をしていきます。

imsanity の設定と使い方

imasanityの設定と使い方はかんたんです。

 

はじめにも書きましたが、imsanityは一度設定してしまえば後に変更する必要を除いてそのまま放置で良いのでとても簡単です。

 

imsanityの設定項目を見てみる

imsanityの使い方

 

imsanityの設定項目は上から以下の通りに並んでいます。

 

  1. 固定ページ/投稿でアップロードされた画像
  2. メディアライブラリへ直接アップロードされた画像
  3. その他の方法でアップロードされた画像(テーマヘッダー、背景、ロゴなど)
  4. JPG画像品質
  5. BMP形式をJPG形式へ変換する
  6. PNG形式をJPG形式へ変換する
  7. Deep Scan

 

step
1
固定ページ/投稿でアップロードされた画像

ここでは「固定ページ」と「投稿画面」でアップロードされた画像を設定します。

 

最近の画面は横幅が1200px(ピクセル)ぐらいの記事画面幅が良いという事で、ワードプレステーマ自体がワイド画面(記事部分の幅が1200pxぐらい)に対応している事が多いと思います。

 

大きい画像が多少小さく表示された場合にはキレイに表示されますけど、小さい画像を引き延ばして大きく表示した場合、粗さが目立つ画像になってしまうので、色々調節してみてください。

 

私は、実際の幅である1200pxよりも少し大きめの1400を設定しています。

この設定にする事で、ブログの表示幅1200pxに表示された時もしっかりした解像度を維持したまま表示されると思います。

 

こだま
この設定も好みや必要性に応じて変えてみてください。 個人的には1040pxぐらいから1400pxぐらいが良いのではと思います。

はてな

2カラムの表示(サイドバーが右か左にある設定)の場合は1200pxで十分なのですが、私は1カラムでページを表示する場合を考慮して最大幅1400px、最大の高さ800にしています。

 

step
2
メディアライブラリへ直接アップロードされた画像

ここでは【メディアライブラリ】画面でアップロードした画像の数値設定になります。

ここでも上の【固定ページ/投稿でアップロードされた画像】と同じ設定で大丈夫です。

 

step
3
その他の方法でアップロードされた画像(テーマヘッダー、背景、ロゴ)

ここではヘッダー画像やロゴ、背景画像などの最大サイズを指定します。

 

テーマによって推奨されるロゴやヘッダーサイズなどがちがうのでそれぞれに応じた数値を入力してください。

 

step
4
JPG画像品質

サイトに取り込みたいJPG画像の品質を設定します。

数値が高ければ高品質、低ければ粗い、低品質の画像になります。

メモ

デフォルトでは「82」と設定されています。

 

step
5
BMP形式をJPG形式へ変換する

ここではBMP 形式からJPG形式に変換するかどうかを設定します。

デフォルトでは「はい」になっていると思いますが、そのままで大丈夫です。

 

BMP形式って何?

BMPはビットマップ形式の略だそうです。

縮小した際に色が失われる傾向が有るのが特徴の画像形式なので、ブログやアフィリエイトサイトなどには必要無いと思います。

私は通常JPG形式で画像をアップロードしています。

 

step
6
PNG形式をJPG形式へ変換する

PNG形式をJPG形式に変換するかどうかを設定します。

ここもデフォルトでは「はい」が選択されていますのでそのままで大丈夫です。

 

PNGとJPGはどうちがうの?

画像の形式で良く見かける「PNG」と「JPG」この違いはなんだかよく分からない人多いと思います。

私もその一人です。

基本的にはJPGの方が画質を保ったままファイルサイズを小さく出来るので、PNGよりもJPGを選ぶ様にした方が良いみたいです。

また、PNGは古いブラウザーでは表示されなかったりする場合があるようですので、この事からもjPGを選ぶようにした方が良い理由ですね。

 

step
7
Deep Scan

通常ココはチェックをいれないで大丈夫です。

【Deep Scan】はなんのことか良く分らなかったので調べてみると、どうやらワードプレス内にある画像全体をスキャンした際になんども同じ画像をなぞってしまう場合が有る様です。

この現象が起きたときにだけチェックを入れるとの事。

こだま
私は結構長い事Imsasnityを使っていますが、一度もこの機能のお世話になった事はありません。

 

step
8
変更を保存

設定が完了したらひとまず「変更を保存」をクリックします。

まだこの段階では画像は圧縮されていません。

 

imsanityの使い方

注意ポイント

画像の圧縮を開始する前には必ずバックアップを取ってから行うようにしてください。

「imsanity」では、設定されたサイズよりも小さい画像は圧縮はせずそのままになります。

圧縮された画像は元に戻らない事と、オリジナル画像は削除されてしまうのでそこも踏まえた上で使う様にしてください。

 

次に実際に画像を圧縮していきます。

画像圧縮

 

【画像を検索】ボタンをクリックすると、今回の私のブログの場合4つ検索されました。

最後に【選択した画像のサイズを変更する】ボタンをクリックして圧縮完了です。

imsanityの使い方

 

imsanityの良いところ

woman

設定した数値よりも画像が小さい場合は圧縮されません。

imsanityは、上で設定したサイズよりも小さい画像を取り込んだ際には圧縮されず何も変更されません。

 

imsanityの圧縮はタテヨコの比率を維持してくれます。

【imsanity】は圧縮の際にタテヨコの比率を維持してくれますので圧縮した際に比率がおかしくなる事がないので使いやすいです。

 

まとめ

最後に

imsanity自体の設定や使い方はとても簡単だったと思います。woman

 

ただ、扱う画像の種類などがいろいろあってややこしいと思ったかもしれません。

そんな時は【基本的にブログやサイト運営ではJPG形式を使う】ぐらい大雑把に覚えておけば大丈夫だと思います。

 

それから、画像の圧縮率を高めて設定してしまうと画像がギザギザになってしまったり粗さが目立つ画像になってしまうので、一度設定したら一つ画像を取り込んでみて設定を確認する様にしてください。

 

 

この記事が気に入ったら
いいね ! しよう

Twitter で

アフィンガーwingの紹介タグ

このサイトでは【AFFINGER 5 WING 】を使っています。

2018年3月下旬に【アフィンガー5 WING】が発売されました。

強力な機能追加もそうですけど、【とてもやわらかい印象のデザイン】から、【カチッとしたビジネスっぽいデザイン】まで、幅広く設定できるのが好感が持てます。

 

WING(affinger5)を使ってみて

実際に使ってみた感じでは、ボタンデザインやランキングデザインがかなり洗練された見た目にアップデートされて、かなり今風になってます。

それから最新版ではカルーセルスライダー(横向きに画像が動くスライダー)機能が追加されてかなり使い勝手がアップしています!

また、ありとらゆる文字や画像、アイコンなどをアニメーション機能でかんたんに動かす事ができるようになったのがスゴいと思います。

こだま
アニメーション機能は投稿画面でサッと選ぶ事が出来ます。 プラグインも必要ないのがうれしいです。

【AFFINGER5 WING】のおすすめポイント

  1. 美しくかんたんになったデザイン!いろんなサイトに使いやすい
  2. やっぱり速い表示速度!
  3. 便利なスマホ用スライドメニュー
  4. 記事作成パーツがアップデート(投稿画面から簡単挿入)
  5. 【カテゴリー一覧ショートコード】でトップページが作り込める
  6. ランキングラベルも作れる【記事一覧ショートコード】
  7. カルーセルスライダーも搭載!記事の好きな場所に設置可能
  8. 色々なボタンを簡単に設置可能
  9. 吹き出しのアイコンがピョコピョコ動く
  10. 一回購入で複数のサイトに使用可能だからお得
  11. アニメーションが簡単!アイコンや文字など投稿画面からかんたん設定可能です。

【AFINGER WING】はインフォトップというサービスを仲介しての購入になります。

このサイトからの特典も付属しますので、以下の注意点をしっかり確認した上で購入する様にしてください。

こだま
インフォトップの決済ページでは”外注化マニュアルキットNEO”が 表示されていることを必ずご確認ください。

左のボタンにチェックが入っている事も忘れずに確認してください。

 

表示がない場合はレビュー報酬&特典は受け取ることが出来ませんのでご注意ください。

※クッキーが有効になっていないと”外注化マニュアルキットNEO”は表示されませんので、 クッキーをチェックしてください。

当サイトの特典について

当サイトから【AFFINGER5 WING】を購入すると、【外注化マニュアルキットNEO】が特典が貰えます。

 

今付属の特典【外注化マニュアルキットNEO】は、アフィリエイターの為の記事外注化マニュアルになります。

どうやって記事を外注すれば効率化できるのか知っておきたいポイントがまとめられている、とてもわかりやすい教材です。

記事作成を加速させる為には必要不可欠の情報が満載ですのでこの機会にどうぞ♪

【AFFINGER5 WING】 単品での購入はコチラ⇩ 1万4800円

当サイト限定特典付き

WING AFFINGER5 特典付きはコチラ

※外注化マニュアルキットNEO付き

AFFINGER PACK3(WING対応) 3万9800円

【Affingert wing】本体と【タグマネージャー3】、【ABテストプラグイン】のセットです。)

当サイト限定特典付き

AFFINGER PACK3(WING) 特典付きはコチラ

※外注化マニュアルキットNEO付き

こだま
【PACK3】はAFFINGER WING本体と、タグ管理マネージャー、それからクリック率の比較などに便利なABテストプラグインのセットです。

3つを別々に買うと5万1400円もする所、3万9800円と1万円以上も安いのがポイントです。

ただ、値段が高い事と、後で必要があれば買い足していける事を考えると、始めはAFINGER WING単品購入でも良いかと思います。

 

  • この記事を書いた人
  • 最新記事

こだま

アフィリエイトは2013年ぐらいから始めて、ワードプレスは知識ゼロで2015年ぐらいから使い始めました。 このブログではワードプレスのテーマやプラグインの機能などを比較しながら初心者にも分るように紹介していきます。 『簡単に出来る』ワードプレスやアフィリエイトの情報発信をを心がけています♪

-imsanity, プラグイン
-,

Copyright© ワードプレス探検隊 , 2019 All Rights Reserved.