A Simple Web Form

In this Blog, you should be able to;

-understand the importance of form in a web page;

-describe the potential uses of web pages forms; and

-write the HTML for basic web form elements.

One of the most important features of a good web design is the creation of forms. When a website established a relationship between the user and the web publisher, forms are responsible for the exchange of information.

Every website, whether for a personal, business, educational, or entertainment purposes, it has some way to make their users contact them. Most of it is by filling out a form. In this way, they can gather information that the users would input, and in return, give feedback and responses. Forms are especially common on the World Wide Web because the HTML language has built-in codes for displaying form elements such as text fields and check boxes.This lesson will focus on creating a simple web page form.

WHAT IS FORM?

             A Form is a formatted document containing blank fields that users can fill in the data. It is made up of one or more fields that will allow the users to enter information such as text fields, text area fields, drop down menus, radio buttons, check boxes,etc.It is a block-level element in the HTML. It begins with the opening <form> tag and ends with the closing </form> tag. 

There are Six(6) Simple Steps on Creating a Simple Form:

1. Open Notepad

2. Type the following markup:

             <!DOCTYPE html>

               <html lang="en">

                       <head>

                            <title> A Simple Form</title>

                       </head>

                       <body>

                       <h1> A Simple Form

                       <form method="get"action="simpleform.com">

                       <p>

                            <label for="yourname">Enter your name:</label>

                            <input type="text" name="yourname" id="yourname">

                       </p>

                             <p><input type="submit"/></p>

                       </form>

                       </body>

              </html>

3. Save this as simpleform.html

4. Test it on a browser

5. On the browser, enter your name in the text input and click the Submit button.

6. The page should reload with your name disappearing from the text box, and if you look in the address bar, you will see that the data you entered has been added to the address for the page. It should look similar to the one on the next page.

Sample Output: