ウェブサイトのホームページに300枚の大きな画像を表示しても問題ありませんか？
私はeコマースサイトを開発しており、販売可能な製品は約200〜500個あります。各製品の100KB .jpgをホームページに表示したいと考えています。したがって、ホームページは基本的に、それぞれが100KBである200〜500のイメージをロードします。
これは、20〜50 MBのページ読み込みに相当しませんか。
私の主な懸念は、検索エンジンが私たちにペナルティを課し、検索結果の最初のページに到達することができないことです。これは本当ですか？
もう1つの主な懸念事項は、ユーザーに20〜50 MBのコンテンツをダウンロードすることを強制していることです。
これが私が思うほど悪い場合、ページネーションを使用せずにホームページに200〜500の画像をすべて保持する方法はありますか？あなたは何をお勧めします？
これは、20〜50 MBのページ読み込みに相当しませんか。
はい。これは、特にモバイルの場合、ダウンロードする画像（およびサイズ）の多くです。ユーザーのデータ使用量を読み込み、ハンマーで打つには時間がかかります。 Webページの平均サイズは3MBです。
また、これらの画像をさらに圧縮することも検討しています。これがサイトのカバー画像だけの場合は、必要に応じてサイズをさらに圧縮できます。これを行うには、画像オプティマイザまたはそれらをエクスポートする方法を確認してください。
- ユーザーに500の製品をすぐに提示することは、かなり難しいと主張します。ランディングページスタイルのフォーマットを検討して、ユーザーが希望どおりに自分の方法をフィルタリングできるようにすることを検討します。一度に多くの製品をユーザーに提示すると、それほど多くの売上が得られない可能性があります。Jamスタディを読んでください。これは、消費者心理学の優れた例であり、選択肢を増やしても売上が増加しないことを示しています。
https://digitalwellbeing.org/the-jam-study-strikes-back-when-less-choice-does-mean-more-sales/
- 一度に心を動かしている場合は、画像/製品のバッチで読み込まれる無限スクロールを見てください。次に、ユーザーがページを下にスクロールすると、別のバッチがさらに多くの画像を遅延読み込みします。
最初のオプションを強くお勧めします。
なぜあなたはそのような方法でユーザーを混乱させるのですか？彼に500個の製品を提供しても、販売は確実に促進されません。少なくとも5から10の製品ではなく、最大20の製品を表示し、影とボタンで500の製品すべてを表示するようにしてください。読み込み時間はもちろんのこと、SEOやその他のもの。
個人的には（すでにいくつかのコメントで述べたように）、ホームページに多くの画像を表示しようとすると、サイトに近づくことはありません。他の答え。
ロード時間とデータ使用量は別として、その多くの画像は多すぎて「取り込む」ことができないため、（私の意見では）そうしようとすると完全に逆効果になります。
この結果（すべてを1ページに表示）を許可できる唯一のconceivable方法は、製品をいくつかのカテゴリに分割することです（おそらく10以下、おそらく20以下）。 どちらか各カテゴリの1つの画像を表示（グリッドなど）、or表示少数各カテゴリのサンプル商品の行（1行）カテゴリごとの画像の数）。
次に、「カテゴリ内のすべての製品を表示」関数を実装できます。多くのウェブサイトでは、これによりカテゴリごとのページが表示され、関連するすべての製品が表示されます。この場合、ホームページで選択したカテゴリを動的に展開し、すべての製品のロードを開始できます。また、カテゴリを折りたたむための「Hide products」関数も必要です（ただし、ページに画像が「存在する」ままになる可能性があります。非表示にします）。
すべての準備が整ったら、「495製品をすべて表示」ボタンを追加して、allカテゴリを展開し、（最終的に）すべての製品を表示することができます。私はまだそのような関数の全体的な有用性に反対するでしょうが、少なくともそれはユーザーの選択でのみ発生し、ロードされる画像の数が事前に警告されます。
これは少し多すぎるようです。ホームページにすべての製品を表示する理由はありますか？製品が多すぎます。 1行に約4〜6個の製品があると想定した場合でも、83行です。それはかなりたくさんあります。
したがって、無限スクロールを使用すべきであるというOwen Hughesからの提案は良いものです。ただし、無限スクロールには欠点があります（ユーザーは通常、ページを更新すると進捗が緩くなり、フッターに到達できなくなります）。それはあなたにとって問題ではないかもしれません。しかし、それでも技術的にはページネーションです。
可能な他の可能性の1つは遅延読み込みと呼ばれます。特定のスクロール位置に到達したときに画像の読み込みを開始することを意味しますか？これは無限スクロールに非常に似ていますが、実際のコンテンツを非表示にしません。
番号
300画像の問題は、ユーザーが適切な製品を見つけるために最大300画像を閲覧する必要があることです。
商取引では、製品のフィルタリングと検索にはあらゆる種類のパターンがあります。 UXの土台
さらに、300枚の大きな画像はモバイルデバイスでは扱いにくくなります。
私の強力なアドバイスは、製品を何らかのIA（もちろんテストが必要）に整理し、フィルターや検索などを介して表示を制御することです。
そのOK以上、その理想。
オンラインショップにアクセスしていますが、そのホームページは完全な製品カタログです。何？退屈で時間のかかるホームページを通過する必要はありませんか？優秀な！
また、機能不全で不適切に構成されたメニューで再び「戦う」必要はありませんか？すごい！
また、「ページごとに12個の製品」から「すべて表示」に切り替える必要はありませんか？驚くばかり！
クライアントとして、私はあなたのお店にとても満足しています。
そして反対側、つまり生産側からも可能です。最初のページのデザインを妥協し、画像のサイズを少し縮小できますか？
画像をウェブ用に最適化できますか？ （これには画像編集が含まれ、ファイル圧縮だけではありません）
このページの使いやすいダウンロードシステムを設計および開発できますか？一度にすべてをロードすると、一部の訪問者にとってはうまく機能しないか、まったく機能しない場合があります。全負荷を小さい部分に分割すると役立つ場合があります。このシステムにユーザーを含めることもできます。 「製品は見つかりましたか？さらに100をダウンロードする必要がありますか？」と彼に尋ねることができます。