はじめに

モバイル端末向けサイトを構築する際に知っておくべき 3 つのこと

1. ユーザーが快適に利用できるサイトを作成する

サイトの訪問者が目的を達成できるようにサポートしましょう。訪問者の目的は、ブログ記事を楽しんだり、レストランの所在地を調べたり、商品のレビューをチェックしたりすることです。Walgreens の e コマース部門 GVP 兼最高技術責任者である Abhi Dhar 氏は、「当社がモバイルに対するあらゆる取り組みで目指しているのは、お客様がより快適に暮らせるようにすることです」と話しています

ユーザーがサイトにアクセスして目的を達成する手助けになるように、サイトを設計しましょう。

想定されるカスタマー ジャーニーの段階を整理し、各段階をモバイル ユーザーが簡単にたどれるようにしましょう。エクスペリエンスを簡素化して、ユーザー インタラクションの回数を少なく抑えます。この例では、(1)ユーザーが購入したいランプを検索してサイトをクリックする、(2)ランプをいくつか閲覧する、(3)欲しいランプを購入する、となっています。

2. モバイル ユーザーが一般的なタスクをどの程度簡単に行えるかを基準に、ウェブサイトの有効性を測定する

モバイルサイトの作成では、優先順位を付けることが必要です。まず、モバイル端末でサイトにアクセスするユーザーにとって、どのようなタスクが最も重要で一般的であるかを考えます。こうしたタスクを行いやすくすることが不可欠であり、そのようなモバイルサイトを作れるかどうかによって、ユーザーがどれだけスムーズに目的を達成できるかが決まります。サイトのデザインを工夫して、使いやすさを向上させることも大事です。インターフェースに一貫性を持たせ、プラットフォーム間で統一されたエクスペリエンスを提供することに重点を置きます。

「モバイル ショッピング サイトを訪れたモバイル ユーザーは、使いやすさを最も重視します。アンケートに回答したユーザーの 48% は、利用するモバイルサイトの最も重要な特徴として使いやすさを挙げています。」(出典: MediaPost

3. あらゆるデバイスとの一貫性があるモバイル用テンプレート、テーマ、デザインを選択する(具体的には、レスポンシブ ウェブ デザインを採用する)

レスポンシブ ウェブ デザインとは、ユーザーがパソコン、タブレット、スマートフォンのいずれを使用していても、ページでは同じ URL と同じコードを使用し、画面サイズに応じて表示のみを調整することを意味します。Google では、他の設計方法よりもレスポンシブ ウェブ デザインを使用することをおすすめします。レスポンシブ ウェブ デザインの利点の 1 つは、サイトの 2 つのバージョンを管理する代わりに 1 つだけ管理すればよいことです。パソコン用サイトの www.example.com とそのモバイル版である m.example.com の両方を管理する必要はありません。パソコン ユーザーもモバイル ユーザーも利用できる 1 つのサイト(たとえば www.example.com)を管理すれば済みます。

レスポンシブなサイトでは、同一の URL とコードを使用し、さまざまな画面サイズに合わせて表示を調整します。上の 3 種類のデバイスは、すべて www.example.com を使用します(モバイル用ページは m.example.com にあり、タブレット用ページは t.example.com にあるといったことはありません)。

レスポンシブ ウェブ デザインを採用した Baines & Ernst では、複数のウェブサイトを作成することなく、さまざまな画面サイズに応じて最適のユーザー エクスペリエンスを提供しています。その効果として、ユーザーが一度のサイト訪問で閲覧するページ数が 11% 増加し、モバイルでのコンバージョンが 51% 向上しました。」

コンバージョンとは、ユーザーが商品の購入、企業や店舗への問い合わせ、ニュースレターの登録などの好ましいアクションを行うことです。

レスポンシブ ウェブ デザインを実装する方法の詳細については、ウェブの基礎をご覧ください。モバイル、タブレット、パソコン用のウェブサイトを実装するさまざまな方法の長所と短所を比較検討するには、マルチスクリーン対応サイトの構築をご覧ください。

初心者が避けたい 3 つのミス

ミスその 1 - モバイル ユーザーのことを忘れてしまう

良いモバイルサイトとは役に立つサイトであるということを忘れないでください。良いサイトは、ユーザーの目的が面白い記事を読むことであれ、お店の所在地を調べることであれ、その目的の達成を手助けします。モバイルに対応しているサイトを構築しただけで満足してはいけません。機能が完全であることが必要です。モバイル フレンドリーなサイト(モバイル ユーザーにとって実際に役立つ、ユーザーの最も一般的な目的に適したサイト)を構築しましょう。

ミスその 2 - モバイル用サイトをパソコン用サイトとは別のドメイン、サブドメイン、サブディレクトリに実装してしまう

Google では複数のモバイルサイトの設定をサポートしていますが、モバイル用に別の URL を作成すると、サイトの保守や更新の手間が大幅に増えるだけでなく、技術的な問題が発生する原因にもなります。多くの場合、レスポンシブ ウェブ デザインを採用してパソコン用とモバイル用に同じ URL で配信を行うことにより、業務を大幅に簡素化できます。レスポンシブ ウェブ デザインは、Google がおすすめするサイトの設定方法です。

ミスその 3 - 周囲からヒントを得ようとせず、孤立して作業してしまう

同じ分野の他のサイトや競合他社のサイトをチェックして、ヒントやおすすめの方法がないか探すようにします。先行している他のサイトからさまざまなことを学べるというメリットがあります。 The Mobile PlaybookGoogle マルチスクリーン対応の成功事例にも、参考になるアイデアが豊富にあります。

フィードバックを送信...