Read more

The Current State of Telephone Links | CSS-Tricks

Henning Koch
August 03, 2016Software engineer at makandra GmbH

The linked article Show archive.org snapshot shows what current browsers do when you click a link like this:

<a href="tel:1-562-867-5309">1-562-867-5309</a>

Spoiler: The current state is sad

Illustration UI/UX Design

UI/UX Design by makandra brand

We make sure that your target audience has the best possible experience with your digital product. You get:

  • Design tailored to your audience
  • Proven processes customized to your needs
  • An expert team of experienced designers
Read more Show archive.org snapshot

It's still the case that most desktop browsers can't do something useful with tel: links. They will usually open a dialog confirming that an external application will be opened. If the user confirms, she will see an error, or nothing at all.

On mobile browsers on the other hand, these links just open the internal phone app, which is very useful.

Unfortunately you cannot detect whether a browser will do something useful with a tel: link. Your best options seem to be:

  1. Don't have tel: links and rely on the mobile browsers to automatically link phone numbers (which some do)
  2. Do have tel: links, but only style them (with color, underline) on small screens.
Posted by Henning Koch to makandra dev (2016-08-03 09:02)