Webサイトに使用される画像サイズが巨大化しているのをご存じですか？
最近のスマートフォンカメラの画素数は、1200万画素超えも普通になってきました。1200万画素、どれくらいのサイズかといいますと、A4サイズの紙に350dpiで印刷できるレベルなのです。
このdpiは、ドットパーインチといって1インチにどれくらいのトッド（印刷粒子）があるのか？という単位です。高精細な印刷（写真集とか画質を必要とするカード類）の場合は、600dpiとかになります。
ちなみに、スマートフォンでは、ppi（ポイントバーインチ）という単位が使用されていて、iPhoneXやXSでは458ppi、iPad Airやir2は、264ppi、です。ちなみに、PCモニタは92ppiで、MacBookProは221ppi、だそうです。（詳細は検索してみてください）
つまり、印刷クオリティ以上にスマートフォン画面のクオリティが高くなり、それにあわせてスマートフォンカメラの画素数も向上している。
今回は、Webページでの画像サイズの最適化なので、Webサイトで必要とされる画像の条件から、よりデータ量が軽く、閲覧するデバイスにマッチした画像解像度で表示される必要がある。これらの点から最適な画像サイズについてまとめてみた。
Webサイトの軽量化とその効果については、こちらを参考にしてください。
wiki：dpiより抜粋
dpi（ディーピーアイ、DPIとも表記）とは、dots per inchの略で、ドット密度の単位である。1インチ（1平方インチではない）の幅の中にどれだけのドットを表現できるかを表す。なお、dpiで表したドット密度の数値を、単にdpiと呼ぶことがある。
プリンターや走査（スキャン）の性能表示として用いられる。また、プリントサイズと対にすることでコンピュータ上で用いる画像データの精度を表す単位としても用いられる。ピクセル数を表すppi（pixels per inch）と区別して用いられる。
wiki：ppiより抜粋
ppi（ピーピーアイ）とは、pixels per inchの略で、ディスプレイやビットマップ画像における解像度を示す単位である。別名画素密度 (pixel density) とも呼ばれる。
解像度とは、すなわち、画像を表現する格子の細かさであり、一般に1インチあたりのピクセルの数を表す（1平方インチあたりではない）。ppiで表したピクセル密度のことを単にppiと呼ぶことがある。
スクリーン線数の単位lpi (lines per inch) や、ドット密度の単位dpi (dots per inch) とは、次元は同じだが表す量が異なるので、単純に換算はできない。
通常、印刷に対し使う。印刷では1つのピクセルを多数のドットで表すので、dpiはppiより大きくなる（典型的には16倍など）。 ディスプレイでは、多くの場合、ピクセルとドットが1対1で対応するので、ppiはdpiに等しい。そのため、ppiとdpiは同じ意味で使われる。
これらから「ppiはdpiに等しい」「同じ意味で使われる」とのことなので、これを前提に進める。
モニタの画素密度は、
https://memorva.jp/internet/pc/display_ppi_list_4k_8k_fhd_hd.php
この「MEMORVA/ディスプレイの画素密度（ppi）一覧表、4K、8K、FHD」によれば、フルHD（1920ピクセル×1080ピクセル）で24インチモニタの画素密度は92ppi。4K（3840ピクセル×2160ピクセル）だと倍の184ppiとなる。
【参考】スマホ・タブレットの画素密度
iPhoneX：5.8インチ、1125×2436、458ppi。
iPhoneXS Max：6.5インチ、1242×2688、458ppi。
12.9インチiPad Pro：12.9 インチ、2048×2732、264ppi。
iPad mini4：7.9 インチ、1536×2048、326ppi。
Xperia XZ3：約6インチ、1440×2880、537ppi。
Retinaディスプレイ（英語：Retina Display）は、アップル製品のうち、100〜160ppi程度であった従来のディスプレイ解像度の、およそ倍の解像度、高画素密度のディスプレイを指す名称である。「Retina」（レティナ）は英語で「網膜」という意味で、画素が細かく人間の目で識別できる限界を超えている[1]、ということから命名された。
（WebサイトをPCで閲覧する。日経、Yahoo!のサイトのワイドサイズ）
（スマホはフル画面で閲覧）
スマホは縦（縦長）で閲覧を前提とする。つまり、スマホを横（横長）での閲覧は加味しなくても良いかも知れない。
となると、必用なワイドサイズの算出方法は、
PC閲覧時：XXXピクセル
Android：XXXピクセル
iPhone：XXXピクセル（ただしretinaなので実際にはXXXピクセル）
iPad：xxxピクセル（※同上）
（画像リサイズの方法）
画像リサイズフリーソフトIrfanView（しかもパッチ処理可能）※バッチ処理とは自動処理の事。
https://www.pasocoop.jp/single-post/20180129
