前節で、開閉パネルやタブ切り替えを例に、狭い画面の中でどのように情報を整理するかを解説しました。モバイルにおけるWebコンテンツの見せ方は、紙1枚1枚を縦や横に並べるのではなく、紙を重ね剖というように考えてください。
これは、ちょうど本にたとえることができます。l枚の広告チラシのようにWebページを表現するのではなく、重ね合わせた紙、つまり本として表現します。そして、そこにわかりやすい「目次」や「ふせん」をつけるのです。そうすることで、本を閉じた状態(初期状態)で中身が確認できなくても、すぐさま目的の情報へとたどり着くことができます。これが、プラスボタンやアコーデイオンの開閉ボタン、タブ切り替えにあたります。
まとめると、重要なのは、情報は同じにするが、その見ぜ方?をけを変瓦扇ということです。PCの情報やコンテンツをそのままモバイルに移し替えると、小さくなった枠の中に詰め込んでいる状態になることから、場合によっては見づらいものになってしまいます。重要なのは、モバイルの画面に合うように再構築することです。また、得たいと思う情報について、そのルートが仮に異なったとしても、必ず目的地へたどり着けるようにすることも大切です。
関連記事を読む
レスポンシブウェブデザイン
画像について
Webサイト運営者としてのモバイルファーストを考える