Find out about best practices when capturing user text input or forms, and providing the right visual indicators when an error occurs.

General rules:

Always show a label and placeholder text. An effective way to combine the two is to animate the placeholder text when the user starts typing. Provide visual feedback when focus changes, for example using a simple border.

Error handling

Use colour and icons to signal errors, display messaging underneath and keep error messages to one line only.