Wordpress

WordPressにアップロードすると画質が荒いのはなぜ?

投稿日:2019-01-15 更新日:

ここ数日間、すごく頭を悩ませていました。

アイキャッチ画像が綺麗に作れない

作成した画像をいざWordpressにアップロードすると、画質が荒くなってどうしよう( ゚Д゚)

無料で素敵な画像を作れるサイト「Canva」で作成したのに・・

https://www.canva.com/

アイキャッチを作成して、アップロードしたらこうなる( ゚Д゚)

画質荒くなるじゃん!どうしよう!色もかわってるし・・

上に貼ったようなイラスト系の画像はまだよく、写真だと粗が目立って何の絵かすら不明になってしまう。

アイキャッチ画像は記事の顔!どうしても綺麗に載せたい。。

アップロードすると画質が荒くなる原因

WordPressのメディア設定を見直す

適切なサイズ設定にしているか。

画像圧縮をしているか

アップロードする前に画像圧縮をしているか。

どちらもOKだったのでこれらは原因ではない。

他の原因を探ってみた

そう思う私は、これを解決すべく私は以下のことを試してみた。

  • 画像を作成するサイズを変更してみた。大きな画像や小さな画像、サイズを変えて様々に作成してはアップロードした。→結果、同じ。
  • 画像作成するサイトを変更してみた。いくつかのサイト、Windowsのペイントツールなど手当たり次第、画像を作成してはアップロードした。→結果、同じ。
  • 写真は画質の粗さが目立つと思い、イラスト系かつ単色で原色を使用して画像を作成。アップロードしてみた。→結果、同じ。
  • WordPressにアップロード済の「ライブラリ」から不要な画像を削除して容量を空けた。→結果、同じ。
  • WordPress「ライブラリ」の「一括最適化」を実行。→結果、同じ。
  • Cocoonでアイキャッチ画像に最適なサイズはどのくらいか調べた。→テーマのサムネイルをRetinaディスプレイ対応モードにしているので1280×1280推奨。→結果、同じ。

・・・諦めかけたその時、ひらめいた。

作成した画像の保存形式は適切かどうか

画像作成して保存するとき、「jpg」「png」のとこ選ぶんじゃない?

クリックで拡大

私はいつも気にせず、連打クリックしていたのでjpgで保存していました。

イラスト系はpngで保存しないと(;'∀')

それをパンダ圧縮にかけたとき、圧縮率はわずか1〇%

おかしい。ちゃんとpngを圧縮すればガッツリ80%くらいは圧縮されるはず。。

pngで圧縮したとき。
ガッツリ圧縮されている。

pngで保存してWordpressにアップロードしてみると、今度はちゃんとできました。

画質、キレイ!(アイキャッチに使用しているものです)

おー、解決してよかった。初歩的なミスでした。(;^ω^)

 

アップロードの設定が極端に小さい数値になっていないか

 

後日ですが、また画質悪くなり、いろいろ見ていたらあることに気が付きました。

そもそもアップロードで失敗してるんじゃないか?・・

設定の数値をいじったら改善されて、普通にきれいな画像でアップロードできるようになったのでメモしておきます。

ワードプレス管理画面から、ダッシュボード→メディア

 

メディア設定で画像の数値を最大にする。

 

※ 自己流なので確かなことはいえません。(;'∀')

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

柚子胡椒

30代 独身 フリーランスという働き方に憧れている。生活の「?」や経験を共有します。知識教養を学ぶべく勉強しています。趣味は挑戦すること(`・ω・´)

-Wordpress

Copyright© ion , 2019 All Rights Reserved.