スマートフォン最適化...

個別分析とアドバイス

スマートフォン上で現在の貴社サイトがどのように表示されるか

サイトの読み込み速度

ビジネスに役立つヒント

サイト運営型ビジネスに役立つヒント

スマートフォン最適化のベスト　プラクティス10 か条

次のステップ

レポート内容:

スマートフォン最適化診断レポート

http://labs.opentone.co.jp

| 2

スマートフォン最適化サイト診断（レポート）をご利用いただきありがとうございます。このレポートでは、お客様のサイトに関する診断結果と、サイトのスマートフォン対応を実現する具体的な対策についてご説明します。ぜひ参考になさってください。ご不明な点がありましたら、howtogomo.com までお問い合わせください。

<サイト運営型>ビジネスに役立つヒント

サイト運営型ビジネスの目標は、ユーザーにサイトのコンテンツを検索、発見してもらい、エンゲージメントしてもらうことです。ユーザーは、どのデバイスやプラットフォームで表示しても、的確な求めている情報がすばやくタイムリーに提供され、優れたコンテンツを利用できることを期待しています。モバイルサイトで質の高いユーザーエクスペリエンスを実現することは重要な要素です。特に次のポイントが重要です。

読み込み速度が適度なスマートフォンサイトを作成し、iPhone や Android などの主要な端末で正しく表示

されるようにしましょう。

読み込み時間を短縮するように画像を最適化し、プラグインが必要なコンテンツ（多くの携帯端末でサポートされていない Flash など）は使わないようにしましょう。

ナビゲーション用のボタンや操作対象をわかりやすくデザインして、新しいコンテンツを見つけやすいよう工夫しま

しょう。

xxxxx.com スマートフォン最適化診断レポート

サイトを改善するための個別アドバイス

直感的なナビゲーション方法サイト上でのコンテンツの見つけやすさはサイト構築に不可欠な要素ですので、ユーザーがエンゲージしやすいよう、直感的なナビゲーション方法を提供することが重要です。スマートフォンの画面上では、デスクトップと同じレベルの詳細な結果を表示できない可能性があるという点を念頭に置く必要があります。価値のあるコンテンツを一画面に詰め込む代わりに、明瞭なナビゲーション方法を用意すれば、このような課題を克服できます。広告コピーの短縮や画像の縮小、リッチフォーマットの調整といった、スマートフォンサイト運営上のベストプラクティスの採用を検討してください。サイト上でユーザーがエンゲージしやすくなります。

検索ボックスを提供するコンテンツの豊富な情報配信ポータル型などのサイトでは、ユーザーが必要とする情報をすばやく検索できるようにすることをおすすめします。ユーザーは、デスクトップサイトと同様の、使いやすい検索結果表示を期待します。検索ボックスは、特定の情報を絞り込むには最も速い手段であり、時間に追われるスマートフォンユーザーには便利な機能です。

検討するべきその他のヒント

• スマートフォンの小型化が進み、情報入力しにくいため、検索クエリの入力を簡単にすることが特に重要です。

• 手順を減らし、検索結果のすばやい絞り込みに役立つ高度な検索機能をシンプルに利用できるようにしましょう。

• 重要な情報だけをハイライトした、要約済みの検索結果を表示しましょう。個々の検索結果の詳細を必要な場合にのみ表示できるようにしましょう。

優れた機能でユーザーを取り込む

コンテンツを重視するサイト運営者にとって、ユーザーエンゲージメントが主な優先課題となります。マーケティング戦略の一環として動画、カジュアルゲーム、アニメーションなどが使用される場合がありますが、テクノロジーによってはスマートフォン上で機能しない場合があります。一部のスマートフォン上では Flash や JavaScript が機能しません。こうした技術を使用している場合はモバイルウェブ開発者と相談して、別の技術のご利用をおすすめします。多くの機能が HTML5 によって実現可能になっています）。また、携帯電話のカメラ、加速度センサー、地理位置情報など、スマートフォン特有の機能を利用してユーザーを取り込む手法についても検討してください。


| 3

イメージ画像の取り扱い

スマートフォンサイトの作成時にサイトの主要部分が壊れたり欠落したりしないようにするため、サイトで使用するすべての技術がスマートフォンでサポートされていることを確認しましょう。Flash や JavaScript などのプログラムは一部の端末上で機能しないため、ページが読み込めないことやコンテンツが欠落することがあります。

大きな画像は読み込みに時間がかかるため、モバイルブラウザの動作停止、また様々な障害を招く原因になることがあります。サイトでの画像使用をためらう必要はありませんが、画像は小さなサイズに適切に圧縮し、短時間で読み込めるようにしてください。

