web-dev-qa-db-ja.com

入力ラッパーの内側と外側の入力ラベル(プレースホルダーではない!)のUX効果は何ですか?

入力ラッパーに関する入力ラベルの位置について議論している研究や文献があるかどうか疑問に思っていましたか?

次の例を見てください。

labels outside vs inside input wrapper

どちらのバージョンも同じスペースを取ります。

[〜#〜] addition [〜#〜]:プレースホルダーのことではありません。私の質問は、固定ラベル配置の表示例についてのみであり、ラベルアニメーションへの空想的なプレースホルダーなどはありません。

2
laEm

これは、スキャン能力と期待に要約されます。

通常、ラベルは入力フィールドの外にあるものを示すため、入力フィールドの外にあります。また、目のアンカーとしても機能します。基本的に、フィールドの内側はユーザー用、スペースの外側 )フィールドは、そのボックスの中に何が入るのかを説明するためのものです。

入力フィールド内のプレースホルダーテキストは、デフォルトの回答と間違われることがよくあります。代わりにラベルが中にある場合の混乱を想像してみてください。それは、フィールド内のテキストが会話の一部であると考える人々に帰着します。プレースホルダーのヒントでもラベルでも、そこに何かがある場合、ユーザーは自分の役割がすでに行われていると考えてフィールドをスキップする可能性があります。彼らの目はラベルと空のボックスをスキャンしているので、多くの人々は事前に入力されたように見える入力フィールドを無視します。誰もがこれを行うわけではありませんが、十分にこれを行うことは当然です。

これはプレースホルダーの使用に関する興味深い記事です。 同様の原則がフィールド内のラベルに適用されます。

3
Wendy Wojenka