水平スクロール可能なセクションをユーザーに示す最良の方法は？
私は自分のWebサイトで作業しており、垂直方向のスペースを節約しながら、水平スクロールを使用してアイテムの大きなリストを表示するというアイデアが気に入っています。
私が抱えている問題は、デスクトップバージョンのChromeでは、水平スクロールバーによって水平スクロールが明確になることです（少し見づらいですが、使用可能です）。ただし、モバイルバージョンのChromeでは、ユーザーがスクロールすると、停止後にフェードアウトしますが、私の目には、水平方向にスクロールできることはそれほど明白ではありません。
次の2つのスクリーンショットは私の問題を示しています。
デスクトップバージョンのスクロールバーを見るとわかるように、モバイルでスペースを水平にスクロールできることをユーザーが確認できる唯一の方法は、切り取られた画像ですが、これには2つの問題があります。
- 画像が水平方向のスペースを正確に満たし、クリップされた画像が表示されない場合はどうなりますか？
- ユーザーがこれを壊れたモバイルエクスペリエンスとして認識した場合はどうなりますか？画面からはみ出しているのは固定幅の領域だと思いますか？
どんなアイデアでも大歓迎です！
最初は、モバイルデバイスでの水平スクロールのアイデアは私を先延ばしにします。しかし、考え直した後、もし正しく行われた場合は、確かにスペース節約になります。多くのユーザーにとって、モバイルデバイスでの水平方向のスクロールは直観に反する場合があります。
それでも、ページをセクションに分割し、各セクションを個別に水平にスクロール可能にし、他のセクションから独立させると、理にかなっている可能性があります。これは、「正しく行われた」という意味です。
そして、スクロールの可能性をどのように示すのですか？いくつかの矢印のあるオーバーレイを使用して、特定のセクションを左または右にスクロールできることを示します。写真を参照してください：
シェードを操作して、スクロールがどちらかの端に達したか、単に矢印を消したかを示すこともできます。あなたにとってより魅力的なものを試してみてください。