Please Encode HTML Phone Numbers in E.164

Please encode HTML phone numbers in E.164

My PPC Manager leant over the desk, looking a bit annoyed, and said:

“You need to use E.164 for encoding phone numbers!”

I asked him which format that was.

“It’s the format where you start with the country code, strip out the first zero, then add all the rest of the numbers with no hyphens, no dashes, no nothing.”

OK, I said, why?

“Because Google Ads was rejecting the current number encoding system we were using which wasn’t far off E.164 but, just to comply, let’s do it.”

We did it.

As soon as we changed the numbers to E.164… they still errored. It was a bug in Google Ads by the look of things, but later (in the next few days, IIRC!) it eventually accepted the numbers and we never experienced the issue again.

Whilst I’d been using a slightly different format, and Google had even validated the use of it in a dev post somewhere, I decided we’d pivot there and then and change our former best practice.

Why Should You Encode Phone Numbers in HTML?

Easy. Ever been to a website where you read the blurb, like what they say, and then go to call the company? Why doesn’t the phone number allow me to click and call?

How frustrating!

When you make every phone number a link so that it can be clicked and the user can make a call, that’s a good user experience (UX). So do it. Even if the majority of your users are on desktop – do it, because telephone links can be opened in Skype and Teams on desktop devices.

How Do You Encode Phone Numbers in HTML?

Simple. Use the anchor tag. Like this…

<a href=”tel:+441234567891”>01234 567 891</a>

Notice that we removed the zero from the area code and compacted the number so that there are no spaces? That’s the E.164 format.

01234 567 891 becomes +441234567891

Sure, it’s not as easy to read in HTML format than the way I used to encode it, with hyphens at strategic places, but that’s not E.164

Another valid way to display the link text is like this:

<a href=”tel:+441234567891”>+44 (0) 1234 567 891</a>

That’s how you’d make the number visually correct for international users.

Why Should You Encode HTML Phone Numbers as E.164?

The E.164 phone number format is an international standard. It is recommended for websites to use this format for several reasons:

Global Compatibility: E.164 ensures that phone numbers are recognised and dialled correctly from anywhere in the world. This is particularly important for websites that cater to an international audience.

Data Accuracy: Using E.164 helps to avoid ambiguity and errors when storing or processing phone numbers. It provides a consistent and unambiguous format for all phone numbers. You’ll appreciate that when you have to analyse reams of phone number data in a massive spreadsheet.

Improved User Experience: When users enter their phone numbers in E.164 format, it reduces the chances of incorrect input and makes it easier for your website to validate and format the numbers correctly.

Integration with Telephony Systems: E.164 is the standard format used in telephony systems, making it easier for websites to integrate with services like SMS gateways, VoIP providers, and call tracking systems.

Accessibility: E.164 numbers are easier for screen readers and other assistive technologies to interpret, improving accessibility for users with disabilities. With the European Accessibility Act (EAA) coming into force in 2025, you should start making your websites accessible right now!

If you want to know more about E.164 take a look over on Wikipedia.

How NOT to encode Your Phone Numbers

I used to encode my phone numbers like this. It is not E.164 but it’s close. The code is readable and it works on mobiles and desktops. I started doing this years ago when my mobile stopped allowing me to click and call any other formats.

<a href=”tel:+44-1234-567-891”>01234 567 891</a>

Also, this is not good and is probably the most common mistake I see being made. The reason why this style is not acceptable is that quite often HTML renderers substitute the space for the HTML character %20 so often you’ll end up with a corrupted, unusable number:

<a href=”tel:01234 567 892”>01234 567 891</a>

There’s one more way I’ve seen telephone numbers marked up in HTML and this also fails:

<a href=”01234 567 891”>01234 567 891</a>

Forgetting to place tel: at the beginning of the string will force the anchor to be interpreted as an HTTP address and it will fail.

If you see your phone numbers encoded like this, just go in and change them to the E.164 format and then test them to make sure.

Conclusion

E.164 has been the recommended format for international phone numbers for a long time. The benefits of using E.164 in HTML phone number links make it a best practice for any website that deals with phone numbers, especially those with an international reach.

In summary, using the E.164 phone number format on websites is crucial for ensuring global compatibility, data accuracy, improved user experience, seamless integration with telephony systems, and enhanced accessibility.

If you need a website or SEO audit and your phone numbers checked and changed, call us on 01252 692 765 or get in touch via the contact form and we’ll help you to encode HTML phone numbers in E.164

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top