虫眼鏡_1

noteでのpngとjpegの扱いの違い(2019年版)

(約 1,900文字の記事です。)

noteにアップする画像形式はpngがいいのかjpegがいいのか比較していたら面白いことが分かりました。ただしこれは2019年現在の話であって、将来的にはnote側が仕様を変更する可能性があります。

*pngの扱いについて

pngはアップロードしてもファイル容量が変化しない。だが表示される画像サイズは620pxに制限されている。どういうこと?単にオリジナル画像を620pxで表示させているだけでは?

と思って右クリックからDLしてみて、バイナリファイルで比較してみたところ、オリジナルのpng画像とDLした画像とは「画像部分は完全一致」しました。違いが出たところはファイル内のフッタ相当エリアの「作成日時」を格納する領域のバイナリ値が変わった程度で、10バイトしか違わなかったのです。作成日時情報を示す10カ所しかバイナリ値で違いがなかったわけですね。

なので、pngについてはオリジナル画質のままでサーバにアップロードされていることになります。ですがwebページ上での見え方は620pxに縮小されています。これは後述のjpegでも同様で、620pxに縮小表示されています。


次、jpegです。

*今のnoteはjpegの容量を再圧縮している模様

jpegはサーバにアップロードされた後に更にサーバ側で再圧縮がかかっている。アップロードしたjpegのファイル容量よりもアップロード後にリロードして表示されるjpeg情報ではその容量が更に縮んでいる。右クリックでDLしてみても、やはり小さいファイルサイズに仕上がっている。

noteは以前画像ファイルの表示の高速化を行ったとアナウンスしていることからそのチューニングの結果だろうと予測。目に見えてひどい劣化はなく、オリジナルpngと比較してもそれほどひどいとは思わなかった。よく縮んでいると感心する。なので普通に使えばいいと思う。

なので、ここまでの結論としては、

pngはオリジナル画質が保存される代わりにファイル容量もオリジナルのまま

対して

jpegは見た目がほぼそのままで更に圧縮されて表示レスポンスが改善されている。

こんな違いとなった。

ここからは私の感想というか検討。

*jpegの最高画質で圧縮してもpngの半分になる

jpegには品質の設定項目があり、標準で80、最大で100が設定できる。どの画像系ソフトを使っても必ずある項目だ。で、jpegの品質は100は目で見てpngと見分けが付かない。よほど拡大してあら探ししようとしない限りは。で、品質100でもpngの容量の半分にはなる。品質95程度で4分の1程度になる。もちろん画像の内容によってはもっと縮む

画像の表示サイズが620pxに縮小されることを考慮すれば、オリジナルpngをDLで取り出したいことを除けば、どう考えてもjpegの方が便利だ。しかもpngはバイナリレベルでは10バイト違うため、厳密なオリジナルとは言えないし、note側での将来的な仕様変更も有り得る。となると、pngを敢えてアップロードするメリットは見当たらない気がする。アップロードもダウンロードも重いだけでメリットがない。

もし画質にこだわるとしても品質100~95のjpegでいい。かなりの高品質でも品質95程度。見えればいい程度なら標準の80~90で試せばいい。それだけで見る側の通信量が半分~4分の1ほど減らせるのだから、やっぱりjpegでよくね?と思ったのである。

スマホに優しいページにもなる。例えWi-Fi接続だとしても、読み込みが早くて誰も困らない。サーバ容量が節約できてnote側も嬉しい。クリエーターのHDDが埋まりにくくて管理しやすい。いいことずくめ(笑)

高画質をアップロードしたければpixivなどのSNSサービスのURLをポンと貼ればそれで十分。

というわけで、少なくともnoteユーザーの皆様は積極的にjpeg画像を使いましょう(笑)

……今まで結構な枚数のpngが上がっているけれど、それはそれでよし。別にpngが非推奨とか書いてないし、ブロードバンド環境で使っている分には、今の今まで画像の重さなんて感じたことも考えたこともなかったし(笑)ただ、今後はwebページへのアップロードはjpegでいいやと思ったのでした。(ただし完成作品などの気合いの入った特別な一枚は別ですよ。)

つまり、基本的には高品質(95~100)のjpegで何もかもが十分、ということです。

今回の創作活動は約1時間(累積 約1,090時間)
(350回目のnote更新)

読んでくれてありがとう。気長にマイペースに書いてます。この出会いに感謝😊