モバイルナビゲーションを設計するための7つのベストプラクティス

公開: 2016-04-19

モバイルの利用は天文学的な速度で増加しており、1つ明らかなことがあります。それを無視すると、訪問者を失うことになります。

現在、モバイルユーザーはデスクトップ経由でインターネットにアクセスするユーザーを上回っていますが、モバイルユーザーとデスクトップユーザーはまったく別の獣です。 モバイルユーザーは、まあ、モバイルです。 つまり、店舗の閲覧、サービスの購入、情報の検索、ニュースの閲覧など、すぐに満足できるものを求めているということです。 時間は重要です。 彼らが欲しいものをすぐに見つけることができない場合、彼らはあなたの主要な競争相手のウェブサイトに消えます。

このため、デザイナーがモバイルファーストの精神で作業して、モバイルユーザーに可能な限り最高のエクスペリエンスを提供することがこれまで以上に重要になっています。

そして、ナビゲーションはスムーズなモバイルユーザーエクスペリエンスを実現するための中心です。

モバイルナビゲーション

モバイルナビゲーションは直感的で簡単にアクセスできる必要があり、不動産が貴重であるため、画面スペースをあまり占有しないようにする必要があります。 シンプルさはここでのゲームの名前です。 デスクトップでは8ポイントのナビゲーションを完全に受け入れることができますが、モバイルではやり過ぎです。画面が乱雑になり、エンドユーザーが混乱します。

ベストプラクティス-モバイル-ナビゲーション-クラッター

ただし、ほとんどのモバイルユーザーはデスクトップからモバイルに移行しており、サイトのナビゲーションと外観に関しては、依然として一定の基準を期待しています。 言い換えれば、あなたは彼らの期待をあまり台無しにしたくないのです。 モバイルナビゲーションは一般的にデスクトップサイトで見られるものとは異なりますが、基本的な規則を複製する必要があります。

効果的なモバイルナビゲーションのための7つのベストプラクティスのヒントを次に示します。

1.メニューを短くて甘くしてください

「モバイルウェブサイトのメニューに関して言えば、実際には少ないほうが多いです。 」 メニューオプションをオーバーロードすると、ユーザーは必要なオプションを決定しようとするときに、決定の麻痺に直面します。 覚えておいてください、彼らは即座の情報を求めています。 彼らが多くのオプションをトロールしなければならない場合、彼らはより良いデザインのサイトを探して単に姿を消します。 だからあなたのメニューが短くて甘いことを確認してください。

これの例外はeコマースストアです。ユーザーはさまざまな購入カテゴリにすばやく簡単にアクセスできることを望んでいるためです。 ただし、商品カテゴリを減らすことはできませんが、ユーザーがショッピングを優先するため、ホーム、連絡先、概要などの標準ページの一部をモバイルメニューから削除することには議論の余地があります。

ベストプラクティス-モバイル-ナビゲーション-メニュー

2.目立つ検索ボタンを含める

シンプルさとミニマリズムは、モバイルデザインのキーワードです。 ただし、スペースが少なく、メニューが短いため、ユーザーが必要なものをすばやく見つけられない可能性があります。 このため、確立されたガラスのアイコンの形で目立つ検索ボタンを使用することが重要です。

理想的には、検索アイコンを画面の上部に配置して、ユーザーが特定の情報を求めてサイトにアクセスした場合に、最小限の手間で必要な情報を検索して見つけることができるようにします。

3.ホームページに簡単に戻ることができるようにします

すべてのインターネットユーザーによく知られている規則の1つはホームページの概念であり、これはモバイルでも同様に重要です。 サイトにたどり着き、数回クリックするだけで、突然自分の居場所がわからなくなったり、電話に出てブラウジングに戻ったときに何をしていたかを忘れたりするのは簡単です。 ホームアイコンはすべてのユーザーにとって見慣れたものであり、ホームページに簡単に戻る方法を提供します。

ホームページも参考になります。 ユーザーが自分の方向を変えて最も重要なコンテンツを即座に発見できるように、サイトで最も役立つ情報の概要が含まれている必要があります。

