Most web designers rely on inquiries from their portfolio website to produce a decent portion of their business. Contact forms can be very simple, collecting a name and contact information, or they can be much more detailed, providing enough information to get an estimate. While the primary purpose of the contact form on our website has always been to make it easy for potential clients to contact us about web design projects, there are also a number of other reasons that visitors use the contact form and a one-size-fits-all approach has its drawbacks. We recently changed the contact form to include some conditional fields that make the form more customized according to the reason the visitor is contacting us, and in this post we’ll go through the process of creating this type of form.
The form we’ll be creating will contain some basic fields (name, email, phone, website, and message) that are shown to all visitors who are filling out the form, but based on the reason they are contacting us they will also see a few other more specific fields. If the visitor selects “Web Design Services” as their reason for contacting us they will be prompted to tell us if it is a new website or a re-design, enter a budget, and tell us how they found us. If they select “Content Development Services” they will also be prompted to enter a budget, but with different options than the budget for web design services, and so on.
In the past our contact form has included a field to allow visitors to select a budget, but that was based on the assumption that they were contacting us regarding web design services. Since the budget field isn’t applicable for someone who is filling out the contact form just to say hi, this “advanced” form will only show what is relevant based on user input.