モバイルUXに適応する方法とユーザーブラウザの習慣の変化

公開: 2018-09-14

モバイルデバイスからのインターネットトラフィックの割合は、2016年に初めてデスクトップトラフィックを上回りました。モバイルデバイスからインターネットにアクセスする人が増えるにつれて、優れたモバイル設計の必要性がますます重要になります。マーケターは、モバイルユーザーにリーチしながらコンバージョンとエンゲージメントを高めるために、最高のUXデザイン要素を理解する必要があります。

貧弱なモバイルデザインはあなたのブランドを台無しにする可能性があります

モバイルウェブサイトのユーザーは、サイトを適切に最適化していないブランドをあまり容認していません。 Impactbndによると、顧客の52％は、モバイルエクスペリエンスの低いWebサイトを利用したくないと考えています。また、サイトを完全に放棄する可能性も5倍高くなります。

ますます多くの顧客がモバイルデバイスでインターネットを閲覧するためにより多くの時間を費やすにつれて、顧客の期待は高まるばかりです。モバイルUXに影響を与える要因を理解することが不可欠です。

モバイルUXはどう違うのですか？

モバイルUX向けにサイトの最適化を開始する前に、モバイルユーザーとデスクトップユーザーがサイトを操作する方法の違いを理解する必要があります。最大の違いは、モバイルデバイスではスクロールとクリックがはるかに難しいことです。ユーザーがコンテンツを操作しているときにユーザーがイライラしないように、ナビゲーションを簡素化する必要があります。

画面のサイズも考慮する必要があります。スマートフォンやタブレットの画面もデスクトップよりも小さいため、視覚的な要素がコンパクトになる可能性があります。

モバイルUXを改善するためのヒントをいくつか紹介します。

テキストとリンクの可視性を高める

モバイル画面は小さいので、テキストは一般的に読みにくくなります。テキストを別の方法で表示する必要があります。覚えておく必要のあることがいくつかあります。

奇妙なフォントの使用は避けてください。使用するのに最適なフォントの種類には、Arial、Times New Roman、Grotesque、Helvetica、OpenSansなどがあります。 AdBonnieのAlgerianのようなフォントは読みづらくなります。
18〜22ポイントのフォントサイズを使用することを検討してください。同じフォントサイズはデスクトップデバイスでは10％大きいため、モバイルでテキストを目立たせるには、より大きなフォントを使用する必要があります。
ハイパーリンクには、暗いテキストと太字の色を使用します。これにより、コントラストが向上します。

もちろん、テキストを最適化する際には、ユーザーの人口統計も考慮する必要があります。年配のユーザーは、どの画面サイズでもテキストを読むのが難しくなることに注意してください。この問題はモバイルユーザーの場合はさらに悪化するため、読者のほとんどが高齢者である場合は、テキストをさらに大きくしてください。

すべての召喚ボタンが、さまざまな指のサイズに対して十分な大きさであることを確認してください

新しい召喚状ボタンを作成する場合、可視性は最初に検討することの1つです。ただし、召喚状の完了のしやすさも考慮する必要があります。これは、可視性を超えています。小さなボタンはクリックしにくくなります。これは、指が大きいユーザーに特に当てはまります。サイトのUXを評価するときは、指が自分よりも大きい人がいることを覚えておいて、それに応じてボタンのサイズを調整する必要があります。デュダはこれを非常にうまくやっています。彼らのvCitaオンラインスケジューリングツールには、簡単にクリックできる大きなCTAボタンがあります。

Click-to-Callオプションを使用する

モバイルユーザーの注意力は非常に短いです。彼らにあなたのウェブサイトから電話番号をダイヤルさせようとして頑張ってください。ほとんどの人は、電話番号が正しいことを確認するために、ダイヤルパッドとWebサイトを行き来することを望んでいません。たとえ彼らがそうしたとしても、彼らがそれを間違って入力したというリスクは常にあります。彼らはおそらく、間違った番号に電話をかけた場合でも、わざわざ電話をかけ直そうとはしません。

代わりにクリックして呼び出すオプションがあると、ユーザーははるかに幸せになります。また、電話をかける可能性がはるかに高くなります。

メールファネルを複雑にしすぎないでください

デスクトップデバイスでは、ユーザーにメーリングリストを購読させることは十分に困難です。モバイルトラフィック用に設定するのはかなり難しいです。

メールファネルができるだけシンプルであることを確認してください。また、モバイルデバイスで増大している問題であるボットトラフィックを回避するための措置を講じます。メール検証サービスを使用して疑わしいメールをチェックし、リストから削除すると、開封率やその他の重要な指標を改善するのに役立ちます。

ハンバーガーメニューを使用して、コンテンツをよりアクセシブルにします

多くのウェブサイトのメニューは、以前よりもずっと雑然としています。多くのデスクトップWebサイトは、ドロップダウンメニューを使用してナビゲーションを簡素化し、この問題を最小限に抑えています。残念ながら、これらのタイプのメニューは、モバイルデバイスではまったくの悪夢になる可能性があります。

Facebookは、ハンバーガーメニューと呼ばれるモバイルアプリのソリューションを開発しました。このオプションは、モバイルユーザーがサイトを操作してコンテンツに簡単にアクセスするためのシームレスな方法です。より多くのオプションでドロップダウンするサブメニューの代わりに、その横にハンバーガーアイコンがあります。ユーザーはハンバーガーをクリックして、より多くのメニューオプションを備えた新しい画面に移動できます。

UXの専門家は、ハンバーガーメニューの有用性についてさまざまな意見を持っています。一方では、ユーザーは何回かクリックする必要がありますが、人気のあるWebページを見つけようとすると、不必要に面倒になる可能性があります。一方で、ユーザーを完全に失うことを避けるための最良の方法かもしれません。

ある調査によると、顧客が多くの選択肢を与えられた場合、行動を起こす可能性は10分の1になります。ハンバーガーメニューで一部のユーザーを失う可能性がありますが、一度に多くのオプションでユーザーを過負荷にした場合ほど多くはありません。

ハンバーガーメニューはテストする価値があるかもしれません。ただし、最初に不要なオプションを削除して、メニューナビゲーションを簡素化することが重要です。これは、視聴者を失うことを避けるための最良の方法になります。

不要な要素を削除します

あなたのウェブサイトから不必要な要素を取り除くことはあなたのモバイルサイトのパフォーマンスを改善するために不可欠です。モバイル画面が非常に乱雑になる可能性があります。さらに悪いことに、彼らはあなたの召喚状から気をそらしたり、重要なコンテンツ（CTAを含む）をフォールドの下に押し込んだりする可能性があります。このコンテンツが表示されない場合、ユーザーは下にスクロールしてコンテンツを利用することはできません。

画面上のすべての視覚要素をよく見てください。それらが重要かどうかを判断し、必要に応じてモバイルページから削除します。

モバイルUXをよく見てください

十分に最適化されたモバイルインターフェースを持つことが不可欠です。ユーザーがコンテンツを簡単に利用できるようにし、コンバージョン率を最大化できるようにする必要があります。幸い、モバイルUXを改善する方法はたくさんあります。これらのガイドラインは良い出発点ですが、テストすることを忘れないでください！モバイルウェブサイトに新しいデザイン変更を加える場合、分析データは最良のガイドになります。