13 New Input Types in HTML 5

ShareThis
As we all know, HTML is a markup language which we use to present structured content to the outside world. The latest version of HTML - HTML 5 has introduced some new elements that helps in the usage of modern websites. There are 13 new input types in HTML 5. Let's discuss these input types in detail.

There are numbers of input types in HTML5 like color chooser,spinner ,sliders, pop-up calendars etc. Here we will take a look on them.

The first input field I will talk about is email addresses.

Try it-

HTML Input Tags

- Web Addresses:

The next input field we will look at, is web addresses. If someone ask for a URL, the syntax of a web address will be constrained by the relevant Internet standards.

Try it-

HTML Input Tags

- Numbers as Spinboxes:

Next one is numbers. It is the most problematic of all the values to get is numbers. You have to do a lot of jQuery to make sure that you validate this field. HTML5 adds only type number.

Try it-

HTML Input Tags

Input fields should be consist of value from a range of numbers and for these input fields range type is used which is displayed as a slider bar.

Try it-

HTML Tags

- Date Pickers

Date picker control was not included in HTML4. JavaScript frameworks have picked up the slack (Dojo, jQuery UI, YUI, Closure Library), and it required “buying into” the framework on which the date picker is built.

Finally HTML5 gives a different idea to include a native date picker control and you don't have to script it yourself. In fact, it defines six: date, month, week, time, date + time, and date + time - timezone.

Date picker supported by opera...,

HTML Tags

- Search

As a type for input boxes search has been added in HTML5. This is minor and cool change for some users.

HTML Input Tags

- Color Pickers

Type color is also defined in HTML5. It lets you pick a color and then returns the hexa-decimal value. Opera 11 is the only browser that supports this type.

HTML Tags

- Form Validation

Addition of form validation is the most amazing feature HTML5. Especially in Ecommerce website form validation plays a vital role, as this can offer secure form submissions and safe online transactions as well.
Total votes: 175



`