【SWELL】吹き出しに最適な画像サイズを調査、検証してみた

今回は、「SWELLの吹き出しに最適な画像サイズ」について調査、実際に画像をアップロードして検証したので紹介します。

結論から言うと、画質と容量のバランスがいい「160px〜200px」がおすすめです。

諸説あるので、一例として参考にして頂ければ幸いです。

メモ的な記事内容になっていますので、ご了承お願い致します。

吹き出しに最適な画像サイズ

SWELLの公式サイトで吹き出しの画像サイズについて調べたところ、特に記載がありませんでした。

参照：管理も簡単！SWELLのふきだし機能の使い方 | WordPressテーマ SWELL

吹き出しの最適な画像サイズを調査

そこで、SWELLに関係なく「吹き出し、画像サイズ」で検索、上位サイトの見解を調べました。

160px〜200pxがなぜおすすめされていたかと言うと、「CocoonというWordPressテーマの製作者わいひらさんのサイトで推奨されているから」のようです。

実際に検証していたサイトによると、75pxくらいで問題なく、50px以下だと画質が荒く感じるとのこと。

最近のSEOはサイトスピードをかなり重要視しているので、吹き出しの画像サイズはできるだけ小さくしたいところです。

実際に検証

実際に吹き出しの画像を検証していきます。

すでに吹き出し用のアイコン画像がある場合、WordPressのメディアライブラリで画像の縮尺を変更できます。

実際にやってみると、、、

早速ぼやける原因を調べます。以下のサイトを参考にしました。

参照：Webサイトの画像ぼやけていませんか?綺麗な画像の表示方法 | カンデザWeb
　　　 品質を落とさずに画像サイズを小さくする方法 – Shutterstock Blog 日本語

試しにMacの標準ツール（プレビュー）で画像サイズを縮小してみます。
※画像をリサイズするツールは色々あります。

Macの「プレビュー」でイメージをサイズ変更する/回転する/反転する – Apple サポート

カスタムだと320×320が選べる一番小さいサイズでした。

幅と高さを1：１にして更にリサイズ。

幅と高さを0.5：0.5にして更にリサイズ。

結局、SWELLで吹き出しの画像サイズはどれがおすすめ？

結局、吹き出しの画像サイズはどれがおすすめか？

サイトスピードを重視するなら75pxもありですが、バランスがいい「160px〜200px」がおすすめです。

320px	PCでも非常にくっきりして綺麗。
160px〜200px	画質も綺麗。PCでも違和感なし。拡大すると荒さが目立つ。
75px	画質が悪い。

吹き出しのイラストは依頼できる

このアイコンはココナラで「ふちさん」という絵師の方に依頼しました。

いらすとやなど無料で使える吹き出しの画像もありますが、オリジナルのアイコンがあるとブログを書くモチベーションも上がります。

＼ ココナラ ／