web-dev-qa-db-ja.com

インライン編集フィールドの編集をユーザーに促す

バックグラウンド

ユーザーが自分の名前を入力するためにその場編集フィールドを使用する。

問題

「名前を入力してください」という句は、ユーザーが自分の名前を入力できることを意味します。ただし、その場で編集フィールドが最初にクリックされない限り、名前を入力しても影響はありません。

「ここをクリックして名前を編集するにはここをクリックしてください」というフレーズは少し冗長ですが、「クリック」するのではなく指で触れるため、あまり適切ではなくなります。

質問

インプレイス編集フィールドに名前を入力するようにユーザーに促す良い方法は何ですか?

アイデア

  • ユーザーが編集できるフィールドで黄色のフェードテクニックを使用します。
  • 「ここをクリック」というフレーズを使用して、人生を続けてください。
  • 「あなたの名前」を使用して、ヒントが得られることを願っています。
  • sliding またはフェードツールチップを使用しますか?

環境

たとえば、次の画面について考えてみます。

Example Context

ユーザーは「不明なユーザー」(名前)を変更する必要はありませんが、必要に応じてパーソナライズできます。

関連リンク

4
Dave Jarvis

ホバーアフォーダンスの使用をお勧めします。このような大きなUIアイテムの場合、テキストボックスを要素の上に置くと、その後ろにテキストボックスが表示され、ユーザーが編集可能な要素として表示されるようになります。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

これは、「編集モード」などを備えたサイトでうまく機能し、ユーザーが変更を加えたいときに気を散らすホバーアクティビティを制限します。編集可能なページ要素の上にマウスを移動するとサイトが常にちらつくため、この制約がないとうまく機能しません。

3
Myrddin Emrys