1. Home
  2. Computing & Technology
  3. Web Design / HTML

Ways to Submit Your Forms - Images and Buttons

Use Images to Submit Your Forms

By Jennifer Kyrnin, About.com

Use an Image to Submit
The submit button in a form can be of type="image" to use that image as your submit button. This type of button acts like an image map and sends the coordinates that were clicked to the server, as well as the name and value of the button.

Using an image for your submit button is a great way to integrate your form seamlessly into your site. You can make your submit button say exactly what you want it to say. It is exactly like an image on your site.

The biggest drawback to using an image as a submit button is how your readers respond to it. It is often not apparent that the image is what should be clicked to submit the form. This is true even for experienced Web surfers.

Usage:
<input name="button name" type="image" src="location of image" alt="image alt text" />

The Button Tag
A new form tag that came in with HTML 4.0 is the <button> tag. This tag allows you to define a submit button that is completely controlled by JavaScript or another client-side scripting agent.

Some of the nice features of this tag are that it can contain content like text and images. The closing </button> tag is required.

If you build a form that you want to require the use of JavaScript, you can use the button tag (with type="button") to submit the form results to a JavaScript validation script (see my article on Form Validation) When the form has validated correctly, then you send the form elements to the CGI.

**** NOTE *****
This tag is only compatible with Netscape 4.0 and I.E. 3.0 and 4.0.

Usage:
<button name="button name" value="submit" type="submit"> <img src="location of image" alt="image alt text"> </button>

Explore Web Design / HTML

More from About.com

  1. Home
  2. Computing & Technology
  3. Web Design / HTML
  4. About.com Web Design A to Z
  5. Web Design Articles R-Z
  6. Web Design/HTML Articles W
  7. Ways to Submit Your Forms - Using Images

©2008 About.com, a part of The New York Times Company.

All rights reserved.