スマホ対応(レスポンシブ)とは?いま必須と言われる理由
「スマホ対応」「レスポンシブデザイン」とはどういう意味なのか。パソコン用の画面がスマホで見づらくなる理由と、スマホ対応がいま必須とされる理由を、専門用語をかみ砕いて解説します。
執筆: おもてらいと編集部(ホームページ運用チーム)
お店のホームページをスマートフォンで開いたら、文字が小さくて、指でつまんで拡大しないと読めなかった——。そんなサイトに出会ったことはありませんか。もし自分のお店のサイトがそうなっていたら、多くのお客さまを逃しているかもしれません。
結論から言うと、スマホ対応(レスポンシブデザイン)とは「見る人の画面サイズに合わせて表示が自動で最適化される作り方」のことで、いまのホームページには必須の要素です。
先に、要点をまとめます。
- レスポンシブとは、画面サイズに合わせてレイアウトが自動で切り替わる仕組み
- お店のホームページはいまや閲覧の多くがスマホ経由
- Googleはスマホでの見え方を基準にサイトを評価している(モバイルファーストインデックス)
スマホ対応(レスポンシブ)とは何ですか?
レスポンシブデザインとは、見る人の画面の幅に合わせて、ホームページのレイアウトが自動で組み変わる作り方のことです。
たとえばパソコンでは3枚のカードが横に並んでいたものが、スマホでは縦一列に並び直り、文字も読みやすい大きさに調整されます。「反応する(respond)デザイン」という名前のとおり、機器に反応して形を変えるイメージです。
かつてはパソコン用とスマホ用に別々のページを作る方法もありましたが、現在は1つのページですべての機器に対応するレスポンシブが主流です。
なぜスマホ対応が「必須」と言われるのですか?
理由は2つあります。「お客さまの大半がスマホで見るから」と「Googleがスマホ基準で評価するから」です。
お客さまの大半はスマホから
美容室を探す、近くの飲食店を調べる、営業時間を確かめる——こうした行動のほとんどは、いまや移動中や外出先のスマートフォンで行われます。個人のお客さまを相手にする業種では、ホームページ閲覧の7〜8割がスマホ経由ということも珍しくありません。
つまりスマホでの見え方こそが、お店の第一印象そのものです。
Googleは「スマホ版」を基準に評価する
Googleは現在、モバイルファーストインデックスという方式を採用しています。これは、サイトの評価をスマホで見たときの状態を基準に行う、という仕組みです。
パソコンでどれだけ整っていても、スマホで見づらければ検索評価は上がりにくい、ということです。スマホでの見づらさは、リニューアルを検討すべき代表的なサインでもあります。
スマホで見づらいサイトには、どんな特徴がありますか?
代表的なチェックポイントは次の4つです。ご自身のスマホでお店のサイトを開いて確認してみてください。
- 文字が小さく、拡大しないと読めない
- 横スクロールしないと全体が見えない
- ボタンやリンクが小さすぎて、押し間違える
- 電話番号をタップしても発信できない
ひとつでも当てはまれば、お客さまは日々小さなストレスを感じています。
スマホ対応にするには、何をすればいいですか?
作り方によって手間が大きく変わります。
昔ながらの方法で作られたサイトをスマホ対応に改修するのは、デザインの作り直しに近い作業になることが多く、費用も期間もかかります。
一方、おもてらいとを含む現代のホームページ作成サービスでは、テンプレート自体が最初からレスポンシブで設計されています。おもてらいとで作ったページは、パソコン・タブレット・スマホのどれで見ても自動で最適なレイアウトになり、特別な設定は不要です。
まとめ:スマホでの見え方が「お店の顔」
スマホ対応(レスポンシブ)とは、画面サイズに合わせて表示が自動調整される作り方のこと。お客さまの大半がスマホで見て、Googleもスマホ基準で評価する以上、これは「あると良い機能」ではなく前提条件です。
これから作る方は、レスポンシブが標準のサービスを選べば意識する必要すらありません。まずはご自身のスマホで、いまのお店のサイトがどう見えているかを確かめるところから始めてみてください。
Related
関連ガイド
ホームページとは?ウェブサイトとの違いと、小さなお店に必要な理由
「ホームページ」と「ウェブサイト」は何が違うのか、そもそもホームページとは何なのか。いまさら聞きにくい基本を、小さなお店の目線でやさしく整理します。これからホームページを持つか考えている方の最初の一歩になるガイドです。
小さなお店のホームページに必要なページは?最小構成の考え方
ホームページを作ると決めたものの、どんなページを用意すればいいのかわからない——。この記事では、小さなお店・事業所にまず必要な「最小構成」の考え方を解説します。ページを増やすのは後からでも間に合います。
SNSがあればホームページは不要?役割の違いと使い分けの考え方
InstagramやX(旧Twitter)を頑張っているから、ホームページはいらないのでは——そう考える方は多くいらっしゃいます。結論は「役割が違うので、置き換えにはならない」。SNSとホームページそれぞれの得意・不得意と、小さなお店での現実的な使い分けを解説します。