Web関連

スマートフォンサイト制作の気になる事、あれこれ

0

こんにちは。モバイルサイト・シニア・アドバイザーの藤田です。嘘です。
コーディングディレクターの藤田です。
花粉症で日々悶絶しています。
花粉症の薬を飲むのが何となく許せなくて(病気でも無いのに何故薬を飲まなきゃいけないんだ、という謎のプライド)
いつも点鼻薬と目薬で対応しています。
(こうやって文章にしてみると、何故服用薬がダメで点鼻薬は良いのか矛盾が凄い)

毎朝スマートフォンで花粉ニュースをチェックし警戒を怠りません。
このようにいつでも情報が得られるスマートフォン、そのスマートフォン用サイトを制作するときに気をつけて欲しいことをご紹介します。

一体どっちがいいんだ?

スマートフォンに対応するサイト制作をする際、PCサイトと同じソースを使用する「レスポンシブサイト」と、PCサイトとは別にもうひとつ「スマートフォン専用サイト」を制作する方法がありますね。
これ、どちらが良いと思いますか?

まあ、正直どちらも良い悪いはありません。
(煽っておいてこれ。。。)

それぞれ一長一短あり、サイトの特性に合わせて選ぶ必要があります。
それでは、どのようなメリットとデメリットがあるのでしょうか。

img_smartphone_site01.jpg

レスポンシブサイト

PCサイトと同じソースを使用するこちらのタイプ。
なんと言ってもメリットは更新作業の手間が少ないことでしょう。
ちなみに、スマートフォンサイトを別に設けた場合、1つの更新作業に対してPCサイトとスマートフォンサイトの2つ発生しますが、レスポンシブサイトだとソースは同じモノなので、1つで済みます。
また、PCサイトとスマートフォンサイトの情報連携もソースが1つであればミスが起きませんね。

デメリットは、サイトが重くなりがちなところでしょうか。
PCサイトと同じソースを使っているとはいえ、レスポンシブにするにはPCサイト用に作ったソースをそのまま使用するわけではありません。
スマートフォンで見た時にちゃんと表示されるよう、いろいろタグが追加される訳です。
また、見た目を変えるにしても、レイアウトの変更には限界があります。
そのため、スマートフォンに適したデザインを表現する際、どうしても制限されてしまいます。

そんなわけで、レスポンシブサイトは、更新が多く、PCサイトとのデザインを大きく変える必要がない、
コーポレートサイトなどに適しています。

スマートフォン用サイト

スマートフォン用サイトを作ることのメリットについて、、、
ほとんど、レスポンシブサイトで説明した逆の事です。
PCサイトとは別のソースなので、自由にデザインする事が出来ます。
PCサイトのように古いブラウザを考慮する必要が無いので、html5やcss3を積極的に使用し、見て楽しいサイトにする事が出来ますね。
余計なソースも無いので、表示も軽くなります。

デメリットもやはり逆で、
更新性が劣ります。
更に、同じ内容のページが2つ存在する事になるので、googleに重複コンテンツと判断される可能性があります。
そうならないように、ソースのheadにcanonicalを指定したり、PCサイトにはスマートフォンサイトがある事を伝えるalternateを指定したりとやる事が増えてしまいます。

スマートフォン用サイトを制作するのに適しているのは、
更新が手間でも、凝った見せ方ができるので、明らかにPCサイトとニーズが異なるECサイト等が良いかと思います。

じゃあSEOはどうなんだ?

やはり気になるのはSEOでしょうね。どちらが良いのか。
一応、Googleはレスポンシブサイトを推奨していますが、これまたどちらも違いはありません。
推奨しているからと言って、レスポンシブサイトの順位が上がると言う事は無いようです。

しかし、先ほど言ったようにスマートフォン用サイトを設けると、しっかりhead情報を設定しないと重複コンテンツとされるリスクがあります。

まとめ

本当に一長一短ですよね。
webサイトは色々な特性があります。
更新の手間を省くと言う考えだけでレスポンシブサイトにしてみたらモバイルユーザーからのアクセスが激減なんて事があるかも知れません。

今回は分かり易く説明するため、レスポンシブサイトはコーポレートサイト、スマートフォン用サイトはECサイトが適していると紹介しましたが、必ずしも全てがそれに当てはまるわけではありません。

現状サイトのユーザーニーズなどを踏まえ、どちらが良いかを検討してみてください。

0

心に響く!採用サイトのキャッチコピー前のページ

春がくる!春をイメージしたwebデザインサイト次のページ

ピックアップ記事

  1. AIに求められているものは、実は意外な物だった
  2. 新しい販売形態であるDtoCについて考えてみる
  3. 大手企業も注目するMaaS(Mobility as a Service)とは何か…
  4. 新型コロナウイルスで日本の働き方改革が起こる

関連記事

  1. SNS関連

    SNSボタンがよく押される場所はどこ?

    SNSボタン、サイトによって配置がかなり違いますよね。今回、SNS…

  2. Web関連

    これだけは覚えておいてほしい、地味に使えるExcelの時短ワザ3選。

    こんにちは!ティファナコラム編集部 担当の秋田です。今回のテーマは「…

  3. Web関連

    会社経営、Web制作で大事なことはココから学べ!

    こんにちは、管理部の宮澤です。先日、あるロックバンドのコンサー…

  4. Web関連

    社員を幸せにする?!ゲーミフィケーション活用法

    皆さんは社員のモチベーションを上げることはできているでしょうか。「お…

  5. Web関連

    WEB制作に欠かせない知識とは?

    WEBデザイナーとして働きたい!と思っていても、「学校に通ったことはな…

  6. Web関連

    顧客満足度を上げるためには従業員満足度も大事!

    こんにちは。なぜかISO実行委員会(仮称)にメンバーとして召集され…

おすすめ記事

最近の記事

  1. 人間拡張×AIで非接触なデジタル化を推進する
  2. ヘルスケアはAI先生にみてもらう時代
  3. withコロナは非接触技術で生活しよう!
  4. デジタル接客+AIで非接触を推進する
  5. 遠隔診療や遠隔医療普及のポイントはAIと5G

アーカイブ

  1. AIさくらさん

    【人工知能・AI×メディア】キャラクター×デジタルサイネージに無限の可能性!
  2. Web関連

    アドラーの思想でSDGsについて考えてみる
  3. サービス・新技術

    申請書業務はRPAにお任せ!人の代わりに業務を自動化
  4. AI関連

    AIはエネルギー問題の救世主か、破壊者か?
  5. Web関連

    クラウドファンディングの成功例:森の図書館をご存知だろうか?
PAGE TOP