【WordPress】画像の劣化を改善する

    icon-clock-o読了時間:約4分48秒

WordPressの固定ページや投稿記事に挿入した写真やイラストが
元の画像に比べて妙に画質が悪くなって粗く、見づらくなることがあります。

考えられる主な原因は、
 icon-picture-o 小さな画像をCSSで拡大して表示しているせいでぼやける
 icon-picture-o 借りているサーバーで使用容量の制限がかかって画質が落とされた
 icon-picture-o WordPressのリサイズ機能を使った際に圧縮されてしまった
 icon-picture-o ページ表示速度アップ系のプラグインによって画像容量が制限されている
大体このいずれかだと思います。

私もこのブログを管理していて

 
なんか画質悪くて見づらくなっちゃうなあ…サイズは気を付けてるから、アップロードの時に何かしちゃってるのかなあ…うーん、わからん!

と、ずっと画質の劣化について謎だったのですが、先日その原因が
単純にプラグインの設定によるものだと気づいたので、
同じ状況の方のご参考になりますように書き残しておきます。

画質劣化の原因はプラグイン・Jetpackの設定でした

今回のこのブログの場合でいうと、画質劣化の原因は
Jetpackというプラグインで【 画像のパフォーマンス 】機能を有効にしていたことでした。

どうやらこの項目は
容量が大きな高解像度の画像などを、最適化(圧縮とか?)をした上で、
Jetpackが運営するサーバーに分散して置いて、本来そのサイトがあるサーバーに掛かる
負荷を軽くしてページ表示の速度を上げる
、という機能のようです。
この設定をいじった記憶が無いのでデフォルトで有効になっているのかもしれません。

確かにあまり精密な画像や大きな画像を掲載しないサイトであれば、
ページ表示速度を優先した方が訪問者さんには優しいですね。
しかし私のようにPCの設定方法や操作手順を文字入りの画像で説明したり、
あるいは写真ブロガーさんのように綺麗な解像度の高い写真を掲載している場合には
勝手に画像をぎゅぎゅっと小さくされちゃうと困ります。

というわけで、私と同じく原因不明の画質劣化に困っている方で、
Jetpackを使っていらっしゃる方は、この機能を無効にすれば
改善されるかもしれないので一度お試しください。

【画像のパフォーマンス】の無効化

WordPress管理画面のメニューから、Jetpackのダッシュボード(トップ画面)を開きます。
下の方にスクロールすると 『 パフォーマンス 』 という項目に
【画像のパフォーマンス】の設定箇所があります。
有効になっている(青くなっている)場合は、そこをクリックして無効にしてください。
Jetpack【画像のパフォーマンス】の無効化

また、この【画像のパフォーマンス】と連動している設定項目が
『 設定 』ページの【画像を私たちのサーバーから提供】の項目です。
有効・無効を切り替えるともう片方も自動で設定が変わるので注意してください。
Jetpack【画像を私たちのサーバーから提供】設定

Jetpackのその他の設定

Jetpackは様々な機能を搭載した便利なプラグインですが、
そのWordPressサイトにとって余計な機能をONにしていると
今回のように画質劣化が発生したり、ページ表示速度が遅くなったりといった
デメリットがあるかもしれません。
Jetpackをお使いの方は、今一度ご自分のJetpackの設定内容を見直してみてくださいね。
 icon-lightbulb-o 【プラグイン】 Jetpack by WordPress.comの使い方

また、Jetpackを含め、プラグインの使わない機能はOFFにして、
それでも画像やページの表示速度が遅くて気になる場合は
キャッシュ制御のプラグインや画像表示制御のプラグインの導入を検討してください。
 icon-lightbulb-o 【プラグイン】 キャッシュ制御 WP Fastest Cacheの設定と使い方
 icon-lightbulb-o 画像表示制御して表示速度アップ Unveil Lazy Load

 良かったら押してみてください♥

  • このエントリーをはてなブックマークに追加
  • Pocket