PhotoshopでWeb用保存の解像度は72？

質問

Photoshop　６　を使用しています。
Webサイト制作で使いたい写真をPhotoshopで切抜いて、「Web用に保存」する際の、途中段階で解像度は上げるべきかどうかについての質問です。
今やっている手順としては次の通りです。

(1)　自分で撮った写真をPhotoshopで開く。（解像度を確認すると72pixel/inchと表示されています。）
ピクセル寸法　　　　　　幅　1600　pixel 　　　　　　 高さ　1200 pixel
ドキュメントのサイズ　　幅　　56.44 cm 　　　　　高さ　　42.33 cm
解像度　　　　　72　pxel/inch

(2)　被写体（マグカップなど）の外周に沿って切り抜く。

(3)　(1)と同じ状態の各数値のまま「別名で保存」する　（Photoshop *PSD *PDD 形式で）

(4)　外周をなくす為トリミングする「イメージ」⇒「トリミング」
各データは次のように変わります。
ピクセル寸法　　　　　　　幅　1089　pixel 　　　　　 高さ　966 pixel
ドキュメントのサイズ　　　幅　　38.42　cm 　　　　　 高さ　34.08 cm
解像度　　　　　72　pxel/inch

(5)　つづいて、写真の大きさを実際にWebサイトのページに掲載する大きさに変えます。
　　「イメージ」⇒「解像度」で「縦横比を固定」　「画像の再サンプル」にチェックを入れて
　　「バイキュウービック法」（元からこれになっていた為）を選択して　、　
　　ドキュメントサイズを自分で決めた大きさの幅８ｃｍに指定します。
　　８ｃｍに変えると、各数値は次のように変わりました。
ピクセル寸法　　　　　　　幅　　227　pixel　 　　　　　 高さ　　201 pixel
ドキュメントのサイズ　　　幅　　　8　cm　　　　　　　　　　　高さ　　　7.1 cm
解像度　　　　　72　pxel/inch

(6)　(5)の状態で「Web用に保存」しました。
　　形式はjpegで、きれいに見せたいので最高画質または、値の指定を100にしました。
　　切抜いていますが、GIF形式ではないので透過できない為、「マット」で下地の色と同じ色を指定しました。

現在、このような流れで写真を切抜いて、Web用に保存しています。

【 質　問 】
上記(5)の段階で、「画像の再サンプル」にチェックを入れて、「解像度」の欄を350と入力すると次のようになります。
ピクセル寸法　　　　　　　　幅　1102　pixel 　　　　　 高さ　　978 pixel
ドキュメントのサイズ　　　　幅　8　cm　 　　　　　 高さ　　7.1 cm
解像度　　　　　350　pxel/inch
( 350というのは、紙に印刷する際に350にしていたので72よりもきれいにする為には350かな？と思いこの値を入力しました。)

解像度は 72 pxel/inchのまま、350　pxel/inch　のどちらにするのがよいでしょうか？
一般的にはこう・・・で、例外として・・・場合もある、など、教えてください。
また、これ以外に上記の流れの中で、おかしなやり方をしていたら、ご指摘ください。
よろしくお願いします。

回答No.4

dezimac · ベストアンサー

> pixel寸法の欄にpexelの値を入力して
そうです。

> 実際の長さがわかるという理由
> 必要な写真の大きさを的確につかむ為に
初期のMacintoshではモニタ解像度も72dpiで固定されていて、72ピクセル線を書いてやるときっかり1インチ（2.54cm）になりました。
当時としてはプリンタの解像度を72dpiにすると画面上がサイズも全てそのまま印刷出来て便利。

今のモニタは解像度（dpi）はバラバラで同じ大きさで表示される事はまずありません。
同じ12インチでも800×600のもあれば、1024×768以上のもあります。
1cmとかで作ってもそれは印刷すればそのサイズにはなりますが、画面上ではそうではないです。
画面に定規を当ててみれば分かりますよ。
余程厳密に設定されたブラウザ＆画像の大きさをCSS利用してcmやinchで指定でもしていない限りは、実際のサイズとは程遠い大きさになります。

ブラウザ上では原則 ピクセル寸法で表示されるから、ドキュメントサイズで指定しても意味が無いし、dpiをちょっと変えるだけで表示される大きさも大幅に違ってきます。
ですから、貴方が綺麗だろうと思っていた350dpiで、8×7.1cm（拳程度）の画像を作ると，
ブラウザ画面上では1102×978 pixelと画面いっぱいのサイズになります。
72dpiなら予想していたのに近いかもしれないけど、それでも8×7.1cmにはなりません。

ピクセル寸法で指定した方がより分かりやすいです。
Photoshop等で等倍（100%）表示した時のサイズがそのまま利用される訳ですから。

解像度が指定（固定）されている印刷関係（DTP）であれば、貴方のやり方は正しいですが、Webでは通用しません。
失礼かもしれませんが、Web作っている人は解像度（dpi）？ドキュメント寸法にcm?という人の方が多数で、貴方のようなやり方は稀でしょうね。

↓以下が参考になるかな？
解像度/同人野郎のためのWEBサイトづくり
http://rinrin.saiin.net/~aor/hms/reso

お礼

追加の質問へ返信いただきありがとうございます。
書かれていた事を実際にやってみて、理解できました！
１回目の回答を受けた後はドキュメントのサイズ（cmなど）ではなくpexel寸法（pixel）で入力すべきだと知ることができましたが、画面に表示される時の大きさのイメージをpixelからどうやってつかむのかわかっていませんでした。

