WELCOME TO SAVVY

BLOG

  • HOME > 
  • BLOG > 
  • 新たなWEBサイトの潮流?モバイル特化型レスポンシブデザインって?

新たなWEBサイトの潮流?モバイル特化型レスポンシブデザインって?

2022.07.13

WEBサイトデザイン

新たなWEBサイトの潮流?モバイル特化型レスポンシブデザインって?のメインビジュアル

SAVVYではWEBサイトの制作、ことリニューアル案件においては、その多くはアクセス分析をした上で企画設計を行っています。

とりわけBtoC業態は、PCよりもスマホなどによるモバイルユーザーの閲覧数が多くなっています。

そうなってくると、自ずとモバイルユーザーをメインターゲットに据え、サイト構成を提案していきますが、いわゆる「モバイルファースト」の潮流はより一層進んでくるのではと予想しています。

モバイルファーストではなくユーザーファーストを目指す

スマホが普及し、いつでもどこでも情報の取得が可能になった今、WEBサイトの利便性や検索性の向上を図り、モバイルユーザーの満足度を高めていくことが、モバイルファーストの基本的な考え方になっています。

しかし、モバイルファーストに固執することで、PCユーザーへの配慮を疎かにしてしまうのは、本末転倒と言えるかもしれません。

もちろん「モバイルユーザーが多い = モバイルファースト」はごもっともな考え方ですが、理想はPCユーザーにとっても利便性の高いWEBサイトです。

どんなデバイスからアクセスしても最適な環境を提供する「ユーザーファースト」の考えこそ、WEBサイトの構築で目指すところになるわけです。

ネックとなるレスポンシブ化のコスト

ユーザーファーストを実現する方法として一般的なのは、WEBサイトの「レスポンシブ化(レスポンシブデザイン)」です。

レスポンシブデザインとは、WEBサイトに訪れたユーザーが利用する端末・デバイスの画面サイズに合わせ、ページレイアウトを最適化する手法のこと。しかし、画面サイズごとにレスポンシブ対応を行い、レイアウトを最適化していくことになるので、ページ数や対応する画面サイズの数が多くなれば、そのぶん開発工数が増えて制作費用も膨れ上がってしまいます。

SAVVYにご相談いただくお客様の中には、実際にそのコストがネックとなり、プロジェクト自体が立ち消えになってしまうこともありました。

モバイル特化型レスポンシブデザインの登場

そんななか、最近の情報収集でよく目にするようになったと感じるのが「モバイル特化型レスポンシブデザイン」です。

モバイルユーザーに特化している一方、PCユーザーの取りこぼしも限りなく減らそうという考え方に立った手法となっています。

まどろっこしい言い方をしていますが、端的に言えば「PCでもモバイル用サイトを表示させる」というものになるのですが、ただ、これだけだとPCユーザーにとってはデザインも構造も使い勝手がよくない。

そのため、普通は離脱してしまうわけですが、モバイル特化型レスポンシブデザインには、WEBサイトから離脱させないための工夫がなされています。

PCユーザー用に専用のナビゲーションやインタラクションを組み込むことで、 WEBサイト内でのユーザビリティを高め、利便性の向上につなげているのです。

つまり、「全体最適」ではなく「部分最適」を行うといったやり方になります。
ここで、いくつか事例を掲載したいと思います。

THE FIRST TAKEのサイト

画像

画面右側にスマホサイト用コンテンツ、左側にイメージ画を配置しています。
URL:https://www.thefirsttake.jp/

SALONIAのサイト

画像

画面中央にスマホサイト用コンテンツ、背景にコンセプトアートのモチーフをふわふわ浮遊しているように配置。
URL:https://salonia.jp/limited/spring2022/

BEAMS miniのサイト

画像

画面右側にスマホサイト用コンテンツ、左側にPCユーザー用のナビゲーションを配置。
URL:https://www.beams.co.jp/special/beamsmini/kids_7days/

といったように、イメージ用の写真や動画、趣向を凝らしたインタラクション要素、操作性向上のためのナビゲーション配置など、ちょっとした工夫で、PCで閲覧したときも飽きずに最後まで情報を見れたりするので、離脱ユーザーを減らすことに寄与できるのではと考えています。

デザイン・構造的にも部分的なレスポンシブ対応だけで済み、全体の制作コストも抑えられるので、今までコストがネックになっていたレスポンシブデザインのひとつの解決手段になるのではないでしょうか。

使い所を選べば非常に有効な選択肢

モバイルユーザー主体であることが前提にはなりますが、キャンペーンサイトやランディングページといった、特定のストーリー(シナリオ)のもと、サイトの構成をしていく特設ページ系や、ブログやニュースといったメディア系のサイトとは親和性がとても高く、費用対効果の面でも良い選択肢になると思います。

今後、さらにデバイスが多様化していくなか、限られた予算で「何をして、何をしないか」といった取捨選択や優先順位付けもますます重要になってくるでしょう。

こうした観点からも、モバイル特化型レスポンシブデザインは、WEBサイト制作の費用対効果を高める有効な手法になっていくのではないでしょうか。

弊社制作のデモサイト

画像

デモサイトはこちらからご覧いただけます。
※PCとスマホとでレイアウトが変わりますので2つのデバイスで試してみてください。

SAVVYでもモバイル特化型レスポンシブデザインの提案は増えてきています。
気になる方は、ぜひお気軽にお問い合わせください。

SHARE

この記事をシェアする