Home
Forms - Do you indicate which fields are required and validate them?
  v1.0 Posted at 5/12/2014 6:35 AM by Tiago Araujo

Always indicate which fields are required. Users get frustrated when they experience a wasted trip to the server, just because they did not get an obvious indication of what was required first time around.

Bad example of Web Sites Required Fields
Figure: Bad example - No visual indication for required fields when a user first sees the form

A designer will know the best way to indicate required field depending on the layout. However if you are in doubt and don’t have a designer around, a red asterisk is definitely the best option.

Use a simple asterisk character
Figure: Good Example - A visual indication of what fields are required (use a red asterisk if you are not a designer)

More Information

You should combine these visual indicators with appropriate client and server side validators to make sure that your data conforms to business requirements. Adding a RequiredFieldValidator to the above textboxes gives you data validity check with minimal coding.

<asp:Textbox runat="Server" ID="email" />

Figure: Bad Example - No validator used, so the user won't know the email is required

<asp:Textbox runat="Server" ID="email"/>
<asp:RequiredFieldValidator runat="Server" ControlToValidate="email" ErrorMessage="Please enter an email address"
ID="emailReqValidator" />

Figure: Good Example - an ASP.NET validator in use, to indicate the fields required

Note: For ASP.NET Dynamic Data although validation is done differently (under the covers it is using a field template + the ASP.NET validator).​

Related rules

    Do you feel this rule needs an update?

    If you want to be notified when this rule is updated, please enter your email address:

    Comments:

    Note: Social Media login for Yotpo is not working in IE or Safari, please use Chrome. We are waiting for Yotpo to fix it.