web-dev-qa-db-ja.com

モバイルでのカルーセル速度

皆さん、モバイルWebサイトのカルーセルの最適速度はどれくらいですか?あなたがよりよく答えるために-

  • デスクトップの12〜20ワードに対して最適化されたコピー(モバイルの場合は6〜10ワード)
  • カルーセルに最大4つのバナー
  • 私がいくつかのウェブサイトを見たとき、彼らは5-8秒の間に速度を設定したことに気づきました
  • 一部のウェブサイトにはカルーセルがありますが、モバイルバージョンでは自動回転しません
4

個人的にカルーセルはもう使っていません。私/私達は私達の会社が顧客のために作る私達の電子商取引のウェブサイトで約1年前までそれらを使用しました。カルーセルは、いくつかの製品を限られたスペース、特にモバイルに配置するのに最適です。見栄えの良いヒーロー画像の方がCTR /コンバージョン率が優れていたため、私たちはそれらから離れました。

TL:DR

  • 質問で述べた事実に基づいて7または8秒(自動ローテーションが必要な場合は、私とNngroupは推奨しません)。
  • 自動回転しないと、モバイルWebサイトのパフォーマンスが向上し、SEOにも適しています(私の推論は、私の回答の後半で読むことができます)。 Nngroup は、モバイルデバイスで回転しないこともお勧めします。

回転速度の決定

したがって、回転速度を決定する前に、カルーセルのタイマーを実装する方法について考える必要があります。

  • ユーザーがウェブサイトにアクセスするとタイマーが開始しますか。
  • ウェブサイトが完全に読み込まれたときにタイマーが開始しますか?
  • ユーザーがカルーセルセクションに移動したときにタイマーが開始しますか。

Webサイトが完全に読み込まれ、ユーザーが正しいセクションに移動したときにタイマーを開始することをお勧めします。これにより、最初に表示されるアイテムがカルーセルに最初に配置するアイテムである可能性が最も高くなります。

回転速度に影響を与える要因

回転速度に影響を与えるいくつかの要因があります。一部はロケーションベースであり、一部はユーザーベースです。

読書速度

人の読み取り速度は回転速度に影響します。画像には6〜10語が含まれるとのことですが、ユーザーの平均的な読解レベルを調べてください。

