ダイナミックサービングかレスポンシブウェブデザインか、どっちで作るか悩んだキミへ
前にデザイナーさん向けにこんな記事を書いたんですけど、
この記事のなかのダイナミックサービングで作るか、レスポンシブウェブデザインで作るか、この問題もWebデザイナーを始めたばかりの方は判断が難しいと思います。 今回はWebサイトを新たに作る時の筆者なりの判断基準について書いてみます。
あ、当然、今どきモバイル対応していないサイトはNGですよ。
MFI（Mobile First Index：スマホ優先インデックス）を知らない方はまずこちらをチェックです。
「スマホ対応をしない＝SEO捨ててる」と言っても過言ではないですし、ユーザー体験としてもNGですし。
そもそもダイナミックサービングとレスポンシブウェブデザインとは？
ダイナミックサービングとは、URLはPCサイトとスマホサイトで一緒なんですが、アクセスしているデバイスによって見せるページやテンプレートを切り替える方式です。
テンプレートを切り替えるというのは例えばこんな例です。
ECサイトの商品詳細ページで、商品情報は同一だが、PCとスマホで見せ方を変えれるようなテンプレートを用意し、デバイスによって切り替える。
メディアサイトの記事ページで、記事の内容自体は同一だが、PCとスマホで見せ方を変えれるようなテンプレートを用意し、デバイスによって切り替える。
一方、レスポンシブウェブデザインはPCとスマホで同じページ・HTMLを見せて、CSSでデバイスごとの見せ方を切り替える方法です。
ダイナミックサービングの方が2種類のテンプレートを作るので多少面倒なんですけど、テンプレートが分かれてますのでデザインの自由度が高いかなと思います。
まーレスポンシブウェブデザインもPCの見た目を少し変えようと思ったらスマホが崩れたみたいな事象は多々あり、面倒臭さはありますけどね。
また、後述するセパレートURL方式と違ってレスポンシブウェブデザインもダイナミックサービングも、デバイスが変わってもURLが一緒というのが重要です。だってスマホでシェアしたURLをデスクトップで開くことは良くありますからね。
Webの世界でURLが一緒というのは本当に大事です。
大前提、セパレートURL方式は採用しない
レスポンシブウェブデザインでもない、ダイナミックサービングでもない場合はセパレートURLと呼ぶようです。
こんな作りです。
- PCのページは/a.html、SPのページは/sp/a.htmlを表示する。
- ページはそれぞれで作成する。
- PCのページに対してSPでアクセスした場合はリダイレクトする。逆も同様。（クライアントにとっては通信が増えるのでストレスです。）
- SEOのためにはPCページにはSPのURLのアノテーション、SPページにはPCのURLのアノテーションが必要です。Googleのサイトで書き方をチェックです。 https://developers.google.com/webmasters/mobile-sites/mobile-seo/separate-urls?hl=ja
はっきりいって、3.と4.が面倒です！
もともとPCページがあって、あとでSPのページを作るならセパレートURL方式の採用もアリですが、一から作るなら採用しない方が良いです。
レスポンシブウェブデザインの方が楽だけど、ダイナミックサービングにした方がいい時
筆者は実はレスポンシブウェブデザインがあまり好きじゃないです。
確かにレスポンシブウェブデザインの方が多少工数が浮くんですけど、ほとんど場合、ダイナミックサービングを選びます。
理由としては、こんなケースがあるからです。
例えば広告収益を柱とするメディアサイトでPCサイトとスマホサイトで広告メニューを分けたい場合がある。
SEOとかが重要じゃない会員登録ページなどで、入力のしやすさを重視し、画面遷移をPCとスマホで分けたい場合がある。（登録フォームを検索エンジンがクロールするのは負荷が大きいと言われており、フォーム系のページはnoindexにするSEOの手法があります。SEO効果の真偽について責任はとれませんが、検索エンジンにクロールさせる必要がないのなら、URLの一意性にこだわる必要が無いので入力のしやすさにこだわった方が良いというのが筆者の見解です。）
PCの方がスマホより画面が大きいので、PCは多くの情報を表示したい場合がある。
スマホはすき間時間で見ることが多く、PCはじっくり見るのに向いているので情報を表示する順番を変えたい時がある。
CVRを上げるために調整をしようとした時に、PCとスマホで同じページだと調整が難しい。
サービスを伸ばそうとしたとき、少しの工数の差はあんまり重要じゃなくて、やっぱりチューニングしやすいダイナミックサービングを選ぶべきなのは、こういった理由があると思います。
ただ、コーポレートサイトなどはレスポンシブウェブデザインは全然アリです。
サービスサイトと比べると、そんなにチューニングの必要はないですからね。
やたらめったらレスポンシブウェブデザインを薦める人が多いのは？
どこかで見聞きしたんでしょうけど、良く理解していない情報を鵜呑みにし、レスポンシブウェブデザインじゃなきゃダメだ！みたいなことを言う人、結構いますよね。
主にお客さんだと思いますが（汗
恐らくその原因のひとつにGoogleの検索エンジンがあると思います。
https://developers.google.com/webmasters/mobile-sites/mobile-seo/
このページにはっきりと「Googleでは、デザインパターンとしてレスポンシブデザインをおすすめします。」と書いています。
筆者は基本的に疑ってかかる方なので、この場合はGoogleの気持ちになり、なぜレスポンシブウェブデザインを薦めたのか推測してみます。
レスポンシブウェブデザインにしてくれると、クローラのユーザーエージェントをPCとスマホで切り替えて、同じページを複数回クロールする手間が省けるんだよなー
レスポンシブウェブデザインにしてくれると、PCとスマホでHTMLが一緒なのでインデックスのデータ量が節約できるんだよなー
Googleは世界中の大量のWebサイトをクロールしているので、この2点が節約出来るだけで、大きなコストメリットがあるのは明白かと思います。
また、Amazonも楽天もNaverまとめもレスポンシブウェブデザインじゃありません。 レスポンシブウェブデザインじゃないとSEOが不利！ってわけじゃないのを付け加えておきます。
最後に
ここまでダイナミックサービングかレスポンシブかの判断基準を説明しましたが、筆者の主観が多分に入っており、皆様が判断するときはサイトごとにしっかり判断してください。
筆者はダイナミックサービングをかなり推しましたが、実際にレスポンシブで出来ているメディアでも、良いメディアはたくさんあります。
サイトの特徴に応じて選択していただれば！
