Smartphone スマホ

 
スマホデザイン・UI調査・データ

変換? レスポンシブ? スクラッチ? スマホサイトのベストな制作方法とは!

・PCサイトを元にスマホサイトをつくりたい企業が増えている。

・予算、納期ありきで作ると、ユーザーのサイト離脱率がUPする場合も。

・企業の目的と、ユーザー目線を融合したサイト制作を目指そう。

スマホサイトを制作する場合、その方法について検討しますよね。

PCサイトはすでにあるので、それを活かしてスマホにどう最適な表示をさせればよいのか? 制作方法は多々ありますが、どのような視点で選べばいいのか、考えてみたいと思います。

PCサイトを活かして、スマホに最適表示させる3つの方法

「スマホ対応」といっても、いろいろな方法があります。既存の「PCサイトを活かす」ことを前提とするなら、主な手法は下記の3つでしょう。

1. PCサイト変換サービスを利用する

元のPCサイトを活かし、変換サービスを使ってスマホに最適化する方法です。変換サービスを比較した記事もありますので、ぜひ参照ください。
>> 比較してみました!スマホサイト変換サービス5選

2.レスポンシブWEBデザインで制作する

1つのHTMLで、横幅によってデザインを変える方法です。PCで、ブラウザの幅を広げたり縮めたりすると表示が変わる、アレです。

3.モバイル専用サイトを併設する

一般的に「スクラッチ」と呼ばれ、PCサイトとはまったく別に、スマホ専用サイトを作る方法です。

「一目で分かる比較表を見たい!!」という方もいると思いますので、上記3つの方法について、5つの項目で比較した表を作ってみました。

「スクラッチ制作でも開発すれば同一URLで表示できるよ」、「レスポンシブWEBデザインでも、デバイスによってソースを読み込まないよう開発できるよ」など、お金と工数と現状などで変わる場合ももちろんあります。

ここではあくまで「一般的には」という前提で、チェックしてもらえればと思います。

 

「とりあえずスマホサイトを作る」では、ユーザー離れの危険性も⁉

 

では、あなたのサイトの場合、どの方法を選べばいいのでしょうか?
いろいろな企業のWEB担当者や代理店の方と話す機会が多々ありますが、

「予算がないので、とにかく安く作りたい」

あるいは、

「リリース日が決まっているから、早くできる方法がいい」

という声をよく聞きます。

言いたいことはわかります。

お金も大事ですし、リリース日に間に合わせるのも大事です。でも、本当にそれでいいのでしょうか?

この二つの声からは、

「とりあえず、スマホで見やすいサイトを作ればいいんでしょ」

という姿勢しか見えません。

それでは、スマホサイトを作った意味がありません。

UIが悪いサイト、重くてなかなか表示されないサイトだとしたら、せっかく見てくれたユーザーもすぐに離れていくでしょう。

最も重要なのは、

「使いやすい(見やすい)スマホサイトになっているのか」

というユーザー視点を失わないことです。

また、運用に入ると、かえって工数やお金がかかるかもしれません。

リニューアルしたサイトを、その後3年間運用していくとしましょう。

初期費用と運用費用、3年間の合計はいくらになりますか?
社内で対応するとしたら、その人件費はいくらかかるでしょう?

3年間の工数も含めた合計金額を考えることも必要です。

ユーザー視点と企業の目的&目標。ピタッとハマる方法が最善の道だ!

そもそも企画の段階で、みなさんはどうサイト戦略を練りますか?

企業側として見た場合、(UI・UXを踏まえた)KPIやKGIといった「目標」をたてて、達成するためにどうしたらいいかを考えますよね?

それをクリアするためのポイントは複数あるはずなので、最もクリアできそうな方法を選択すればいいのです。

あくまで一例ですが、いろいろなタイプの会社の現状を見てみましょう。

【A社担当者のコメント】

「ECサイトなので、とにかくコンバージョン重視です。毎月の更新量もハンパなく多いので、その工数をできる限り少なくできるとうれしいんですけどねぇ」

【A社のポイント】

まず、スマホ専用サイトを別に作る方法は、二つのサイトを運用することになり、工数がかかりすぎてありえません。

また、コンバージョンアップには、表示スピードが重要なポイントです。

(参考:なぜ、あの会社のモバイルサイトは、すばらしいと言われるのか?~表示スピードという性能)

ということは、レスポンシブWEBデザインより、画像のリサイズ機能などがついた変換サービスを使う方がよさそうですね。

【B社担当者のコメント】

「うちのブランドは最近誕生したばかりで、まだまだ知名度が低いので、SNSで広まることを重要なKPIとしています。また、世界観やイメージを浸透させるため、スマホサイトもデザインにはこだわりたいですね」

【B社のポイント】

SNS拡散とそこからの誘導を考えると、PCとスマホ、ユーザーはどちらのデバイスで流入してくるか分かりませんので、1URLで展開できる手法を考えましょう。

また、デザイン重視のPCサイトで画像を多用している場合、スマホに変換できないことも多いため、もしかしたらレスポンシブWEBデザインが最もいい方法かもしれません。

【C社担当者のコメント】

「新発売する商品のプロモーションサイトを新しく作ります。掲載は短期間なので、更新はありません。ただし、一気に誘導をかけるから、サーバー費用がかかりそうなんですよね…」

【C社のポイント】

更新がないのであれば、スマホとPCで別々のページを作るという判断もできます。

また、短期間の掲載なので、契約期間の縛りがあることが多い変換サービスだと、余分な月額利用料がかかるかもしれません。

とはいえ、サーバー費用まで考えるならば、CDNサービスがついている変換サービスを利用するのも、一つの手です。

私たちの会社は、「モビファイ」という変換サービスを扱っていますが、本当にとても素晴らしいサービスです。自信を持ってオススメします。とはいえ、サイトによっては、もちろん別の方法も提案しています。

ユーザーが使いやすく、企業ニーズにも合った方法を選ぶことが最も重要。「ユーザー視点」と「企業側の目的・目標」にマッチした方法を、ぜひ考えて選んでみてください。

まとめ・「予算や納期」だけでスマホサイトを作ると、大失敗の可能性が!

PCサイトをもとにスマホサイトを作るには、様々な方法、やり方があります。
ただ、予算や納期ありきで作ってしまうと、ユーザーに優しくないサイトになってしまう場合があります。

サイトの離脱率が上がってしまっては、企業もユーザーも不満足、という大失敗を招くことも。
企業の目的&目標と、ユーザー視点をマッチさせた変換サービスのセレクト、制作の工夫、提案をしていきたいものですね。

この記事を書いた人


モバイルラボ 編集部
ヨコハマ・モバイルラボとは? モバイルならではの表現ってなんだろう? 一瞬のひらめきや感動は手のひらから始まっています。 新しいクリエイティブのカタチをここから探してみましょう。
タグ

記事mobifyロゴ
Mobify(モビファイ)とは

Googleが認定しているマルチスクリーン対応のための最適化サービス。
デバイスに応じ、専用にデザインされたサイトを表示することができます。
ページの表示を高速化させる仕組みも持ち合せており、ユーザーの離脱を防ぐことが可能です。

▸Mobify(モビファイ)についてさらに詳しく

 最新記事