Make the form easy to fill out.
A form is not the place to ask too many questions; it is the shortest bridge between interest and action.
The core principle is to ask as few questions as possible and make each field very clear: one column, labels placed directly above the fields, error messages in place, and only ask for information needed for the current step. Each additional field is another reason for customers to abandon the process, so no field is harmless. For long forms that cannot be avoided, group fields into sections and break steps so customers can feel progress instead of being overwhelmed.
- short contact or registration forms need one column, labels on fields, and minimal questions
- long forms that cannot be avoided should be grouped by section and divided into steps
- Sensitive schools need explanations for why it's necessary and the expected format.
- only use faint placeholder text in the label box, disappearing when typing
- pushing all errors to the submission moment instead of reporting them immediately
A form is the most vulnerable point for customers throughout their journey on the website. Once customers have read through and shown interest, encountering a long or confusing form can lead them to leave without any reason. Sinh Vũ approaches forms from the conversion flow perspective: every unnecessary friction point is a leak, and the design task is to seal those leaks by simplifying, not by adding.
Ask less is the core principle.
Before discussing layout or color, the first question to answer is: does this field really need to be included at this stage? Each additional field adds another small decision for the customer to make, and the total of these small decisions creates a heavy feeling. Sinh Vũ only collects information relevant to the current step: the initial contact form only needs to gather enough to start the conversation, with the rest reserved for later steps when the customer is more committed.
A quick check question for each case: if this information is missing, can you still process the request? If so, don’t ask right away.
Single-column layout and label positioning
A single-column layout helps customers follow a single flow from top to bottom without having to decide where to look. Multiple columns disrupt that flow and can easily confuse the order of filling out, especially on mobile. The only reasonable exception is short fields that are closely related, such as Province and City, which can be on the same line.
Labels must be placed directly on the box, not far away, and not between two boxes. An ambiguous distance between the label and the box makes customers unsure which field the label describes. Additionally, labels need to be tagged correctly in the code for screen readers to read, which is a basic accessibility requirement.
Long forms are unavoidable: Group fields into thematic sections, break them into steps if necessary, and add progress indicators so customers know how far they have to go. Each step should contain information belonging to the same contextual group.
Gather the team and create a sense of progress
For long forms, the issue is not just the number of fields but the customer's perception when looking at it. Grouping related fields into separate blocks (for example: contact information in one block, project information in another) helps customers focus on each part rather than facing a disorganized list. When divided into multiple steps, a simple progress indicator like "Step 2 of 3" informs customers where they are and how much is left, significantly reducing anxiety about length.
Report errors at the right time and place
Consolidating all error messages until the customer clicks send is the worst way to handle form errors. Customers have to scroll back to find each incorrect field, losing their momentum. Error messages should appear right at the field just left, and importantly, should explain how to fix it, not just state what's wrong.
For example: instead of saying "Invalid phone number," write "The phone number must consist of 10 digits, starting with 0." Adding one sentence significantly reduces the number of retries by customers. A technical note: do not only use red to mark errors, as people with color vision deficiencies may not read it; always include explanatory text.
Common mistakes in form design
- Using faded placeholder text as a label: this text disappears when the customer types, causing them to forget what the field is asking.
- How to ask sensitive questions like phone numbers or addresses without explaining why they are needed and what format is expected.
- Multiple column layouts or labels placed ambiguously between two fields create confusion about which field belongs to which label.
- Marking errors with color without accompanying explanatory text makes it unreadable for those who have difficulty distinguishing colors.
- Retain the "convenient questions" fields that do not serve the current step, making the form unnecessarily cumbersome.
Reduce the number of guesses customers have to make, providing template formats and reasonable default values to ease their thinking.
Nielsen Norman Group, 4 Principles to Reduce Cognitive Load in Forms
The viewpoint of Sinh Vũ
A form is the bridge between interest and action. Customers step onto the bridge because they want to cross, not because they enjoy walking. The bridge's task is to get people to the other side as quickly as possible, not to add obstacles along the way. Sinh Vũ designs request forms with this spirit: guiding customers through clear steps instead of placing a long form at the beginning, as customers are in the consideration phase and need more reasons to continue, not additional reasons to stop.
Decision checklist
Topic: How to create forms that are easy to fill out. Sinh Vũ guide, sinhvu.com
Select each item you find appropriate, then print or save as PDF to take with you.
If you have marked most of the signs above, this is the time to discuss in more detail. Sinh Vũ can help you review and propose a direction.
References
Nielsen Norman Group, Website Forms Usability: Top 10 Recommendations; Nielsen Norman Group, 4 Principles to Reduce Cognitive Load in Forms; Sinh Vũ's practical design experience.
Frequently asked questions
Can you use faded placeholder text instead of a label?
Do not use placeholders instead of labels. That faded text disappears as soon as the customer starts typing, causing them to forget what the field is asking and making it easy to fill in incorrectly. Labels need to be permanently displayed right on the field, not inside it.
What are the minimum fields needed in a contact form?
Depending on the purpose, but generally, you only need a name, one contact channel (email or phone number), and the content to be discussed. More detailed information such as project scale or budget can be gathered later when the client is more committed.
How to handle a long form so that customers don’t abandon it midway?
Group related fields into clear categories and consider breaking them into multiple steps with progress indicators. This approach helps clients see where they are heading instead of looking at a long, unclear list. Each step should only contain information related to a single topic.