第二部WebEngagement Seminar #7

事例でみる、Webサイトとスマートフォン連携で気をつけるべき５つのポイント

2011.08.30  NEC  BIGLOBEビジネスサービス事業部 　⼭山本隆範

スマートフォン・タブレット端末向けサイト制作事例

NECパーソナルコンピュータ様「１２１ウェア」

スマートフォン/携帯向けサポートサイト

徳島県　上勝町様町民向けポータルサイト

LifeTouch（NEC製Android端末）専用サイト

ベネッセコーポレーション様進研ゼミ高校講座サイト　中学講座サイト

受講生クチコミサイト

スマートフォンサイト設計の５つのポイント

①最適なコンテンツマネジメントシステム（CMS）を導入❖ワンソース・マルチユースが実現できるかどうか　（１つのHTML要素を様々なデバイス向けに再利用すること）❖トーン＆マナーをCMSで吸収できるかどうか❖デザインやコーディングを制約なくデザインできるか

: :

→BIGLOBE主催　CMS導入検討支援セミナー開催中　次回は10月11日

②デバイス毎の利用シーンやゴールを意識する❖デバイスによって、利用シーンは異なる。同じコンテンツを提供しているだけではダメ。

その他の例：某住宅メーカー様サイトのアクセス解析

コンテンツ 利用傾向 ゴール

PCサイト

会社概要独自の工法導入事例

掲示板（クチコミ）

平日 お問い合わせ資料請求

スマートフォンサイト

住宅展示場営業所検索

ソーシャルメディアからの流入

週末 展示会場来場

③アプリとの親和性を意識する❖スマートフォンサイトは、ソーシャルメディアからの流入がメイン❖スマートフォンサイトからは、アプリと連動して目的達成を考える

❖Like Journal

自分がFacebookで「いいね！」したリンクだけを抽出してくれるWebサービス（無料）

④端末には割りきって対応する

iPhone OS1.0

Safari

OperaMini

iOS4.x

X Android 1.6標準ブラウザ

OperaMini

Android 2.x

Android 3.x

X

Dolphin

Firefox

❖すべての機種・組み合わせへの対応は不可能。標準の組み合わせに対応すればOK

❖スマートフォンサイトの構築費用は、PCサイトと同じくらいかかると考えておいたほうが安全

⑤HTML5＋CSS3でユーザにやさしいデザイン

HTML5とは、HTMLのバージョン5、改訂第5版です。 現在、ウェブページを作成する際に一般的に利用されるのはHTML 4.01ですが、 次世代のウェブ環境に合わせて、新たに仕様を検討されているのがHTML5です。

❖スマートフォンサイトは、HTML5で設計を❖ライブラリをベースに開発するのも有効

❖iUi ❖iWebKit ❖jQTouch ❖jQuery Mobile

（⑥）業務・業態に合ったサービスを選択

❖BIGLOBEのスマートフォンソリューション

��

♪

まとめ

①最適なコンテンツマネジメントシステム（CMS）を導入

②デバイス毎の利用シーンやゴールを意識する

③アプリとの親和性を意識する

④端末には割りきって対応する

⑤HTML5＋CSS3でユーザにやさしいデザイン

（⑥）業務・業態に合ったサービスを選択

スマートフォンサイト設計の５つのポイント