図の条件と、画面幅による配置の変化から判断すると、用いられている表示の手法はどれか。 画像：本制作用の架空サイト「あおば住まいラボ」の画面・比較図
- 別個のモバイルサイト
- レスポンシブWebデザイン
- タブによる内容の切替
- PC版レイアウトの縮小表示
正解と解説を見る
解答と解説
正解：2. レスポンシブWebデザイン
図では同じURLのページが、広い画面では左右に、狭い画面では上下に内容を配置している。共通のページを画面幅に応じて見やすく配置する、レスポンシブWebデザインの例である。別URLのページへ移る方法とは異なり、一部の内容を選んだタブで見せる方法でもない。狭い画面でも内容が縦に並び直しているため、元の配置を保った単純な縮小とも区別できる。 ほかの選択肢 「別個のモバイルサイト」…別個のモバイルサイトは異なるURLに作る方式だが、図では同じURLのページが示されている。 「タブによる内容の切替」…タブでは選んだ内容を見せ、他の内容を切替操作まで隠す。図は両方の内容を保ったまま幅に合わせて並べ直している。 「PC版レイアウトの縮小表示」…元の左右配置を保って小さくするのではなく、狭い幅では上下に配置し直している。 参考: 公式テキスト1級 第1章 3-2 レスポンシブWebデザイン
このページの閲覧は学習記録に保存されません。記録するには学習画面で回答してください。