-
1:ID:aZLjpL · 2018-12-15

webデザイナーの方へ質問です。(初心者です)初めてLPを制作します。
キービジュアルと、一部の画像やコンテンツのブロックを、フルードイメージで画面横幅100%にするデザインを制作したいのですが、レイアウトPSDは、横幅何ピクセルで作成すれば良いのでしょうか?
(実際はCSSで可変させますが、書き出す際の画像のナチュラルサイズを知りたいです。)
よろしくお願いいたします。

21 件の回答

2:ID:z6PahH · 2018-12-15

1000pxぐらいで作って、書き出すときだけ、2倍で書き出したりしたらいいかなと思います

3:ID:LQd62z · 2018-12-16

初心者にしてはずいぶん専門用語つかうのねw

4:ID: · 2018-12-16

Re:3
ありがとうございます。どんな言葉で質問したらいいのかも分からなくて、すっごい調べました!もしも意味合いが間違っていたらすみませんでした。

5:ID: · 2018-12-16

Re:2
なるほどです!こちらで検索したところ、2年少し前に同じような質問があり2000pxと回答が多かったのですが、今も変わっていないという事ですね・・・?
2倍書き出し!!そんな技があるのですね。やり方調べてみます!ちなみに、2倍の大きさで書き出すと画質が悪くなるのでは?と思うのですが、そうはならないのでしょうか??

6:ID:fcxKpR · 2018-12-16

PCは1400px、スマホは750pxでデザインカンプを作ればいいよ。これが現状の無難なトレンド

7:ID: · 2018-12-16

Re:6
PCは1400pxが今はちょうどいいんですね。横幅100%にすると1400よりも広くなる場合もあると思いますが1400pxでの書き出しでOKでしょうか? それともその画像だけ2倍で書き出ししますか?

トレンドもありますし、最初に回答してくださった方のやり方も然りで、多分いろんな方法があってこれが正解!て、ないのかもしれないですが・・・。自分で調べても迷うばかりでして質問ばかりで申し訳ありませんがよろしくお願いいたします。

8:ID:0ZceJV · 2018-12-16

素材の解像度にもよるし、素材イメージにもよるよ、
パキッとした画像は高解像度にするし、
ぽわーんとした画像は低解像度にするし、
ざらざらした画像はJPEGの圧縮率下げたりもする。

9:ID:BX2K5X · 2018-12-17

横2000pxというのは
画像をフルスクリーン背景に配置したとき
これくらいあれば汚くならないというサイズ
これは現時点でのユーザーのモニター解像度のシェアに依存してるサイズなので
例えば日本だと1920x1080が圧倒的に多いので
フルスクリーンの横2000pxあればという数字はここから来てるんだと思う

1400pxってのはクライアントに提出するデザインのサイズ
ユーザーが最も表示する可能性が高いサイズという意味合いが強いと思う
フルードイメージの場合は書き出しはもちろん別になる

10:ID:fcxKpR · 2018-12-17

Re:7
必要に応じて150-200%なり、書き出しすればええんや。素材は高解像度やベクターなりスマートオブジェクトで作っとけよ

11:ID: · 2018-12-17

Re:10
理解しました。ありがとうございます!勉強になりました。

12:ID: · 2018-12-17

Re:8
画像素材によってそうゆうのは適宜調整するんですね。プロ仕事の流儀ですね。もっと柔軟に考えます。ありがとうございます!

13:ID: · 2018-12-17

Re:9
なるほどです、そういう事なんですね。まとめて頂いて、とても理解できました。ありがとうございます。
1400でデザイン制作してお出しして、実際フルスクリーンにする画像は拡大書き出しする、で、やってみようと思います。

14:ID:LQd62z · 2018-12-17

言葉のアヤかもしれないけど、なんか違う気がしたので。
元画像(PSD)は、書き出し後の解像度より大きい必要があるのであって、書き出し時に拡大するなんてのはありえないというか意味がない。
それと、一般的にみんなどうしてるのかを知りたかっただけなのかもしれないけれど、実際は画像によって最適な(圧縮値)は変わってくるので、自分の目で見て決めるしかないぞ。コテコテのLPだと文字入り画像もたくさんあるだろうけど、文字が入った瞬間、高解像度が必要になるのは、結果を見ればすぐにわかる。デザイナーなら自分の感性を頼りなさい。

15:ID:uNPel0 · 2018-12-17

レティーナ対応させようと思ったら5120pxとかあるしキリがないよねー
自分は最近は幅2200pxのjpgで画質調整して500KB〜1MB以内になるようにする感じが多いかな

17:ID: · 2018-12-18

Re:14
解像度大きいまま貼り付けて、そのレイヤーをスマートオブジェクトに変換してpsbにしてから、デザインに合わせて縮小して配置して、100%でフィットさせたい画像は書き出しの時に拡大すれば、画質落ちないのだろうと理解しました。(あってますか・・・?)

アドバイスありがとうございます。おっしゃる通りで、自分のやり方が正しいのか自信がないので、現場で活躍されている方が一般的にどうしているのか知りたかったのです。
けど、結局はできたものを確認して、調整して・・・の経験の積み重ねが必要ですね。感度高めてがんばります!

18:ID: · 2018-12-18

Re:15
レティーナまで配慮しておりませんので・・・今回は・・・
となると、たしかに幅2200pxあれば無難に広めにカバーできそうです。最近はjpgなら画質100%でOKって習いましたが、やはり1MB以内には抑えないとってところなんですね。サイズ確認するようにします!ありがとうございます。

19:ID:LQd62z · 2018-12-18

Re:17
スマートオブジェクト使うかどうかは好みの問題だけど、個人的には、最初から想定される最大解像度でつくった方が楽だと思うが。スマートオブジェクトはPSDのファイルサイズがやたら大きくなるから好きじゃないってのもある。

20:ID:zrgAiJ · 2018-12-18

Re:18
500kgでもくそ思いよ。。。
Retina対応させるならsrcsetさせなきゃ。

21:ID: · 2018-12-18

Re:19
そうですね、重たくなりますね。この後、コーダーの方にデータをお渡しするのがなんとなく申し訳ない感じがします・・・。最初から最大解像度で、というのもやり方の一つですね!色々やってみながら最適化していきます!ありがとうございますー

22:ID: · 2018-12-18

お悩み解決しましたのでクローズします。
親切にご回答いただき、ありがとうございました。またよろしくお願いします!

1 件の回答が除外されました。[詳細]
コメントの受付は終了しました。

一緒に読まれている質問

ページ上部に戻る