Jack Barber / Website Design

Website Telephone Numbers Not Displaying on iPad/iPhone

A client contacted me this week requesting a few minor ammendments to their website.  Amongst a couple of text and image alterations was a comment about being unable to view their contact telephone numbers on an iPad (and iPhone).  I'd never come across this problem before - there's nothing unusual in the styling of their website, but for some reason, the telephone numbers appeard to have disappeared.

Actually, the iPad's was applying some built-in styling to the numbers, which was turning the text white, preventing it from being read.  iPads automatically highlight telephone numbers, enabling you to quickly add them into your iCloud Contacts list and so on - but for some reason it sometimes changes the styling without notice.

After a bit of Googling, I came across the following solutions, which needs adding into the <head> section of any page on which you don't want iPads to automatically highlight telephone numbers:

<meta name="format-detection" content="telephone=no">

This doesn't seem to be a problem on every site - but if you notice this issue, adding the above meta tag should solve it.