私のポートフォリオには、私がプロジェクトについて少し説明し、テキストとともにさまざまなサイズの画像を配置するケーススタディがあります。一部の小さな画像では、ユーザーはクリックして大きなバージョンを表示できますが、他の一部の画像はページ上で十分に鮮明です(ユーザーがクリックしなくても、ほぼ元のサイズで画像を表示できます)。だから私のオプションは:
質問は:ユーザーにとって本当の問題ですか?十分に鮮明な画像がある場合でも、クリックして拡大表示しますか?クリックして何も起こらないことにイライラするのでしょうか、それともクリックして同様の画像を表示するのにイライラするのでしょうか。 (タッチデバイスのユーザーはホバー効果がないため、推測はより問題になります)
noクリック可能な画像とクリック不可能な画像を区別する方法を提供すると混乱を招き、クリックによって利益が得られないことは煩わしいことになるので、どれが何かを特定する方法を提供するのに苦労していると思います画像はクリック可能であり、クリック可能ではありません。
境界線の代わりに(見た目が乱雑になる可能性があります)、クリック可能な画像の隅に虫眼鏡アイコンを追加できます。
2番目の方法は、すべての画像に境界線を追加することですが、色で区別します。
...しかし、違いを耳障りにすることと、たとえば、色覚異常。
ユーザーの最終目標について考えます。それは、より大きなバージョンを表示することです。タッチスクリーンでは、最初の直感は、シングルタップアクションではなく、拡大マルチタッチアクションを実行して画像を表示することです。イベントを検出したときにサムネイル画像を大きな画像に置き換えて、拡大された大きな画像がピクセル化された混乱にならないようにすることは興味深い解決策です。
私はこれが以前に行われたのを見たことがなく、いくつかのGoogleクエリは何も見つかりませんでした。誰かが以前にこのアプローチを実験したことがありますか?
最大の課題は、ユーザーが常に画像自体に対してこのマルチタッチイベントを実行するわけではないため、ページに複数ある場合は、すべてを置き換えるか、どれを置き換えるかを判断する必要があることです。