テキストを重視

スマートフォンサイトではテキストを読みやすくすることが重要です。スマートフォンユーザーは、常に最適な状況でサイトを閲覧しているとは限りません。適切なフォントサイズを使用して、拡大やスクロールをしなくても見えるようにテキストを配置してください。どうしてもスクロールが必要な場合は、縦方向の操作に限定しましょう。

スマートフォン端末は画面が小さいため、箇条書きやコンテンツの分割を行って、サイトの情報を読みやすく、探しやすくすることが大切です。

モバイルユーザーに必要とされる情報や機能を慎重に見極めてください。

指先でのタッチ操作を意識したデザイン

指のタッチ操作で現行のサイトを閲覧するのが困難な場合は、スマートフォン専用のデザインを検討されることをおすすめします。指先では正確な操作がむずかしいため、ボタンやリンクのサイズが小さいと、クリックできない場合があります。スマートフォンサイトのデザインでは指先での操作に最適化するようにしましょう。幅の広いボタンを使用し、誤クリックされないようボタン同士の間隔を十分に空けてみてください。




| 4

スピードを重視多くのスマートフォンユーザーは時間に追われて

おり、1 日のちょっとした時間を活用してオンライ

ン上のタスクをこなします。こうした多忙なユーザ

ーを念頭に置きながら、サイトの読み込み時間を短

縮し、テキストを読みやすくしましょう。

スマートフォンユーザーがまず必要とするコンテンツや機能を優先しましょう。それには、デスクトップサイトのアクセスデータを調べ、スマートフォンユーザーがサイトで何をしているかを調べます。

テキストは長文を避け、箇条書きを使って読みやすく構成しましょう。

画像は圧縮してサイズを抑え、サイトの読み込みを速くすることをおすすめします。

シンプルな操作操作がわかりにくいサイトを喜ぶユーザーはいませ

ん。操作をわかりやすくし、ユーザーが探している

情報を簡単に見つけられるようにしましょう。大規

模なサイトや複雑なサイトでは検索機能が役立ち

ます。

スクロール操作を最小限に抑え、縦方向に限定しましょう。

メニューの階層構造を明確にし、ロールオーバーの使用は避けます。

[戻る] ボタンや [ホーム] ボタンをわかりやすく設置して、階層間の移動を容易にしましょう。

操作のためのリンクは 1 ページあたり 7 個以内に抑えましょう。

複雑な構成のサイトの場合、目立つ場所に検索ボックスを配置します。

親指での操作を意識ボタンは大きめのサイズにして、中央に配置し

ます。ボタン同士の間には十分なスペースを確

保し、クリックミスを防止しましょう。

小さいボタンはパディング設定などで余白を調

整し、クリック可能な面積を大きく確保しまし

ょう。

チェックボックスは、テキストの部分もクリッ

クできるようにして操作しやすくします。

読みやすさを考えたデザインスマートフォン向けに構築されたサイトは、ユーザ

ーの目を疲れさせることなくメッセージを伝えるこ

とができますので、読みやすさを意識しましょう。

スマートフォンの使用環境が、照明の暗い場所にあ

る可能性も考慮して、サイトをデザインします。

背景とテキストとのコントラストを適度に持ちましょう。

コンテンツは画面にきちんと収まるようにレイアウトし、ピンチズームをしなくても読めるようにします。

コンテンツを詰め込みすぎず、何も表示しないスペースも十分に残しましょう。

リンクやボタンの重要度がわかるようサイズと色を工夫しましょう。

ボタンには立体エフェクトやシャドウイングを使用しましょう。

アクセス性の確保スマートフォンサイトは、すべての端末で動作

し、画面の縦横の向きを問わないのが理想的です。

Flash は一部の端末では動作しません。替わりの技術を活用しましょう。

インタラクティブな機能やアニメーションは HTML5 を使って実現することが可能です。

画面が縦長でも横長でも対応できるようなサイトを作成しましょう。

ユーザーが画面の向きを変えても表示箇所がずれないようにします。

ユーザー登録／購買プロセスの簡略化どのような種類のサイトであっても、スクリーン上

のキーボードで、望む操作を容易に行えるようにす

る必要があります。商品の購入や問い合わせが簡単

にできるようにしましょう。

表示する情報は、コンバージョンの達成につながるもの（商品の詳細情報など）に絞りましょう。

手続きの完了に必要なステップは最小限にします。

申し込みなどの入力フォームは短くし、入力欄はできる限り少なくしましょう。

チェックボックス、リスト、スクロールメニューなどを用意してデータ入力を容易にします。

電話番号には必ず Click-To-Call 機能を設定しましょう。

