Top menu

Creating Website Forms

Creating Website Forms

Adding Forms to Your Website

I wanted to create another free competition on my website so I had to bite the bullet and develop a working form. So I’ve finally broken through the mental barrier of working with forms for my website. I thought I’d share some lessons learnt.

Yes, you do need to be able to read HTML code and be able to edit it. I did a one day course in it years ago so I could read and edit it well enough to troubleshoot so I could fix problems but I’m not so good that I can write an entire site in it. I learn better via courses, some learn better through magazines and books – whatever suits you best.

Being about to read and edit HTML is enough to create and tailor a form.

I create my website in Dreamweaver because it is easy to use and creates cleaner code than Frontpage. I’ve created my forms to send through the information via emails so the code details here relate to a simple brochure site using email forms (this means when people visit my site and complete/submit a form the form content is emailed to me).

To create the form using Dreamweaver I used the Object tool to insert the form, created a table within the form to layout the fields cleanly, entered and named the fields I wanted, added customised Submit and Clear buttons and then created an email account for the form content to be sent to.

I contacted my website host provider (Ezihosting) for specific information about the code needed for the Action field and the hidden fields. Paul sent through the code and some additional tips. Once the initial testing bugs were sorted I was able to create various forms for the site.

Whatever developer tool (eg. Dreamweaver) you are using your need some basic form requirements.

Each form needs:

A form name, eg. customer_feedback for a form that collects feedback from customers – something logical

Method field – how will the form be sent, eg. post

Action field – you’ll need to get this information from your webhost provider. This will be either listed on their site or you can email them asking them for this information.

Specific form fields – these are determined by what information you want to collect, eg. first_name, surname, comments, radio buttons etc. Name these fields logically so you can easily read the information when it comes back to you in the email.

Submit and Clear fields – you can set the text that displays in the buttons to what best suits you. Personally I don’t like “Submit” or “Clear” and rather have something more informative and friendly.

Hidden fields – these aren’t shown on the website but come through in the email with the form contents. For example you can set the email subject line to a message that makes sense to you, say the subject line in the email could read “Feedback Form” for a feedback form.

Form Reply Pages – this is the page the visitor is sent to after completing the form and it is important to have good content on these pages – help your site visitors keep touring around your site and interested. Many form reply pages are wasted and they may say thank you for the submission but they don’t encourage more movement within the site. The Recipient hidden field is your form reply page address so make sure the entire webpage address is entered: http://www.yoursite.com/form_reply.htm .

Testing – it is really important to test you forms to make sure they work.

So if you want to check out the forms I’ve been working on visit:

Free Online Competition – Win Beautiful Jewelry for Your Clever Words!

Jewelry Party Testimonials

Creatively Belle Testimonials

Feedback Form

So working with forms isn’t so hard after all! Once you get the initial learning curve sorted it is easy to make communicating with your customers streamline!

See the Creatively Belle Blog for More Free Website Tips!

Site design and development by Crimson Pear