4.CTAを明確にする

Webサイトの各ページには、行動を呼びかける必要があります。これにより、訪問者がそこに着陸した後に何をしてほしいかが明確になります。 モバイルの最小化されたブラウジング環境では、行動を促すフレーズを常に強調することが不可欠です。

CTAの基本的な規則(明確で対照的な色、独特で説得力のあるテキスト)に従い、視覚的に目立つようにし、見逃せない場所の前面と中央に配置します。

eコマースストアをお持ちの場合は、[カートに追加]または[購入]ボタンをスティッキーボタンとして追加することを検討してください。これにより、ユーザーがスクロールしているときに常にページに表示されます。

5.共有アイコンが必要かどうかを検討します

これは簡単に思えるかもしれません。 結局のところ、モバイルデバイスでのソーシャルメディアの使用は史上最高であり、5億人以上の人々が自分のモバイルだけでFacebookを使用しています。 しかし、Moovwebによる最近の調査によると、モバイルユーザーのわずか0.2%がモバイル共有ボタンをクリックしたことがあり、これはデスクトップよりも35%少なくなっています。 実際、この調査によると、モバイルユーザーは、モバイルを介してコンテンツを共有するよりも、広告をクリックする可能性が11.5倍高いことがわかりました。

この調査では、マーケティングキャンペーンの一環としてソーシャルシェアリングを実装したい場合、Facebookがターゲットとする主要なネットワークであることが明らかになりました。 モバイル向けに最適化された共有アイコンを含めることに加えて、成功の可能性を最大限に高めるには、ユーザーに情報の共有を求めるCTAを含める必要があります。また、何らかのインセンティブを提供することもできます。

ベストプラクティス-モバイル-ナビゲーション-アイコン

6.プロモーションを最小限に抑える

上記の調査で述べたように、モバイルユーザーは、モバイルデバイスからの情報を共有するよりも、広告をクリックする可能性がはるかに高くなります。 しかし、それはあなたがあなたのモバイルウェブサイトに広告を散らかす必要があるという意味ではありません。

それどころか、モバイル画面では不動産が割高になっているため、画面を広告で乱雑にすることは、訪問者がしかめっ面で出発することを確実にする確実な方法です。 プロモーションは、サイトでの独自の広告であろうと有料広告であろうと、画面上の最高のコンテンツや最も重要な情報でさえも簡単に圧倒し、ユーザーにとってナビゲーションを困難にする可能性があります。 プロモーションや広告を含めたい場合は、それらを引き継がないように注意してください。

7.サイトをタッチフレンドリーにする

最後に、モバイルサイトがタッチフレンドリーであることを確認して、ナビゲーションの動作がユーザーにとってシンプルであることを確認します。 正確なマウスの代わりに、ユーザーはナビゲーションに大きくてやや不器用な指を使用することを忘れないでください。 デザインには十分な余白が含まれている必要があり、リンクはわかりやすく、指で簡単にタップできる必要があります。ターゲットサイズは44pxx44pxです。

さらに、ホバー効果など、モバイルにうまく変換されない効果を避け、ポップアップメッセージの使用を避けてください。デスクトップでは十分にイライラしますが、モバイルサイトでナビゲートするのは特に面倒です。

ベストプラクティス-モバイル-ナビゲーション-タッチフレンドリー

モバイルが大きいことは否定できません。それはすべてのウェブサイトの所有者にとって非常に重要です。 クライアントの主な目的を理解し、ミニマリストの見通しとモバイルファーストの考え方を使用して、正確かつ目的を持って設計するようにしてください。 ユーザーを麻痺させて追い払う可能性のある選択肢や気晴らしでユーザーを圧倒したくはありません。

訪問者のユーザーエクスペリエンスを高めるために、シームレスで直感的なナビゲーションを目指しています。 「一流のユーザーエクスペリエンスにより、サイトはより多くの訪問者を引き付け、より多くのコンバージョンを達成します。 」

直感的でスムーズなモバイルナビゲーションのために、どのようなヒントやコツを使用していますか? 重要なことを見逃したことがありますか? 以下に教えてください!