In addition to new tag elements in HTML5 the input element has been extended with new types and attributes. Although these changes are not fully supported across all browsers they can still be added if desired to your existing websites.
New input attributes
New input types
The greatest thing about the input element is that if it doesn’t recognize the type (e.g. the browser doesn’t support the type) then it will default back to a text input field. That means that if you want to use any of the new input types like search and email then you can do so without worrying about missing form fields.
In HTML5 it was decided to add a search type input. As you all know in your web pages you typically use a normal text type input for your search forms. However it was decided that the new search type should be added so browsers could add additional functionality to them to match the browsers search functionality. What this means is that each browser can do what they want with the field including changing the style to match the browser’s search so that it no longer is consistent with the rest of your web page.
URL & EMAIL Input
Both URLs and emails are strings that conform to respective Internet Standards. To make validation consistent and easier for developers the url and email type input elements have been added. The purpose of these fields is to verify and restrict the inputted data so only valid information is sent back to the server. However this validation would be performed at the browser level and if you are verifying other fields you will end up having to manage multiple error messages to the user which could be confusing to them.
Sliders and Spinboxes
Calendar and Color Pickers
I understand that HTML5 is taking the first steps in expanding the common functionality of the web and it’s browser, however to make these new elements a viable choice for web developers/designers more specifications need to be detailed in how a browser is to behave. For example if you have a web form that is styled to match your site and the browser displays search input that doesn’t match your site then it won’t be used, same with calendars and color pickers. A good start definitely but don’t expect to see these elements commonly used for a while to come.
Comments & Questions
Add Your Comment