<
zhead
>

Early Access

Meta Tags

format-detection

Learn how to use the format-detection meta tag to improve your site.

Controls how telephone numbers, email addresses, and physical addresses are detected and displayed by the browser. By default, many browsers can automatically detect this information and style or link it accordingly, which might not always align with the web developers’ intentions.

Parameters

telephone=yes
Allows the browser to automatically detect and link telephone numbers.
<meta name="format-detection" content="telephone=yes" />
telephone=no
Prevents the browser from automatically detecting and linking telephone numbers.
<meta name="format-detection" content="telephone=no" />
email=yes
Allows the browser to automatically detect and link email addresses (not universally supported).
<meta name="format-detection" content="email=yes" />
email=no
Prevents the browser from automatically detecting and linking email addresses (not universally supported).
<meta name="format-detection" content="email=no" />
address=yes
Allows the browser to automatically detect and link physical addresses (not universally supported).
<meta name="format-detection" content="address=yes" />
address=no
Prevents the browser from automatically detecting and linking physical addresses (not universally supported).
<meta name="format-detection" content="address=no" />

Code Examples

<meta name="format-detection" content="telephone=no" />
Prevents the browser from auto-detecting and linking phone numbers, allowing the site to control how and if phone numbers are clickable.
<meta name="format-detection" content="email=no, address=no" />
Prevents the browser from auto-detecting and linking email and physical addresses, giving full control over such elements to the website.
<meta name="format-detection" content="telephone=yes, email=yes, address=yes" />
Enables automatic detection for all formats, which can lead to unwanted styling or linking, especially if the site already handles these formats explicitly.
<meta name="format-detection" content="" />
Leaving the "format-detection" meta tag empty or not using it defaults to the browser’s automatic detection settings, which might not align with your site’s needs.

Recommendations

  • Ensure User Control for Phone Links
    When setting "telephone=no", consider providing your own mechanism for users to initiate calls if your site includes phone numbers. Not all users appreciate automatic linking, especially on desktop sites where such functionality can be less useful.
  • Test Across Browsers for Email and Address Detection
    Since "email" and "address" detection support can vary between browsers, test their behavior across different environments, especially if you decide to enable these features. You might need JavaScript fallbacks for consistent behavior.

Related Documentation

Related Meta Tags

application-name

name

Defines the name of the web application as it should be displayed when bookmarked or added to a mobile home screen.

<meta name="application-name" content="MyApp">
Simple, concise, and clearly displays the application's purpose or brand.

charset

charset

Defines the character encoding standard for the HTML document. Character encoding is essential for rendering text correctly in browsers.

<meta charset="charset" content="UTF-8">
Declares UTF-8 as the character encoding for the HTML document, supporting most characters and symbols in use today.

color-scheme

name

Instructs the browser on what color themes (light or dark mode) are supported and preferred for the content, ensuring visual consistency and accessibility.

<meta name="color-scheme" content="light dark">
Indicates to the browser that the site smoothly supports both light and dark themes, offering flexibility to match the user’s preferred theme setting.

default-style

http-equiv

Specifies the name of the preferred stylesheet to use on a web page. This allows users or user agents to choose the default stylesheet amongst many provided.

<meta http-equiv="default-style" content="Main Style">
Correct use case where "Main Style" is precisely the title of one of the page’s alternative stylesheets.

format-detection

name

Controls how telephone numbers, email addresses, and physical addresses are detected and displayed by the browser. By default, many browsers can automatically detect this information and style or link it accordingly, which might not always align with the web developers’ intentions.

<meta name="format-detection" content="telephone=no">
Prevents the browser from auto-detecting and linking phone numbers, allowing the site to control how and if phone numbers are clickable.