top of page
  • Writer's pictureBrent Payne

The viewport <meta> tag has a maximum-scale set

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">


Further Reading

4 views

Recent Posts

See All

ClubReq Gets A Link (Because They Asked)

I am a mentor for Techstars and have been for over 10 years. In those ten years I have mentioned to startups to ask ANYONE and everyone that they meet to link to their site. Yet, in all those times on

Comments


bottom of page