読者です 読者をやめる 読者になる 読者になる

wanichan's web tips

Expression Web ユーザー向けにサイト制作のコツと問題解決のヒントを取り上げていきます。

スマートフォン用サイト別作成とレスポンシブWebデザインのメリットとデメリット

スマートフォン用サイトと別に分けるか、それともレスポンシブWebデザインにするかのどちらか迷っているあなたに、それぞれのメリットとデメリットについて説明します。

f:id:wanichan:20170122125859p:plain

はじめに

以前に、スマホ用サイトを別作成すべきか、それとも、レスポンシブWebデザインにするかどちらがいいかと某コミュニティに質問したことがあります。Google側としては、スマホ用サイトの作成については一切言及されず、とにかくレスポンシブWebデザインの作成を推奨しているとの回答をいただきました。しかし、長年運営続けてきたメインサイトをいきなりレスポンシブWebデザインにするのはかなり大変じゃないかということで、ひとまずスマホ用サイトを作りました。

しかし、一度作業が終わったあと、いざ新しいコンテンツを増やそうとした段階で、両方更新しなければいけないというわずらわしさが前面に出るようになりました。

この記事では、スマホ用サイトを別に作成してみた私の立場から、それぞれのメリットとデメリットについて述べたいと思います。

スマートフォン専用サイトのメリットとデメリット

メリット
  • スマホ用ということで、古いブラウザーを考慮しなくてもいい(HTML 5とかCSS3を積極的に使ってもOK)
  • とにかく軽いサイトが作れる
  • スマホ用だけにいろいろカスタマイズできる
デメリット
  • PC用サイトとスマホ用サイトの両方にも同じコンテンツが存在する限り、重複コンテンツとしてみなされる恐れがあり
    • スマホ用サイトには<head>の次の行にカノニカルURLを必ず指定する(それぞれ該当する記事URLの指定が必要)
    • たまにURLの入力ミスによりリンク切れが発生する恐れがあり
  • 一方のコンテンツを更新したり追加したりした場合に、もう一方も同じ作業が必要となる。二度手間。

レスポンシブWebデザインのメリットとデメリット

メリット
  • 単一URLなので、更新作業は1度だけで済む
  • スマホ用サイトとPC用サイトとの連携においてのミスが起きない
  • Googleが推奨している(まあ、Googleさんの手間を省きたいということでしょうけど)
デメリット
  • 様々なデバイスに対応するために、それだけソースが長くなる
  • CSSのmediaクエリに対応していない古いブラウザーにも対応しなければいけない
  • スマホからでも問題なくコンテンツ閲覧できるようなレイアウトも考慮しないといけないため、開発コストがかかる(手間がかかる)

まとめ

Googleが推奨しているからレスポンシブWebデザインの方がいろいろと有利ではないのか?と思われるかもしれませんが、実際にはそんなことはありません。スマホ用サイトを開設して別々に運営するのがいいのか、レスポンシブWebデザインにするのがいいのかは、正直のところ一長一短で、どれがベターかは断言できません。

ただ、Webサイトは更新作業が必要不可欠です。その更新作業のことを考えて、どっちがいいのかは十分に検討してみてください。