8×7.1cmの画像を72dpi, 350dpiそれぞれで作ってみると、72dpiの方はほぼ実際と近い大きさになり、 350dpiの方は画面いっぱいの大きさになってしまい、あらためて解像度、ドキュメントサイズ、画面で見えるサイズの関係を理解しました。
いままであまりにも無頓着でやっていました。
また、決め手は、『ピクセル寸法で指定すれば、Photoshop等で等倍（100%）表示した時のサイズがそのまま利用される。』という言葉でした。
いままで、PhotoshopでCtrl, Alt, スペースのキーで倍率を何気なくカシャカシャ変えて使っていましたが、今何パーセントの表示で見ているのか意識していませんでした。
Photoshopで100％の画面にして、それをWebページを見ている大きさだと意識して、そのままの見た目でPixelを増減させて、良いと思った大きさに決めればそれがネット上でも（同じパソコンのディスプレイなら）おなじ見た目になるという事を理解できました。
「同人野郎のためのWEBサイトづくり」も拝見しましたが、わかり易く、他にもためになる項目があり、とても勉強になります。
このたびは色々とご指導いただき、どうもありがとうございました。

回答No.3

kichi8000

72dpi
これは、以前のmacintosh（マック）で使用されていたモニタの解像度が、モニタサイズにかかわらず、72dpiに固定されていたことによるものです。
現行モニタは解像度が統一されていませんので画像解像度は何でもいい（決められない）ということになります。
「管理がしやすいようにビューアなどの解像度は72dpiだということにしましょう」ということです。

350dpi
これは、紙などの媒体に印刷したときの画素（ピクセル）サイズで、肉眼視限界の一番大きいピクセルサイズが300ppiだったことによるものです。（現場ではスポットサイズやインク滴サイズのdpiではなく、ppi：ピクセルパーインチです。）
WEB表示ではモニタ解像度に依存する表示なので、ダウンサンプルされた表示になってしまいます。

せっかく作った72dpiの画像でも、ページに２倍に拡大して貼り付けるとそれだけで36dpiになりますが、ビューアの補正で72dpiになりボケます。
結局は、どんなものでもモニタに表示されてしまえばすべての表示がモニタ解像度のピクセル（画像画素サイズ＝モニタ画素サイズ）になっているということです。72dpiで貼り付けておけばモニタ画素サイズと一致するので綺麗なのです。

実際には「Web用に保存」とは等倍貼付用の最終成果物ということなので、解像度を高めに作っておき、高機能WEB編集ソフトでの機能で最終的に自動で72dpiにするというのが最善ではあります。

長くなってしまいました。

お礼

(中途半端とも思えた)72dpiという数値が、昔のマッキントッシュのモニタの解像度から由来していて、また、350ppiは印刷物を見たときの肉眼視限界の一番大きいピクセルサイズが300ppiで(それに余裕をもたせた数値で)ある、とのお話、興味深いです。
・　現行モニタは解像度が統一されていない。⇒画像解像度は何でもいい（決められない）
・　管理がしやすいようにビューアなどの解像度は72dpiだということにしましょう、ということになっている。
・　結局は、どんなものでもモニタに表示されてしまえばすべての表示がモニタ解像度のピクセルになっている。

色々と教えていただき、どうもありがとうございました。

回答No.2

dezimac

解像度（dpi）は1インチ（2.54cm）を何個点で表現するかという意味です。
印刷物なら点の密度が高い＝解像度が高い方が綺麗に見えます。
72dpiだと点々が見えますが、300dpi以上だった肉眼ではなかなか区別できません。

Webページ等モニタ上で見るものは、ハッキリ言って解像度を無視して構いません。
350dpiだろうが72dpiだろうがそのピクセル数で表示されるので関係ないです。
極論、1dpiにしても画面上で見る限りは画質は全く変わりません。

webページで利用する画像は72dpiで利用したいピクセル寸法にして下さい。

印刷するなら、300～350dpiでドキュメントサイズを設定。
画像の再サンプル」にチェックを入れて「バイキュービック法」で。
「バイキュービック法」は他よりも演算に時間がかかるけど、ピクセル補完する事でいくらかは綺麗に拡大縮小できます。

補足

とてもわかりやすく解説していただき、ありがとうございます。
72pixel/inchのままやっていくようにします。
特に　『極論、1dpiにしても画面上で見る限りは画質は全く変わりません。』　この原則を頭にいれておきたいと思います。

すみませんが、『72dpiで利用したいピクセル寸法にして下さい』　について教えてください。　これは、ドキュメントサイズを入力するのではなく、pixel寸法の欄にpexelの値を入力して、ドキュメントサイズの幅と高さのcmはそれに伴って自動的に与えられるものを使うということでしょうか？　私はいつも実際の長さがわかるという理由で、ドキュメントサイズの縦横の長さでcmで指定していて、ピクセル寸法はそれに伴って自動的に表示されるままに使っていました。
Webサイトのページに写真を配置した後は、それを拡大縮小しないでその大きさをそのままページ上に使うようにしている為、その必要な写真の大きさを的確につかむ為にやっていました。
すみませんが、ピクセル寸法を指定する、事について私の認識の間違いを教えてください。

回答No.1

kokubosino

７２のままでいい

350dpiにする必要は無い
大きくなってますよ、それでもいいんですか？(^_^;

例外も無い

切り抜きツールのオプションのピクセル寸法を指定しておけば
１→５と一気にできます

お礼

７２pixel/inchで良いのですね。
物の輪郭で切り抜く事が多かったので、ペンツールをよく使っていましたが、「切り抜きツール」で数値を指定して必要な部分を四角形に選ぶ、というのも良い方法ですね。
どうもありがとうございました。