This means that the URL in question contains a viewport <meta> tag with a maximum-scale set, which might limit user interaction.
Why is this important?
The viewport is essentially the user's visible area of a web page. It changes with the device - smaller on mobile and larger on desktop. The <meta> viewport element guides browsers in managing the dimensions and scaling of the page.
Having a maximum-scale attribute in the viewport <meta> tag may restrict users from zooming in or out on mobile devices, potentially hindering accessibility for some users.
What does the Optimization check?
Loud Interactive's Optimization will be activated for any page that has a viewport <meta> tag in the <head> section if it includes a maximum-scale parameter.
Examples that trigger this Optimization:
If a page includes the following viewport <meta> tag, this Optimization would be triggered:
<!doctype html><html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.4"> ... </head> <body>...</body></html>
How do you resolve this issue?
The attribute 'maximum-scale' is intended to keep users from zooming in too much. While not inherently harmful, if misconfigured, it may disable zoom entirely. For this, platforms like iOS 10 no longer pay attention to maximum-scale settings.
It's recommended to utilize the following setting for the viewport to avoid issues:
<meta name="viewport" content="width=device-width, initial-scale=1">