How to Create Your First Web Form (Tutorial)

Kinds are sometimes an integral a part of a purchaser’s journey, and most corporations already use net kinds as a part of their advertising and marketing technique.

Actually, 74% of companies use web forms for lead era, and 49.7% say their online forms are their highest converting lead era device.

Kinds can range drastically in function — you may use a kind to get extra sign-ups to your electronic mail publication, gather electronic mail addresses to ship coupons and particular provides, create gated content material for viewers, or enable results in sign-up totally free variations of your product.

Finally, a kind is commonly the quickest and best alternative so that you can gather leads and nurture them into gross sales.

However making a kind can really feel like a tough endeavor, notably since a kind’s design can have a significant affect on whether or not a customer fills it out, or abandons your website altogether.

Right here, we will dive into the way to create your first net kind to get you began.

How one can Create a Internet Type

For our functions I’ll present you the way to create a kind in HubSpot’s free form builder, however you possibly can additionally use Google Forms, WordPress, HTML, or one other device of your alternative.

1. To start creating your kind inside your HubSpot account, go to “Advertising and marketing” > “Lead Seize” > “Kinds”.

2. Within the higher proper, click on “Create kind”.

3. Within the left panel, click on “Common kind”. Then click on “Subsequent” within the prime proper.

4. Choose Clean template to begin with a clean kind, or a pre-made template for a selected use case. As soon as you have chosen your template, click on “Begin”.

5. Right here, you might have the choice to drag-and-drop any components on the left aspect that you simply’d like in your kind. Usually, though not always the case, shorter kinds carry out higher, so attempt to solely ask for probably the most essential data out of your kind recipients.

6. As soon as you have chosen your required kind fields, click on “Possibility” on the prime center of the display. Right here, you’ll be able to resolve what message you need your recipients to see after they full the shape.

7. Lastly, click on “Fashion & preview” on the prime proper of the display to preview how your kind will look on desktop, pill, and cell. Moreover, you can also make some modifications right here to the model of your kind — as an example, selecting a spherical or sharp-edged “Submit” button, or altering the colours and fonts of your kind.

Whenever you’re prepared, click on “Publish” on the prime proper of your display.

8. When you click on “Publish”, you may see this pop-up. Copy and paste the code into your web site to embed the shape onto one in all your net pages, or share the hyperlink with recipients by way of electronic mail.

Whereas we created this type utilizing HubSpot’s free online form builder, there are different kind constructing instruments at your disposal — check out 21 of the Best Form Builder Tools for 2019 for a whole checklist.

Moreover, take a look at Form Design Best Practices: 15 Tips to Boost Conversions and UX to make sure your kind is prepared for optimum conversions.