How to help users contact a service using a form

Use this pattern to ask users to contact a service using a form.

You can also help users get in touch with a service or place (such as a library) using the contact details pattern.

View an example of the contact form pattern.

Use this pattern when you want to help users complete a contact form. You might use a contact form to help users:

• ask a question about a service
• report something, such as a fault
• make a complaint
• request something, such as a repair

Contact forms are helpful when you need users to submit specific information rather than a generic query. Use the form to ask for all of the information you need to respond to the user's request. For example, if a user wants to make a complaint about a taxi driver, you will need certain details to help you investigate the complaint quickly. These include:

• vehicle registration
• vehicle licence number
• operator name
• driver badge number
• details of the complaint
• the user's contact details

Only ask for information that you need. A form should make it easier for a user to give you this information in one interaction, rather than having to submit multiple forms or emails.

This pattern uses:

• a clear page title to tell the user what action they can take on the page
• body copy to explain what the form is for and what information the user needs before they start
• a green button to link to the form
• body copy to explain what will happen once the user has completed the form

Use your page title to tell the user what they can do on that page. This pattern is always used to help users take action, so make sure your title includes that action. Page titles will appear in search results so they should make sense on their own, regardless of where the user sees them.

Good example: Make a taxi or private hire complaint

Bad example: Taxi complaints

Use body copy to give the user all the information they need before they start to complete the form. This could include:

• explaining what the form is for
• explaining what the form is not for
• any details or information that the user needs to complete the form
• what will happen after the user has submitted the form (for example, whether the user will be contacted once the service has reviewed the form

The user should be able to complete the form in one interaction.

Use a green button to show your users where to start the form. This is called a 'default button.' Avoid using more than one default button on one page, as it can be confusing for users. This pattern is designed to help users complete a single task from one page.

Only use a button where there is a clear interaction or task. Write button text in sentence case, describing the action it will help the user perform:

• starting a service or form, use 'Start'
• contacting a service, use 'Contact'
• paying a bill or invoice, use 'Pay'

We can't add alt text to a button so we need to use text that makes sense for people using screen readers.

Government Digital Services guidance about button text

You might include a telephone number on your page, even if you are asking a user to contact us using a form. Some users might need help to complete the form.

When you offer a telephone contact option, include alternative options such as text relay. The text relay number is usually 18001 followed by the usual landline number but you should check this with your service area.

Always follow our style guide to format telephone numbers.

Use Telephone: 011 111 111 or Mobile:. Do not use Mob:.

Use spaces between city and local exchange. Here are the different formats to use:

01273 800 900

020 7450 4000

0800 890 567

07771 900 900

077718 300 300

+44 (0)20 7450 4000

+39 1 33 45 70 90

When a number is memorable, group the numbers into easily remembered units: 0800 80 70 60.

Always write out email addresses in full. You can add a hyperlink to the address. This can make it easier for some users to open a new email from the link. However, this doesn't work with all email clients or on all devices so you should always write the email address in full. This means that:

• screenreaders can read out the email address
• users can cut and paste the address into their email host, or write it down

Good example: Contact the library service at [email protected]

Bad example: Contact the library service (address is hidden behind hyperlink)

Always use our style guide when creating content for the Buckinghamshire Council website. The style guide helps us to use consistent structure, formatting and language across the site. This makes it easier for users to find the information they need.

The style guide can help with:

• writing page titles and headings
• formatting text and numbers
• making sure your copy is accessible and inclusive

Sometimes, you may be using several different contact forms for similar users, for example, where there are different forms for different areas within Buckinghamshire.

Try to stick to one form and one default ('Start') button per page. The page title should tell people exactly what they can do on that page.

Avoid using accordions to reveal different options. Not all users will notice them or understand how they work.

If you have to include more than one form, make sure your body copy helps the user work out which form they should choose. Use clear headings and consider using the contents panel component to help users find the form they need.

Contact the webteam via ServiceNow if you need to:

• ask a question
• get help with this pattern
• get help with writing content
• make a suggestion for something we need to include in this guidance

You can find more guidance on writing content in the content design resources in the GOV.UK Service Manual.

We are still researching these patterns. If you have any research or suggestions that could help us improve this pattern, tell the Web Team.