スマートフォン最適化のベストプラクティス 10 か条




| 5

続けて ...

地域性を重視スマートフォンユーザーが求める情報は、最寄り

のガソリンスタンドや営業中のレストランといっ

た地域情報です。ユーザーに見つけてもらい、来店

してもらうために役立つ機能を用意しましょう。

トップページに住所や店舗検索機能を掲載しましょう。

地図やルート案内を含めましょう。可能な場合は GPS を活用し、ユーザーの所在地に合わせてパーソナライズした情報を提供します。

付近の店舗においての在庫をユーザーが確認できるようにしましょう。

シームレスな利便性を実現今やユーザーは 1 日の間にさまざまな場所から何

通りもの方法でインターネットに接続します。デス

クトップサイトの機能は可能な限りスマートフォ

ンサイトでも提供し、デスクトップとスマートフ

ォン上でシームレスで利便性の高いサイト体験を実

現させます。

よく検索される内容や、ショッピングカートの中身を保存できるようにしましょう。

サイトの主要な機能を、デスクトップやスマートフォンなど、可能な限りすべての端末で提供するようにします。

商品やサービスについては、どのサイトでも同じ情報を提供します。

スマートフォンサイトへのリダイレクト機能

スマートフォンサイトへのリダイレクト機能とは、

スマートフォンを使用しているユーザーを自動的に

判別し、スマートフォン対応サイトに誘導する機能

のことです。サイトにリダイレクトコードを実装

し、スマートフォンからアクセスするユーザーには

スマートフォンに適したサイトを表示するようにし

ましょう。

デスクトップサイトに戻るオプションを用意すると同時に、スマートフォンサイトにも簡単に戻れるように工夫します。

次回アクセス時に表示するサイトをユーザーが選べるようにしましょう。

リダイレクト先のページには住所や店舗検索機能などの主要な情報を表示します。

ユーザーの声を汲み取り、分析し、最適化を継続的に実施

優れたスマートフォンサイトはユーザーのニーズ

を的確に反映したデザインになります。対象ユーザ

ーの声に基づいて設計されているのです。デスクト

ップサイトのユーザーに「スマートフォンサイト

に求めるものは何か」を尋ね、テストと最適化のプ

ロセスを継続的に実施します。

アクセスデータを活用し、サイトがどのように使われているかを調べましょう。

可能であれば（特に複雑なサイトの場合）サイトの公開前にテストを行い、公開後にユーザーからのフィードバックを収集します。

このプロセスを繰り返し行い、調査に基づいて継続的にサイトを改善していきます。



次のステップここまでスマートフォン最適化サイトの作成方法についてご説明してきました。次は、実際に貴社サイトで試してみてください。デスクトップサイトの作成を代理店に依頼された場合は、同じ代理店にモバイル向けの最適化に対応しているかどうかお問い合わせください。代理店に依頼されていない場合は、howtogomo.com の [スマートフォンサイト構築について] セクションで、自分で簡単に行えるモバイルサイトビルダーへのリンク、またGoogle がご紹介するスマートフォン　サイト開発企業（本格的なサイト作成が可能）の一覧をご参照ください。

(一覧は 5 月中旬までに同セクションに公開予定)

GooGle を使ってビジネスを無料でアピールする

ビジネスオーナー向け Google プレイスでは、Google 検索と Google マップに表示するローカルリスティングを登録し、提供する商品やサービス、店舗を探しているユーザーにタイミングよくアピールできます（ユーザーの検索内容に関するデータも取得できます）。ビジネスをさらにアピールするには、写真や地図、店舗までのアクセスなどを追加することもできます。また、特別プロモーションをアピールしたり、リアルタイムの最新情報を投稿することも、ユーザーレビューに返信したりすることもできます。

詳細については Google プレイス（google.co.jp/

places）をご覧ください。

モバイル広告でビジネスをアピールする

AdWords のスマートフォン向け広告を使用して、新しいスマートフォン最適化サイトとスマートフォンをターゲットとするキャンペーンを組み合わせて活用しましょう。モバイル広告では、斬新な新しい広告フォーマットを使用することにより、オンラインでの売り上げや店舗への来客数を増やしたり、ブランド認知度を高めたりすることができます。

詳細については Google モバイル広告サイト（google.

co.jp/ads/mobile/）をご覧ください。

GooGle のサポートをフル活用する

このレポートではスマートフォン最適化サイト構築の重要なポイントのみを説明しています。スマートフォンサイト運営のベストプラクティスをさらに詳細に閲覧したり、準備が整ってサイトの作成にとりかかる場合は、いつでもhowtogomo.com をご活用ください。


| 6


スマートフォン最適化...

Documents