スマホ・タブレット最適化に「レスポンシブWebサイト」がベストな理由


スマートフォンやタブレットの利用者数の増加にあわせ、Webサイトへのアクセス数のモニタリングから「スマホ最適化の必要性」を実感している人も多いでしょう。

昨年あたりからレスポンシブWebデザインとよばれる、PCやスマホ、タブレットなどあらゆるデバイスに対応するWebページ制作の手法が増えてきました。今回は、レスポンシブWebデザインの導入メリットを、3つの観点からご紹介しましょう。


レスポンシブWebデザイン(Responsive Web Design)は、PC、タブレット、スマートフォンなど、あらゆるデバイスに最適化したWebサイトを、単一のHTMLで実現する制作手法です。

ブラウザーのスクリーンサイズを基準にCSSでレイアウトを調整することで、デバイスごとに専用サイトを用意することなく、マルチスクリーンに対応したWebサイトを制作できます。
(出典: ascii.jp「ゼロから始めるレスポンシブWebデザイン入門」より )

レスポンシブWebデザインの3つの特徴

1.検索エンジン最適化(SEO)

PC用とモバイル用のサイトとを別々に構築していると、それぞれサイトURLが異なるので、モバイル用のディレクトリでないと正しく表示ができないことがあります。また、検索サイトの表示結果にスマートフォン用のサイトURLが表示され、意図しないページにユーザーを誘導してしまう事態にもなりかねません。

Googleのウェブマスター向け公式ブログによると、

PC 用のページとモバイル用のページを単一の(同一の) URL とすることができるため、ユーザーにとってはシェアやリンクが容易であり、Google のアルゴリズムにとってはコンテンツを適切にインデックスできるようになります。(http://googlewebmastercentral-ja.blogspot.jp/2012/06/google.html)

と語り、検索エンジン最適化(SEO)の面でレスポンシブ Webデザインでのサイト制作を推奨しています。

2.サイト更新管理(SEO)

レスポンシブWebデザインの魅力の一つに、1種類のHTMLソースでそれぞれのサイト更新を管理できることがあります。たとえば、PCサイトとスマホサイト、またipadのようなタブレットサイトと3種類のWebサイトをそれぞれ別々に管理していた場合、3種類のサイト向けに更新作業が必要になります。
既にタブレットも複数サイズで展開されており、今後もあらゆる端末に最適化を実施していくとなるとサイト更新の効率化を考えてもレスポンシブ Webデザインは有効手段となりそうです。

3.サイト効果

米TIME誌はレスポンシブWebデザインを採用した結果、次のような変化があったとまとめています。

・モバイルユーザーが23%増加
・Webサイトのユニークユーザーは15%増加
・滞在時間は7.5%増加
・モバイルユーザーの直帰率は26%減少

次に、ネクタイを販売しているアメリカのEコマースサイト「Skinny Ties」がレスポンシブWebデザインを採用した結果です。

・すべての端末で収入が42%増加
・コンバージョンレートが13.6%増加
・iPhoneでの収入が377.6% 増加
・iPhoneでのコンバージョンレートが71.9%増加
・滞在時間が44.6%の増加
・直帰率は23.3%減少

このように直帰率の減少と、Eコマースサイトにおいては収益の増加と、良いインパクトを得られていることがわかります。

まとめ

2016年、スマートフォンの契約端末数の67.3%になると予測されており、スマホ最適化は待ったなしの状況です。レスポンシブWebデザインはスマートフォンだけでなく、あらゆるモバイル端末にも対応できる魅力的な技術であることは間違いありません。

スマホ最適化が出来ていないサイトは、今すぐレスポンシブWebサイト対応に取り掛かりましょう。

関連する記事

ファッションECの新潮流!ユーズドマーケットの概念を覆す2つのEC。... Eコマースの中で、最も活気があるのがファッション分野です。数々のファッションECが出現する中、最近、ユニークなサービスが2つローンチしました。今回は、ユーズドマーケットに新たなコンセプトを打ち出した「MATERIAL WRLD」と「LOVVD」をみてみましょう。 MATERIAL WRLD MA...
2019年 Webデザインの潮流 Webデザインはその年、その年で新しいものが生まれ、トレンドとなったり、ならなかったりする。 2018年のトレンドと言えば、グラデーション、スプリット(分割)レイアウト、タイポグラフィデザインなど見た目のデザインが多かったように感じられる。 今年はどうだろうか? デザインを行うには「見た...
自社サイトで新規流入を増やす為にキーワード調査をどうやってやる? Google で利用できる無料ツー... Eコマースに欠かせないSEO(検索エンジン最適化)を、皆さんは意識しているはずです。実は、自社の商品が、どういった検索ワードを入力されて買い手の目に留まったか!? それを知らせてくれる便利なツールを、Googleは既に提供しています。今回は、その“Google Keyword Planner To...
効果が高いと言われるロングテールSEOとは何ですか?... SEO対策で重要なのは、人気のあるビックキーワードの設定であることは、周知の事実だが、「ロングテールキーワード」の設定もないがしろにはできない。「ロングテール」という言葉は耳にしたことはあるが、きちんと理解していないという人もいるかもしれない。今回はこの「ロングテールSEO」についてまとめてみた...
色がもつイメージ:安心と信頼をメッセージする=ブルー効果... 色が何らかのサインを送りだしていることは誰もがよく知っている。誰がどんな色を選ぼうと、共通しているのは、その色に対して人は反応するということだ。私たちは色に条件反射し、気づくこともない。色に対する反応は直観的反応とも言われ、個々の色は人の本能的な反応と密接に関係し、その反応は生理的、感情的、環境...
オンラインビジネスにおけるショートムービー活用術... スマートフォン用の動画共有アプリが充実し、動画共有がますます身近になる今日このごろ。ECサイトをはじめ、オンラインビジネスでは、どんな風にショートムービーを活用すれば効果的なのでしょうか?Vineを使った例を参考に、ショートムービーのインパクトと活用法について考えます。 Vineのショートムービー...

タグ: , , , , ,

コメント / トラックバック1件

  1. […] さらにGoogleは、2013年3月に「携帯端末に最適化されたウェブサイトの構築方法」を紹介しています。そこでは、サイト構築の方法としてレスポンシブウェブデザインが推奨されています。これは、以前にも紹介しましたがレスポンシブウェブデザインに早期に対応することで、URLの統一ができるため、デバイス毎にリンク先を変更して「間違いを犯すリスクを軽減できるからです。 スマートフォンユーザーに対して、PCサイトページを表示することで、「サイトが最適化されていない」と判断されることに不安を抱くサイト管理者も多いのではないでしょうか。スマートフォンでECを利用している人が年々増えていることからも、今回のGoogleの動きを見逃すことはできません。ランキング変更の影響を受ける前に、リンク先ページの見直しと修正を行ないましょう。 […]

コメントをどうぞ