Add a contact form to your website that actually delivers: pick the minimum fields, label them accessibly, handle errors and spam, prove a test enquiry reaches your inbox, and choose between built-in and embedded form tools.
<p class="lead text-xl text-[#3a3a3a] mb-8"> A contact form on a website lets visitors send you a structured message without opening their email app, and keeps your address away from spam bots. Adding one takes five decisions: which fields, how they are labelled, what happens on submit, how spam is stopped, and where the messages go. The last one is where most forms fail, so this guide ends with a test you should run on every form you publish. </p>
<h2>1. Choose the minimum enquiry fields</h2> <p>Ask only for what you need to reply usefully. Every extra field is one more reason to give up. A good default:</p> <ul> <li><strong>Name</strong> (one field, not first/last)</li> <li><strong>Email</strong> (or phone, if you reply by phone)</li> <li><strong>Message</strong></li> </ul> <p>Add a field only when it changes how you reply. Worked example for a made-up cleaning company, "Brightside Cleaning":</p> <table> <thead><tr><th>Field</th><th>Keep?</th><th>Why</th></tr></thead> <tbody> <tr><td>Name, email, message</td><td>Yes</td><td>Needed to reply</td></tr> <tr><td>Postcode / ZIP</td><td>Yes</td><td>Tells them straight away if the address is in their area</td></tr> <tr><td>Service type (dropdown)</td><td>Yes</td><td>Routes regular vs one-off vs end-of-tenancy quotes</td></tr> <tr><td>Phone</td><td>Optional</td><td>Some customers prefer a call; do not force it</td></tr> <tr><td>Company, job title, "how did you hear"</td><td>No</td><td>Not used when replying to a home cleaning quote</td></tr> </tbody> </table>
<h2>2. Consent and accessible labels</h2> <ul> <li>Every field needs a visible label. Placeholder text alone disappears when people type and is poorly supported by screen readers.</li> <li>Connect labels to inputs (<code><label for="email"></code> with a matching <code>id</code>) so tapping the label focuses the field.</li> <li>Use the right input types (<code>type="email"</code>, <code>type="tel"</code>) so phones show the right keyboard.</li> <li>Mark required fields in text, not colour alone.</li> <li>Say what you will do with the details, and link your privacy policy. If you want to add people to a mailing list, use a separate unticked checkbox; do not bundle it into sending the enquiry. Privacy rules differ by country, so check what applies to you. Our <a href="/tools/privacy-policy-generator">privacy policy generator</a> can help you draft a policy.</li> </ul> <pre><code><label for="email">Email (required)</label> <input id="email" name="email" type="email" autocomplete="email" required></code></pre>
<h2>3. Submission, errors and spam</h2> <ul> <li><strong>On success:</strong> show a clear message on screen ("Thanks, we reply within one working day") and keep the promise you make there.</li> <li><strong>On error:</strong> say which field is wrong and how to fix it, next to that field, and keep what the visitor already typed.</li> <li><strong>Double submits:</strong> disable the button while sending.</li> <li><strong>Spam:</strong> start light. A hidden "honeypot" field that humans never fill catches many bots with no effort for real visitors. Add a challenge such as reCAPTCHA or Cloudflare Turnstile only if spam continues.</li> </ul>
<h2>4. Prove a test enquiry reached the chosen inbox</h2> <p>A form that looks fine but delivers nowhere is common: wrong address, messages filtered as spam, or an embed that was never connected. After publishing, run this test and write the result down:</p> <pre><code>CONTACT FORM TEST Page tested (live URL): Sent at (date/time): Test name used: TEST - [your initials] - [date] Delivered to inbox: [address] Arrived? In spam? yes/no / yes/no All fields came through correctly? yes/no Tested on phone too? yes/no Reply-to works (reply goes to the visitor)? yes/no</code></pre> <p>Repeat the test whenever you change the form, the destination address or your email provider.</p>
<h2>5. Built-in forms vs embedded form tools</h2> <table> <thead><tr><th>Option</th><th>Good for</th><th>Watch out for</th></tr></thead> <tbody> <tr><td>The website builder's own form</td><td>Simple enquiries; one less account to manage</td><td>Check where submissions are stored and emailed</td></tr> <tr><td>Embedded form service (e.g. Google Forms, Typeform, Jotform, Tally)</td><td>Multi-step forms, file uploads, logic</td><td>Styling may not match; extra script weight; check each provider's current plan limits</td></tr> <tr><td>Custom code posting to your own server</td><td>Full control, CRM integrations</td><td>You maintain spam protection and delivery</td></tr> </tbody> </table> <p>Whichever you choose, put the form where the decision happens: the contact page, the end of each service page, and a short version in the footer or homepage.</p>
<h2>Adding a form with We.Inc</h2> <p>In the <a href="/website-builder">We.Inc website builder</a> you can describe the form you want in plain words (for example "a quote form with name, email, postcode and service type") and then adjust labels and layout with click-to-edit. AI building needs a paid plan, from Starter at $20/month (<a href="/pricing">pricing</a>); the Free plan covers up to 3 template sites on a we.inc address. Whatever you build with, run the delivery test above before relying on the form. Then check the page with the <a href="/tools/website-grader">website grader</a>, browse <a href="/website-templates/business">business templates</a>, or estimate costs with the <a href="/tools/website-cost-calculator">website cost calculator</a>.</p> <p><a href="https://my.we.inc/signup">Start building your business website</a></p>
As few as you need to reply usefully. Name, email and message is a good default; add a field only if it changes how you respond, such as a postcode for a local service area.
The usual causes are a wrong destination address, messages landing in spam, or an embedded form that was never connected. Send a clearly labelled test enquiry and check the inbox and spam folder.
Not always. A hidden honeypot field stops many bots without bothering visitors. Add a CAPTCHA-style challenge only if spam keeps getting through.
It helps visitors who prefer email. Expect some extra spam if the address is shown in plain text.
We.Inc is an AI-powered website builder you can resell under your own brand. Launch a branded client dashboard, bill on Stripe Connect, and deliver AI-generated websites in minutes. White-label plans start at $99 a month for 25 client sites, with a 7-day free trial and no per-site fees.