とても根本的な部分になるのだと思いますが、理解ができないのでアドバイスをお願いいたします。
色々と調べたのですが、小手先の技術的なノウハウは色々と情報があるのですが、恐らく基本的な根本的な部分が理解できていないので、いつもつまづいてしまい時間と精神的にすり減ってしまいます…。
レスポンシブのWEBページの作成ですが、ページのサイズの可変によってデザインを変更していくという部分は理解していますが、これらは何を基準にするのでしょうか?
といいますか、何らかの基準を設けてでなければ無理ですよね?
例えば、画面幅0px から最大は無限大とかって無理ですよね?
そうなると、やはりある程度の部分で最小値と最大値の設定は必要になりますか?
※でも、360pxくらいから1980pxくらいまで拡大縮小しても、一切のデザインが崩れないようなデザイン方法があればとても理想です、それぞレスポンシブといった感が私には御座います。
特に最大値については、無限大は無理だと思うので設定するのは基本でしょうか?
つまり、MAX1400pxとかを設定したとしたら、そこから上は、無視する。つまりそれ以上はレスポンシブへの対応は行わないといった認識でよいのでしょうか?
最小値も同じように、指定した最小値より下は無視、つまり最低に設定した幅でデザインが確保できていればOKという感じなのでしょうか?
この辺りの理解が乏しく、いまいち決定的レスポンシブというものが何なのか把握できておりません。
レスポンシブの基本的な概念が理解できるアドバイス、またそのようなサイトなどご存知のかいらっしゃいましたら、意味が分かりにくい質問で恐縮ではありますがご教授いただけますと幸いです。
A 回答 (3件)
- 最新から表示
- 回答順に表示
No.3
- 回答日時:
> レスポンシブのWEBページの作成ですが、ページのサイズの可変によってデザインを変更していくという部分は理解していますが、これらは何を基準にするのでしょうか?
デバイスの画面やアプリのウィンドウ幅を基準にすることが多いと思います
他には
・印刷用は別にする
・ユーザーがダーク・モードを使用しているか?
なども有ります
> そうなると、やはりある程度の部分で最小値と最大値の設定は必要になりますか?
はい、必要になります
> ※でも、360pxくらいから1980pxくらいまで拡大縮小しても、一切のデザインが崩れないようなデザイン方法があればとても理想です
いえ、幅が狭いときと広いときで使いやすいデザインは違います
例えば PC など画面が横長なら横にメニューや操作アイコンが常に左右どちらかに表示されていると都合が良いケースが多いですが、縦長ではそうではありません
また画面が小さければ、普段はそれらの UI は隠してあったほうが使いやすいでしょう
> 特に最大値については、無限大は無理だと思うので設定するのは基本でしょうか?
基本のデザインを決めておき、
・あるサイズ以下もしくは以上
・特定のサイズに収まる範囲
のデザインを指定することになると思います
こうすれば、上記以外は基本デザインになるので
有難うございます。
私のお伺いした質問に対して、具体的に回答を頂き感謝申し上げます。
やはり最大値と最小値などの、基準値は確実に設けないといけないという事が理解できました。
基準値無しに最大最小それぞれ無限は無理ですよね…。
>>いえ、幅が狭いときと広いときで使いやすいデザインは違います
確かにそうでした、私の書いた基準が無理がありました。
例えば、大きい方をあえて無理やり基準にしてみますが、750px以下はスマホ用、750px以上、2000pxまでが同じように表示できればと思います。
が、書いていて思いましたが、基準値が明確にわかっていれば、その幅に対してそれぞれ計算でできるので、なんとなく理解が深まった気がいたします。
まだもやもやしていますが、少し思考に前進があった気がいたします。
有難うございます!!
No.2
- 回答日時:
>画面幅0px から最大は無限大
使われる端末の種類(スマホ・タブレット・PC)によってある程度、画面解像度は決まっているので、閾値を超えたり、下回ったらブラウザが表示を変更する。
>一切のデザインが崩れない
初期のHTMLの時代から言われ続けているが、それは作り手側の傲慢であり幻想に過ぎない。
デザインというのは如何に情報を見やすく提供するかが目的であり、ドット単位でレイアウトを決めることではない。
No.1
- 回答日時:
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
テーブルセル余白(例えば左側...
-
縦ボーダーの長さ変更方法
-
iframeの機能をcss(divタグ)で...
-
L字みたいな記号の表示
-
ピクチャーボックスの大きさに...
-
iPhoneで HTMLファイルを閲覧
-
シーサーブログのヘッダー画像...
-
JavaScriptで写真をフラッシュ...
-
忍者ツールズはどうすればGooの...
-
デジカメで撮った写真をURLに変...
-
gooブログです。
-
JUGEMで画像のアップが出来なく...
-
paintに貼り付けてある画像の大...
-
ページサイズの目安は?
-
写真の貼り方
-
1ページの複数の記事のうち、最...
-
Dreamweaver (Studio 8)とMovab...
-
エキサイトのブログの
-
ブログのリンクの仕方を教えて...
-
ヤプログの改造
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
テーブルセル余白(例えば左側...
-
borderの太さを1px以下に見せ...
-
レスポンシブWeb 右側の表示が...
-
縦ボーダーの長さ変更方法
-
テキストボックスが選択できない
-
CSSでメニュー横並びの方法
-
box-shadowでFirefoxだと内枠に...
-
HTMLにsvg画像表示したら小さか...
-
ページネーションを右下に配置...
-
webサイトのデザイン方法について
-
PHP内で同じようにCSSを表示さ...
-
googleカスタム検索 ボタンがず...
-
PCとスマホでの解像度でのCSS振...
-
レスポンシブデザインのjQuery...
-
フォント12pxの200%?
-
ホームページ作成後、別のブラ...
-
L字みたいな記号の表示
-
ピクチャーボックスの大きさに...
-
iPhoneで HTMLファイルを閲覧
-
シーサーブログのヘッダー画像...
おすすめ情報