tel: and sms: links in HTML: syntax, extensions and iPhone vs Android differences
tel: and sms: links turn a phone number into a one-tap action. They are simple, but they have compatibility details worth knowing.
Call link
<a href="tel:+13051234567">Call (305) 123-4567</a>
- The
hreftakes the number in international format, with + and the country code. That way it works even if the person is in another country. - The visible text can use the local format your audience recognizes.
- Inside the
href, hyphens are allowed as separators (tel:+52-998-123-4567), but spaces are not.
Extensions and pauses
To dial an extension after the switchboard answers, add one comma for each pause of about two seconds and then the extension:
<a href="tel:+525512345678,,123">Call sales (ext. 123)</a>
The standard also defines the ;ext=123 form, but commas are what works best in phone dialers.
Link to send an SMS
<a href="sms:+13051234567?&body=Hi%2C%20I%27d%20like%20some%20information">Send SMS</a>
The historical difference between systems is in how the number is separated from the message:
| System | Traditional form | Form compatible with both |
|---|---|---|
| Android | sms:+52…?body=Hola | sms:+52…?&body=Hola |
| iPhone | sms:+52…&body=Hola | sms:+52…?&body=Hola |
The ?&body= combination is the one QLinky uses because it works on both. Even so, test the link on both systems if you can: the behavior also depends on the messaging app installed.
What happens on a computer
A tel: link on a computer opens whichever application is registered for calls: FaceTime on a Mac, or video calling and phone-link programs on Windows. If there is none, nothing happens. The same goes for sms:.
That is why it's a good idea to always show the number as text, and not just an icon.
Good practices
- Say what will happen. “Call now” is clearer than a bare number.
- Large tap area. On a phone, a button at least 44 pixels tall avoids missed taps.
- Opening hours in view. If you only answer during certain hours, put them next to the button.
- Automatic detection. Phones often turn anything that looks like a phone number into a link. If it converts numbers that aren't (product codes, for example), on iPhone you can turn it off with
<meta name="format-detection" content="telephone=no">and link the real numbers by hand. - Social networks: most profiles only accept http or https links, so
tel:andsms:don't work there.
Try it now
Generate your link for free, with no sign-up and without your data leaving the browser.
Click-to-call link generator (tel:)SMS link generator with message