Dealing with Mobile Friendly issues?

Crawl your website with Sitebulb for 300+ tech SEO checks

Try for Free
Medium This Hint is worth investigating further, and may warrant further attention depending on the type and quantity of URLs affected. Issue This Hint represents an error or problem that needs to be fixed.

The viewport <meta> tag prevents the user from scaling

This means that the URL in question contains a viewport <meta> tag with the attribute user-scalable set to '0' or 'no', which prevents the user from zooming in or zooming out.

Why is this important?

The browser's viewport is the area of the window in which web content can be seen. The viewport varies with the device, and will be smaller on a mobile phone than on a computer screen. A <meta> viewport element gives the browser instructions on how to control the page's dimensions and scaling.

The user-scalable attribute defines whether users can scale (zoom) the page content on mobile. By default, scaling is on, but if user-scalable is set to '0' or 'no' then this will prevent users from zooming, which negatively affects user experience (in most cases).

What does the Hint check?

This Hint will trigger for any internal URL which contains a viewport <meta> tag, with a user-scalable value which prevents the user from scaling.

Examples that trigger this Hint:

This Hint would trigger for any URL that has a viewport <meta> tag in the <head>, with the attribute user-scalable is set to '0' or 'no':

<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, user-scalable=no">
...
</head>
<body>...</body>
</html>

How do you resolve this issue?

Zooming is a common and expected 'allowed' behaviour on mobile web pages, so disabling it detracts from the mobile user experience. For this reason, Apple decided to ignore the declarations of user-scalable, minimum-scale, and maximum-scale, as of iOS 10.

It is straightforward to resolve this issue - simply remove the user-scalable attribute entirely.

The recommended, 'safe' viewport setting is:

<meta name="viewport" content="width=device-width, initial-scale=1">

Further Reading

Sitebulb Desktop

Find, fix and communicate technical issues with easy visuals, in-depth insights, & prioritized recommendations across 300+ SEO issues.

  • Ideal for SEO professionals, consultants & marketing agencies.

Sitebulb Cloud

Get all the capability of Sitebulb Desktop, accessible via your web browser. Crawl at scale without project, crawl credit, or machine limits.

  • Perfect for collaboration, remote teams & extreme scale.