オランダ(私が住んでいる場所)では、平均読み取りレベルはB1です [〜#〜] cefr [〜#〜] に基づいています。お住まいの国でも同様のシステムを使用し、情報をオンラインで利用できるようにする必要があります(また、ユーザーグループの読解レベルを確認してください)。

2012 で行われた調査では、被験者がテキストを読み上げる速度を測定し、17の異なる言語での平均速度が184±29 wpmまたは863±234文字/分であることがわかりました。ただし、ラテンアルファベットまたはキリルアルファベットを使用する言語では、wpmの数は、フィンランド語で161±18と低く、英語で228±30と異なりました。

出典: Wikipedia

したがって、上記の調査によると、テキストを読むだけで約+/- 3秒(平均)かかります(ラテンまたはキリル文字のアルファベット:〜4秒/英語:〜2秒)。

どのレベルの単語を使用しますか?

次に、難しい単語を使用しないことが重要です。たとえば、「難しい」という言葉は「難しい」という言葉よりも理解しやすいです。私は決して言語学の専門家ではありません。使用するテキストが英語の場合、 English stackexchange ネットワークの友達はおそらくテキストの難しさについてより良いアドバイスを提供できるはずです。

ターゲットグループが理解するのが難しい(または理解しにくい)単語を使用する場合。処理時間が長くなります。

画像(バナー)とテキストを理解する

上記のように、誰かが画像内のテキストを読むまでに少なくとも3秒かかります。 (*)誰かが文章と画像の意味を一緒に理解するまでに約2秒かかると思います。この推定は、テキストと画像の間に直接的な相関があることに基づいていることに注意してください(たとえば、「GTXビデオカードを搭載した新しいラップトップ」とラップトップの画像)。

画像があいまいな場合は、時間がかかる場合があります。 (例:「サルバドールダリは、誰もが人生の人形であることを示しています」+「 The Burning Giraffe 」の画像)

*私は、より大きな本文の理解時間に関する科学的研究しか見つけることができませんでした。例えば、 ' 読解力:大人の比較です。 'は、多くの論文でリファレンスとして使用されています。

オプション:モバイルインターネット速度

ユーザーがウェブサイトにアクセスするとすぐにカルーセルのタイマーを開始する場合は、情報をダウンロードするための時間も追加してください。 Speedtest.net には、各国の平均ダウンロード速度に関する大量の情報があります。

結論

したがって、あなたの例では、スライドを理解するのに少なくとも5秒はかかると私は言います。次に、ユーザーがクリックする必要があるかどうかをユーザーが「判断」するための時間を追加する必要があります。自動回転を選択した場合、スライドの所要時間は7〜8秒かかることをお勧めします。ユーザーがこれをテストして、完璧な期間を見つけることができることを覚えておいてください。

ただし、モバイルではスライドを自動回転しないことをお勧めします。以下の私の推論を見ることができます。

回転しないとパフォーマンスが向上します

当社はモバイルでアイテムをローテーションしません。これは、ウェブサイトのパフォーマンスが簡単に向上するためです。アイテムを積極的にローテーションしなかった理由を説明します。

JSの負荷が小さい

まず、アクティブに読み込まれるJSファイルが小さくなります。これにより、モバイルでのウェブサイトの読み込みが速くなります。ハイエンドの携帯電話はウェブサイトのアクティブな速度の増加に気づきませんが、予算の携帯電話はそうします。

JSはクライアント側で実行されるため、対話のレンダリングはクライアントのブラウザーで行う必要があります。手頃な電話のプロセッサは遅いため、ある程度エクスペリエンスに影響します。テストから、更新されていないスマートフォンのネイティブブラウザー(Samsung Webブラウザーなど)がJSで多くの問題を抱えていることがわかりました。

ロードされる初期画像が少ない

「次のアイテム」をクリックした後にのみ画像をロードするようにコードを最適化すると、「非表示」の画像がブラウザーによってロードされないため、最初のWebサイトのロードも速くなります(SEOには最適です。Googleは モバイルを最初に )。

ユーザーにオプションを与える

回転しないと、ユーザーは画像を変更することができます。そのため、画像/アイテムを見たい場合は、「次へ」をクリックすると表示されます。自動回転を使用している場合は、読むときに中文になることがあります。

編集:nngroup で古い記事を見つけました。先に述べたように、モバイルデバイスでは自動転送を行うべきではないと述べています。

次の理由により、モバイルデバイスでは自動転送を行わないでください。(1)ページが遅くなる、(2)ページが短いため、ユーザーが頻繁にスクロールすることが多いため、カルーセルが変更されるまでに、スクロールせずに見える範囲にいるとにかく変化を見ないでしょう。

次に、回転速度のガイドラインとして1秒あたり3ワードを使用します。これには同意しません(テキストを読むだけで約2〜3秒かかり、情報を処理して決定する必要があるため)。

適切なタイミングをテストするか、少なくとも平均的なユーザーがテキストを読んで画像を処理するのにかかる時間を見積もります。ガイドラインとして、毎秒3ワードを使用します。

5
Kevin M.

IMOすぐに正確な答えはありません。それは、ターゲットとする人々のグループ、彼らが持っている接続などに依存します。以下の場合には、A/Bテストを実行する必要があります。

  • 3〜4秒のローテーション-スキャンすることを忘れないでください。すべてを読み取るわけではありません。
  • ティーザーを使ってユーザーに左右にスワイプ/スクロールさせる-自動回転なし
  • カルーセルがまったくありません。あなたの写真とあなたの言い回しを次々に持ってください。

コンベンションレートの結果を確認したら、何をするかをできるだけ正確に決定します。

0
KOstas