Highlighting a phone number issue.
A US phone number is usually written as “(509) 359-6200”. But a screen reader will read this as alarge number math equation. Sounding like “Five hundred nine (pause) three hundred fifty-nine minus six thousand two hundred.”
Example One:
509.359.6200
Example Two:
509.359.6200
Example Three:
Example Four:
In the second example, the screen reader will read “509.359.6200” as “five hundred nine (pause) three hundred fifty-nine (pause) six thousand two hundred.” At least it is no longer a math equation, but the numbers read as large singular numbers, not digits.
By adding spaces in the aria-label, this tells the screen reader to read each digit individually, and the period tells the screen reader to pause.
Code:
<p><a href="tel:5093596200" aria-label="5 0 9. 3 5 9. 6 2 0 0.">509.359.6200</a></p>
Now the phone number will be read as “five zero nine (pause) three five nine (pause) six two zero zero.