A11y Feature Request
Describe the new a11y feature
Some people need to zoom/increase the size of the page so they can read the text or see details in the pictures. Developers may disable that zoom functionality by using the "viewport" meta tag, and that can turn into an accessibility problem.
Acceptance criteria
Possible solution
There is a way to do this related to the one suggested on #153. The idea would be to make the <head> tag visible (the elements inside are non-visible, but it could have some side effects), and display an error on the meta tag with the incorrect value. Something like this:
/* this would be shared with #153 */
head {
display: block;
}
head meta[name = "viewport"][content *= "maximum-scale=1" i],
head meta[name = "viewport"][content *= "user-scalable=no" i] {
@include vectorMessage(error, "E0018", 458, "the display zoom has been", "disabled. Oh no!");
display: block;
border: 0;
}Why is this a11y feature important?
From The A11Y Project: "Using the viewport meta tag the wrong way can prevent people with low vision concerns from accessing your website or web app." In the article, the use of maximum-scale and user-scalable=no is discouraged. MDN also includes a warning about the use of user-scalable:no and how it could have potential accessibility issues.
A11y Feature Request
Describe the new a11y feature
Some people need to zoom/increase the size of the page so they can read the text or see details in the pictures. Developers may disable that zoom functionality by using the "viewport" meta tag, and that can turn into an accessibility problem.
Acceptance criteria
maximum-scale=1)user-scalable=no)Possible solution
There is a way to do this related to the one suggested on #153. The idea would be to make the
<head>tag visible (the elements inside are non-visible, but it could have some side effects), and display an error on the meta tag with the incorrect value. Something like this:Why is this a11y feature important?
From The A11Y Project: "Using the viewport meta tag the wrong way can prevent people with low vision concerns from accessing your website or web app." In the article, the use of
maximum-scaleanduser-scalable=nois discouraged. MDN also includes a warning about the use ofuser-scalable:noand how it could have potential accessibility issues.