<meta name="format-detection" content="telephone=no"> Missing on Pages with Numeric Strings
Issue No: 111
Category: Html Head Tags
Issue type: Issue
Priority: Critical
Description
iOS Safari and some Android browsers automatically convert numeric strings that resemble phone numbers (e.g. order IDs, prices, product codes, zip codes) into clickable telephone links by wrapping them in <a href="tel:...">. This behaviour — called auto-detection — can corrupt the visual layout of product, pricing, and checkout pages. The <meta name="format-detection" content="telephone=no"> tag disables this behaviour globally for the page. Missing it on pages with numeric strings risks layout breakage for mobile users.
How do we capture it
-
Detect the page type based on URL patterns and on-page signals:
- Ecommerce signals:
/product/,/item/,/checkout/,/cart/,/pricing/,/shop/ - Numeric density signals: >5 numeric strings that are 6–15 digits long and not wrapped in
<a href="tel:">(potential false-positive candidates). - Contact signals:
/contact/,/about/,/support/, page contains<a href="tel:...">links.
- Ecommerce signals:
-
Check for the meta tag in the page
<head>:- Look for
<meta name="format-detection">. - Extract the
contentattribute value. - Normalise to lowercase; check if
telephone=nois present in the value.
- Look for
-
Validate the
contentattribute format:- Valid values:
telephone=no,address=no,email=noand combinations thereof. - Flag any value that does not follow the
key=valuepattern or contains unrecognised keys.
- Valid values:
-
Detect false-positive numeric strings:
- Extract page text content (strip HTML).
- Use a regex pattern to identify numeric strings of 6–15 digits that are not already inside
<a href="tel:...">tags. - Record
has_numeric_false_positives = trueif ≥3 such strings are found.
-
Check for explicit
tel:links on contact pages:- On pages classified as contact pages, check whether
<a href="tel:">links exist. - If format detection is disabled on a contact page that has no explicit
tel:links, flagdetection_disabled_on_contact_page = true.
- On pages classified as contact pages, check whether
What to store
| Field | Type | Comment |
|---|---|---|
site_id | integer | FK → sites(id) |
page_id | integer | FK → pages(id) |
page_type | text | Classified page type (e.g. product, pricing, checkout, contact) |
meta_present | boolean | Whether <meta name="format-detection"> exists in <head> |
raw_content_value | text | Raw content attribute value; NULL if tag absent |
telephone_detection_disabled | boolean | Whether telephone=no is set in the meta tag |
is_valid_format | boolean | Whether the content attribute follows valid key=value syntax |
has_numeric_false_positives | boolean | Whether ≥3 unlinked 6-15 digit numeric strings were found in page text |
numeric_string_count | integer | Number of candidate false-positive numeric strings detected |
has_explicit_tel_links | boolean | Whether the page contains <a href="tel:"> links |
is_contact_page | boolean | Whether the page is classified as a contact/support page |
detection_disabled_on_contact_page | boolean | Whether detection is disabled on a contact page with no tel: links |
checked_at | timestamp | When this check was last performed |
Condition for trigger
The following rules evaluate stored fields and produce diagnostics in the audit report.
-
Trigger Rule 1: Missing Tag on Page with Numeric False Positives (Ecommerce)
- Target Field:
meta_present,has_numeric_false_positives,page_type - Evaluation Logic:
meta_present = false AND has_numeric_false_positives = true AND page_type IN ('product','pricing','checkout','cart') - Severity: CRITICAL
- Diagnostic Message: "
[numeric_string_count]unlinked numeric strings were detected on this[page_type]page that iOS Safari may auto-detect as phone numbers, corrupting the layout. Add<meta name=\"format-detection\" content=\"telephone=no\">to the<head>to disable auto-detection."
- Target Field:
-
Trigger Rule 2: Missing Tag on Page with Numeric False Positives (General)
- Target Field:
meta_present,has_numeric_false_positives - Evaluation Logic:
meta_present = false AND has_numeric_false_positives = true AND page_type NOT IN ('product','pricing','checkout','cart','contact') - Severity: WARNING
- Diagnostic Message: "
[numeric_string_count]unlinked numeric strings were detected on this page that iOS Safari may auto-detect as phone numbers. Consider adding<meta name=\"format-detection\" content=\"telephone=no\">if the numbers are not intended as phone links."
- Target Field:
-
Trigger Rule 3: Invalid
contentAttribute Format- Target Field:
is_valid_format - Evaluation Logic:
meta_present = true AND is_valid_format = false - Severity: WARNING
- Diagnostic Message: "The
<meta name=\"format-detection\">tag has an invalidcontentvalue ([raw_content_value]). The correct format istelephone=no(with optional additional comma-separated pairs such astelephone=no, address=no)."
- Target Field:
-
Trigger Rule 4: Detection Disabled on Contact Page Without
tel:Links- Target Field:
detection_disabled_on_contact_page - Evaluation Logic:
detection_disabled_on_contact_page = true AND has_explicit_tel_links = false - Severity: WARNING
- Diagnostic Message: "Telephone auto-detection is disabled on this contact page, but no explicit
<a href=\"tel:\">links were found. If the page displays a phone number for users to call, mark it up as<a href=\"tel:+1234567890\">to ensure it remains tappable on mobile, then disable auto-detection for non-phone numbers."
- Target Field:
-
Trigger Rule 5: Sitewide Tag Present but No
tel:Markup- Target Field:
telephone_detection_disabled,has_explicit_tel_links,is_contact_page - Evaluation Logic:
telephone_detection_disabled = true AND is_contact_page = true AND has_explicit_tel_links = false - Severity: WARNING
- Diagnostic Message: "This contact page has
telephone=noformat detection disabled but contains no<a href=\"tel:\">links. Any phone numbers displayed on this page are not tappable. Use explicittel:links for phone numbers you want mobile users to tap, then disable auto-detection for numeric strings that are not phone numbers."
- Target Field:
Sources
- Apple Safari HTML Reference — format-detection: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
- MDN —
<meta>name attribute: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta/name - Google — Mobile-Friendly Pages: https://developers.google.com/search/docs/crawling-indexing/mobile/mobile-sites-mobile-first-indexing
- WHATWG — Phone number links: https://html.spec.whatwg.org/multipage/links.html#telephone-links
- RFC 3966 — The
telURI: https://www.rfc-editor.org/rfc/rfc3966 - WebKit Bug Tracker — format-detection: https://bugs.webkit.org/show_bug.cgi?id=7709
Long description
iOS Safari (and older Android browsers) include a feature called "format detection" that scans page text for strings that look like phone numbers and automatically wraps them in <a href="tel:..."> links. This behaviour is intended to improve usability on mobile: if a page displays a phone number, users should be able to tap it to call. However, the auto-detection algorithm is not precise and false-positives are extremely common.
What iOS treats as a phone number
The detection heuristic looks for numeric strings of roughly 7–15 digits, optionally with spaces, dashes, dots, or parentheses. Examples of strings that are commonly mis-detected:
- Order numbers:
ORD-20240315-001234(the trailing digits trigger detection) - Product codes / SKUs:
1234-5678-90 - Price strings in certain locales:
1.299,00 - Zip/postal codes combined with suffixes:
90210-4567 - Date strings in dense formats:
20241231 - Discount codes:
SAVE20241231
When these strings are auto-detected, Safari wraps them in a blue underlined <a href="tel:..."> link. On product pages or checkout flows this can:
- Break table layouts (link takes up extra space).
- Trigger unexpected call dialogs when users tap numbers they intended to copy.
- Cause visual inconsistency (blue text in unexpected places).
Best practice pattern
The correct approach is:
- Add
<meta name="format-detection" content="telephone=no">globally (or per-page) to disable auto-detection. - Explicitly mark up genuine phone numbers with
<a href="tel:+15551234567">555-123-4567</a>.
This gives the site complete control: real phone numbers remain tappable via explicit markup; non-phone numbers are not touched by the browser.
Scope of the tag
The tag affects only the page it appears on. It does not affect pages that do not include it. For most sites, the tag should be in the global <head> template so it applies to all pages. Contact and support pages that explicitly use tel: links do not need an exception — the explicit <a href="tel:"> links still work even when auto-detection is disabled.
Common failure patterns:
- Tag missing from global
<head>template; product and checkout pages display broken layouts on iOS. - Tag present but with incorrect
contentvalue (telephone="no"instead oftelephone=no— quotes around the value, not around the pair). - Contact page disables detection but never adds explicit
tel:links, making the phone number untappable. - Sitewide meta tag added but new page templates added later did not inherit the global
<head>. - Developers only test on desktop browsers (Chrome/Firefox) and never see the iOS Safari layout corruption.
How to Fix
-
Add the tag to the global
<head>template so it applies to all pages:<meta name="format-detection" content="telephone=no"> -
For contact, support, and store locator pages that display phone numbers:
- Do NOT remove the format-detection meta tag.
- Instead, wrap every genuine phone number in an explicit
<a href="tel:">link:<a href="tel:+15551234567">+1 (555) 123-4567</a> - The explicit
tel:link takes precedence over the disabled auto-detection.
-
Validate on a real iOS device (or Safari browser) after adding the tag:
- Open the page on iOS Safari.
- Confirm that order IDs, prices, and product codes are no longer highlighted as phone links.
- Confirm that genuine phone numbers (wrapped in
tel:links) still trigger the call dialog on tap.
-
Audit templates to ensure the tag is included in all page type templates and is not conditional on page-type logic that might exclude certain page types.
-
Fix incorrect
contentvalues: the correct format iscontent="telephone=no", NOTcontent="telephone='no'"orcontent="telephone: no". Multiple directives are comma-separated:content="telephone=no, address=no, email=no".
Additional technical notes
Browser support matrix
| Browser | Auto-detection enabled by default | Respects format-detection=no |
|---|---|---|
| iOS Safari | Yes | Yes |
| Chrome for Android | Partial (less aggressive) | Mostly |
| Firefox for Android | No | N/A |
| Chrome Desktop | No | N/A |
| Safari macOS | No | N/A |
The issue is most impactful on iOS Safari, which is the primary mobile browser for iPhone users. Since iPhone market share in many regions exceeds 50% of mobile traffic, the effect is widely visible.
telephone=no does not break tel: link markup
A common misconception is that telephone=no prevents all phone-related functionality on the page. This is not true. The meta tag only disables the browser's automatic detection and conversion of unlinked text into phone links. Explicitly coded <a href="tel:+15551234567"> links are not affected and continue to work normally as tappable phone links. The tag should be used alongside — not instead of — explicit tel: link markup.
Ecommerce-specific false-positive patterns
Ecommerce sites are disproportionately affected because they concentrate the types of numeric strings that trigger auto-detection:
- Product SKUs:
SKU-20241231-001 - Order confirmation numbers:
ORD-987654321 - Tracking numbers:
1Z999AA10123456784 - Prices with separators:
1,299.00 - Coupon codes with digits:
SAVE25OFF2024 - Zip code + extension:
90210-4567 - ISBN codes:
978-3-16-148410-0
A product catalog page may contain dozens of these patterns per page. Without format-detection=no, the iOS Safari rendering can turn large sections of the product listing into highlighted blue phone links.
CSS workaround (limited use)
Some teams use CSS to work around format-detection without the meta tag:
a[href^="tel"] { pointer-events: none; }
This prevents auto-detected phone links from being tappable but does not prevent them from appearing as blue underlined text — the visual corruption remains. The meta tag approach is the correct fix.