スマートフォン用ウェブサイトを改善したいけれど、どこから手をつければよいかわからないとお困りではありませんか?多くのアドバイスの中からどれを優先すればよいのか知りたいと思いませんか?このたび Google では、モバイル サイトを効率よく改善する上で役立つチェック リストを公開しました。このチェック リストでは、複数のトピックから関連するビジネス ケースや研究・調査にリンクしています。また、一部のトピックでは、Google アナリティクスやウェブマスター ツールのデータをサイトの改善に効果的に利用する方法を解説した動画を用意しています(字幕を日本語にしてご覧ください)。こちらのリストは、チェック リスト(英語)の簡易版となります。ぜひ、サイトの改善にお役立てください。
手順 1: ユーザーをイライラさせない
Google アナリティクスの直帰率とイベントのデータを使用して、トラフィックが多くユーザー エクスペリエンスが悪いモバイル向けページを改善する方法(スライド)
手順 1: ユーザーをイライラさせない
- モバイルのユーザー エージェントからのアクセスに対して余分なウィンドウを表示しない | Google の推奨事項、記事(英語)
- 簡単に閉じることのできない JavaScript ポップアップ。
- 特にアプリをダウンロードするためのオーバーレイ表示(iOS 6 以降の Smart App Banner(英語)またはそれに相当するバナー、サイド ナビゲーション、メール マーケティングなどの使用を代わりにご検討ください)。
- タスクを完了する前のアンケートの表示。
- 端末に適した機能を提供する
- ユーザーの端末で使用できないプラグインや動画を必要とする機能を削除します(たとえば、Adobe Flash は iPhone や Android バージョン 4.1 以降では再生できません)。| ビジネス ケース
- タブレット ユーザーにはデスクトップ バージョン(可能な場合はタブレット バージョン)を配信します。| 研究・調査(英語)
- デスクトップ バージョンの機能が携帯端末でもすべて利用できることを確認します。ユーザーがデスクトップ バージョンでの表示を選択した場合には、セッション中はすべてデスクトップ バージョンが保持されるようにします(つまり、各ページが読み込まれた後でユーザーがデスクトップ バージョンを選択しないで済むようにします)。| 研究・調査(英語)
- トラフィックが多くユーザー エクスペリエンスが悪いモバイル向けページを改善する
Google アナリティクスの直帰率とイベントのデータを使用して、トラフィックが多くユーザー エクスペリエンスが悪いモバイル向けページを改善する方法(スライド)
- パフォーマンス向上のための簡単な修正を加える(競合サイトよりもパフォーマンスが低い場合は継続して修正する)| ビジネス ケース(英語)
モバイル サイトのパフォーマンスを向上するための簡単な修正を加え、競合サイトとパフォーマンスを比較する方法(スライド)
「ユーザーの利便性を妨げない」のすべてのトピックを確認するには、フル バージョンのモバイル サイトを改善するためのチェック リストをご覧ください。
手順 2: 簡単にタスクを完了できるようにする
- クロール、インデックス登録、検索時のユーザー エクスペリエンスを最適化する | ビジネス ケース(英語)
- robots.txt によりアクセスを制限しているリソース(CSS、JavaScript)の制限を解除します。
- あなたのモバイルサイトの実装に適した検索エンジンのベスト プラクティスを実装します。
- レスポンシブ デザイン: CSS @media クエリを組み込みます。
- モバイル サイトを別に用意する: rel=alternate media と rel=canonical、および Vary: User-Agent HTTP ヘッダーを追加します。これにより、Google がリダイレクトスキップを実装しやすくなります。
- 動的な配信: Vary: User-Agent HTTP ヘッダーを組み込みます。
- サイトの一般的なモバイル ペルソナ ワークフローを最適化する
Google ウェブマスター ツールと Google アナリティクスを使用して一般的なモバイル ワークフローを最適化する方法(スライド)
手順 3: ユーザーをファンに変える
- 価値を提供するための新しい方法をブレーン ストーミングする
- 実際の店舗などにおいて買い物客がどのようにモバイルを使用するか、という点を考慮して制作します。| ビジネス ケース(英語)
- スマートフォンの GPS、カメラ、加速度計を活用します。
- 共有など、ソーシャルを活用します。| ビジネス ケース(英語)
- スワイプ、シェイク、タップを使用した直感的かつ楽しい体感機能の実装を検討します。