Placeholders are supposed to clarify what information users need to enter and increase the form completion speed. Unfortunately, many people confuse placeholders with real data filled in by default.

Plus, if placeholders substitute labels, they disappear after users place the cursor in the input. If they get distracted at this time, they will need to shift their focus away from the input to display the placeholder text again.^[1] If placeholders are so tricky, how can we use them to help users prevent errors?

Input masks are an excellent solution when formatting matters (for things like phone numbers or dates). Besides displaying the desired input format, they also automatically apply it to users' input as they type. This tool reduces cognitive load and confusion, so users don't need to worry and double-check if they have typed everything correctly.