web-dev-qa-db-ja.com

カルーセルの大きなキャプションをユーザーに知らせる方法はリンクです

このページ で、画像上の大きなキャプションをクリックできることをユーザーに通知します。 (現在、リンクはありません。)開いているページは同じサーバー上にあるため、Fontawesomeの[外部リンク]アイコンは機能しません。可能な場合は、目立たないが気づきやすいものにしてください。すべてのキャプションがクリック可能になるわけではありません。ほんの一部。

アイテムに下線を引くことを考えましたが、この場合は醜いです。モバイルユーザーとデスクトップユーザーのどちらにとっても、このことを明らかにするUX要素は何ですか。

[〜#〜] update [〜#〜]:モバイルデバイスのカルーセルは次のとおりです:

enter image description here

そして、これはデスクトップにあります:

enter image description here

9
Alex

より深いコンテンツがあることを示すために、矢印またはキャレットの使用を検討してください。これは、「行動を促すフレーズ」ボタンのテキストの最後によく使用される十分に一般的なアイコンです。これは理想的ではありませんが、カルーセルタイトルでは大丈夫です。

例えば.

enter image description here

enter image description here

enter image description here

13
nightning

2つのアプローチ:

  1. インタラクティブな要素としてキャプションをよりよく示します。ナイトニングの素晴らしい答えをご覧ください。

  2. キャプションだけでなく、画像全体をクリックできるようにします。画像の本文をクリックするとリンクが開き、矢印の近くをクリックするとカルーセルナビゲーションが動作します。

    • Webユーザーへの支援として、さまざまなホバーアニメーション(画像の明るさなど)で遊んで、追加の対話性の手がかりを提供できます。
9
tohster

また下線。矢印はおそらく88%のケースでより優れていますが、矢印を追加することがUIと一致しない場合は、下線を引くのが確実です。あなたが買い物を紹介するつもりなら、さらにそうです。

私は言っているだけです。

(タグに<u>が含まれていませんか?)

2
1
AlexC