HTML 101: How to Create Web Pages With HTML — Episode Seven
In order to allow your website visitors to communicate with you, you need to learn how to create simple forms in HTML. Luckily, we’re on the job and can show you what you need to know when coding web forms.
In this video you’ll learn how to create these HTML form elements:
- Text boxes
- Password fields
- Check boxes
- Radio buttons
- Drop-down selection menus
- Text area boxes; and
- Submit and reset buttons
Supercharge your blog’s earnings with Text Link Ads
Episode Links:
.
Where does the inputted information go once the user clicks ‘Submit’ and how do you retrive that data?
The not so helpful answer is, “it varies.” Some form data is part of a multi-page form process, and if you ever buy something online and look at the location bar on the 2nd page of the ordering process, you will see question marks with text afterwards. That is form data that was passed from the first page of the order form.
Forms, I’ve personally set up ,actually go through a verification process using javascript functions before they were sent. If the form was filled out properly, the data would get set to a program in my website’s cgi directory that would email me the results (formatted the way I wanted to by me tinkering with a txt file prior), and redirect the user to a thankyou page.
If your internet service provider is worth their weight in salt, they should walk you through the whole process while holding your hand, so to speak. If they don’t, ask them to do so.
I hope that helped. Just keep at it and you will master the backend stuff before you know it.
Regards
Shane
Thanks for showing us these multiple tutorials that help out webmasters.
MultiZ, you are most welcome. It’s the thanks like yours that keeps us going and making more Tubetorials. Have you watched all the HTML Tubetorials? Which one was your fav? How did you find them?
If you can’t tell, I’m just curious. 🙂
Keep watchin’, we’ll keep creatin’
Shane
Hey Great tubetorial. Where is the and tag tutorial?
Hello Bob. Glad you liked the Tubetorial. What do you mean by “the and tag”? Get back to me.
Regards
Shane
Awesome stuff man, this is a really great website, very informative and helpful. I do appreciate it! Keep up the great work
Thanks Ben. We’re glad you like the site, and you’re most welcome. Have you done all the exercises and viewed all the episodes? Let us know.
Regards
Shane
I love this site! Very useful, and gave me the kick I need in the butt to start learning some HTML. 🙂
TJ, That’s what we’re here for, my friend; kickin’ butt and getting people motivated to do better online.
Please do all of the steps in all of the html lessons, starting from lesson 1, and let me know how you did.
Regards
Shane
p.s. Nice tunes TJ.
I realize that form buttons is a wide area of functionality, but what about crafting webinars for specific functions?
I am looking for a way to have the form save to a local drive of my choosing. I cannot find any resources on it and am unsure if it can be done.
Hello Steve. That would be a good idea in the future. Hopefully we would be able to do something like that. IN the past if I ever had an advanced coding issue I couldn’t figure out I went to http://www.irt.org. This site is fantastic and can help out with advanced coding issues.
REgards
Shane
Thank you for these wonderful tutorials.
I have been doing each of the HTML lessons and have hit a snag. For some reason I cannot code checkboxes and radio buttons to work. Here is the code I entered, below:
Hobbies:
sports
politics
art
Age:
Under 20
Over 20 Under 40
41 and up
I checked it over several times, but all I get is the info inside a textbox. You help is greatly appreciated.
P.S. Where are the CSS tutorials? I can’t wait 🙂
i want the infomation to besent to my email when ever the send button on my website is clicked.
@Paul: I haven’t viewed the older videos made before I took over as editor, but having written forms that “send to email”, I can answer partly. It depends on what you are using to “drive” the form. That is, the script used in the “action” field of the
Wooooooooohoooooo!!!
I spent days trying to get my contact form to work properly, especially having read PDF tutorial which was a complete waste of my eye and brain usage… and for nothing.
Then I tried googling with “create web form” (should’ve done that at the beginning)…
Huuuuuuuuge thanks to tubetorial (gotta love that name) for solving a simple problem which PDF tutorials couldn’t even put right.
You guys made my day… and gave my braincells a break 😉
Glad to hear it Dominic. Let me know when you post something so I can see your progress.
Hello,
This is a very effective tutorial. And it definitely leaves me desiring more. Could you write a tutorial on CSS, too? I would like to learn to be able to code a basic website using css and html. If you’re not doing that, could you suggest a website that you know of?
Jofssel
Jofssel, I plan on creating some css tuts in the future(don’t know for whom or exactly where they will end up). Until then, you can check out this site. It’s basic, but you will have a firm grasp of the foundations of css afterwards.
http://www.fromthepen.com/web/css/index.html
I want to use the submit form or something else in my website as a comment, what I mean is to give the possibility to every one to leave a comment and submit it on my mail address. Thank you in advance …
I think the video tutorial is very good, but i think as well a text version including all the code would make the tutorial reach its full potential.
This was informative
I need the printed text of the code. The video was very clear
it is my first day to use your website.It is A+++++++++++++ and so help full but i need more help.I creat aform and i would like to know how to make full name field bigger in size,How i can make more attractive ?How can i link the comments field to my email to read the comments?thanks alot for all you do ..you are the greatest bless your heart
I bought html webtemplate from ebay and i dont know how to use them to creat a lovely page.Could you direct me with that?thanks alot for your help
thanks so much for the super advice on this site
Episode 7 is awesome. This tutorial helped me a lot. I usually use http://www.jotform.com to get source code for any form elements I want to create. That’ll will save you some time. But understanding what you are doing is always better!
awww Really cool…Thanks for the Tutorial
hi
i have created a similar contact form…. where once the visiter clicks on the submit button, i should get the details on my email.
could u please help me out with the html tags ?
please
Is there a way to have the inputted information sent to an e-mail address? Thanks.
Thank you! That was an awesome script. I took it and modified it for a client. His site is carolinacustomkitchen.com and your modified script is on his Quote page.
I’m trying to learn more programming and this tutorial was very helpful. Thanks!
hello! i want to creat my owner site web , i need help , and i’m seeking a personne how i can exchange experience by msn or skype and seekingschools in usa or uk for make formation
Thank you !
Dear Sir
I am a
newly customer of small business webhosting.
I have
already created my web form PHP on my web site as below, But problem is
that I
am not receiving Feedback form DATA why? Please solve my problem as soon
as
possible by mail.
My Feedback Form HTML is
Feedback Form
Feedback
Form
Please
fill up below form
E-mail:
Message:
<?php
}
My PHP is (file name: feedback.php)
My thankyou.html
is
Thank you
We are
Obligation with you
Because you take us your valuable feedback to us
Please
continue with us
Clik here for go to
home
My Error Page HTML is
Error
Error
Oops, it appears you forgot to enter either
your
email address or your message. Please press the
BACK
button in your browser and try again.
i loved the the tutorial, my only problem is where does the submitted information go…..please help me