Webサイトの「デザインのみ(コーディング不要)」を依頼されました。 「レスポンシブデザイン」を希望

Webサイトの「デザインのみ(コーディング不要)」を依頼されました。
「レスポンシブデザイン」を希望された場合、PC版とスマホ版の両方のレイアウトを作成すればよいのでしょうか？

コーダーさんとのコミュニケーションは取れないという状況です。

No.4 回答者： fujillin 回答日時： 2024/12/25 16:24

こんにちは

単なる固定デザインのレイアウトだけなら、主要なものとしてＰＣ用とスマホ用を作成すれば済むと思います。
ただし、画面サイズは様々ですので、レスポンシブの場合は「何を基準にしてどのようにサイズを決めるのか」の説明は必要でしょうね。
（全て固定値という方法もあるのかも知れませんけれど・・）

多少なりとも動きのあるものだと、その部分に関する補足の資料が必要になるでしょう。
例えば、プルダウンやドロワーのメニューとか、もっと複雑だとパララックスとか・・
あるいは、アニメーション的なものなどでしょうか。

この回答へのお礼

詳しく教えていただきありがとうございます。
とても勉強になりました。

お礼日時：2024/12/25 22:36

No.3 回答者： rera1016 回答日時： 2024/12/25 16:14

デザインのみの依頼であれば、少なくともパソコン用とスマホ用で全く別のレイアウト、見た目にはせず、それぞれの画面幅を考慮して、構造を組み替えて表示できることを想定したものにしましょう。

レスポンシブデザインの基本は、パーツ自体は一緒で、画面の幅に対してパーツ配置を組み替えて構成するのが基本です。
https://business.kuronekoyamato.co.jp/promotion/ …

この回答へのお礼

参考サイトまでありがとうございます。
とても参考になりました！

お礼日時：2024/12/25 22:37

No.2 回答者： EFA15EL 回答日時： 2024/12/25 16:14

>PC版とスマホ版の両方のレイアウトを作成すればよいのでしょうか？

それは最低限必要でしょうね。
あとはブレイクポイントやマージン設定やテキストの流し方など細かな指示ですね。

この回答へのお礼

ブレイクポイントにマージン設定、テキストの流し込み…

調べて勉強して対応します。
どうもありがとうございます。

お礼日時：2024/12/25 22:39

No.1 回答者： rera1016 回答日時： 2024/12/25 15:01

レスポンシブデザインで検索すれば、方法はいくらでも見られますよ。

基本的には、ページの幅にあわせてレイアウトを変更するよう、スタイルシートで切り替えます。

そのため、パソコン用、スマホ用とも共通のHTMLとCSSで作り込みます。

この回答へのお礼

ご返信ありがとうございます。
当方、コーディングの知識が低く、Illustratorペライチのデザインのみしか受注したことがなく、レスポンシブデザインについて検索してみたのですが、おそらくコーダー様側で調整するのだろうという所までは理解できたのですが、デザインする側として何をすればよいかが分かりませんでした…
PC版とスマホ版のサイズのデザインを作れば、あとはコーダー様がレスポンシブ対応してくれる、ということになりますでしょうか？
クライアントからは、コーディングは社内でやるので不要でデザインのみ作ってくれればよいと言われています。

お礼日時：2024/12/25 15:11