HTML5 Data and Services Cookbook

Telephone input

In this recipe, we will take a look at the input type for telephone numbers. Due to the very different telephone number formats between countries, the phone input does not require any specific pattern, if not explicitly specified. If we are required to have some specific pattern, we can do various types of validations as discussed in detail in Chapter 6, Data Validation.

The main advantage of using a text input type is to be more semantically correct, and as such to bring about more optimization on mobile devices.

How to do it...

As the preceding related recipes, we simply add the input element in the body of the HTML document:

  <form>
    <label>
      Insert phone <input type="tel" >
    </label>
  <input type="submit" >
  </form>

How it works...