Semantic input types

Selecting the correct input element type greatly increases the ability for users to be able to input information on mobile devices.












Code

<label>Email:</label><input type="email" />
<label>Search:</label><input type="search" />
<label>Url:</label><input type="url" />
<label>Tel:</label><input type="tel" />
<label>Number:</label><input type="number" />
<label>Date:</label><input type="date" />
<label>Week:</label><input type="week" />
<label>Month:</label><input type="month" />
<label>Date Time:</label><input type="datetime" />
<label>Date Time Local:</label><input type="datetime-local" />
<label>Colour:</label><input type="color" />