解像度調整
解像度が下記の図1から図4のように異なる4枚の図を width=250 オプションを付けて、同じ大きさで表示しています。図1と図4では16倍のデータ量の違いがあるのに図1の方が16倍も美しい図には見えません。イメー ジを伝えるだけなら図4でも十分ですね。適切な解像度に落として軽いページ造りを心がけましょう。
図1 | 図2 |
図3 | 図4 |
4枚の図は同じように見えますが、解像度(ファイルサイズ)は大きく違います。
図1:1944 × 1296 pixel 約550KB 元ファイル
図2:972 × 648 pixel 約200KB 図2は図1より50%解像度ダウン
図3:486 × 324 pixel 約80KB 図3は図2より50%解像度ダウン
図4:243 × 162 pixel 約40KB 図4は図3より50%解像度ダウン
各図番号をクリックすると原画サイズ(width=100%)で画像が表示されます。無駄に大きな解像度を持つ画像ファイルはディスク容量を圧迫するだけでなく、読者の閲覧にも負担をかけるいわゆる重たいWEBサイトになってしまいます。適切な解像度に縮小した後、アップロードしてください。
ペイントツールによる解像度調整方法
始めにファイルのプロパティより2500.jpgは3888 × 2592 pixel 約2500KBであることを示します。
解像度調整より、「サイズ変更」項目から水平方向・垂直方向の%を修正します。今回は20%に修正
解像度変更後、「名前を付けて保存」もしくは「上書き保存」を実行。
データ量を大幅にサイズダウンすることができました。778 × 510 pixel 約125KB