Skip to content
This repository was archived by the owner on Mar 14, 2024. It is now read-only.

Note on WCAG risk for fluid type #4080

Merged
merged 1 commit into from
Oct 21, 2020
Merged

Conversation

aardrian
Copy link
Contributor

@aardrian aardrian commented Oct 17, 2020

Added two sentences with two links total noting the risk with clamp() and vw for WCAG 1.4.4.

Added two sentences with two links total noting the risk with `clamp()` and `vw` for WCAG 1.4.4.
@aardrian aardrian requested a review from a team as a code owner October 17, 2020 19:58
@google-cla google-cla bot added the cla: yes Contributor has signed the CLA label Oct 17, 2020
@github-actions
Copy link

Alex Recommends Report

Alex recommends the following language changes, but Alex is a regular expression based algorithm, so take them with a grain of salt.

src/site/content/en/blog/min-max-clamp/index.md

Level Location Word Recommendation
⚠️ 147:30 just just may be insensitive, try not to use it
⚠️ 220:41 clearly clearly may be insensitive, try not to use it
⚠️ 238:25 just just may be insensitive, try not to use it

@netlify
Copy link

netlify bot commented Oct 17, 2020

Deploy preview for web-dev-staging ready!

Built with commit 51568f8

https://deploy-preview-4080--web-dev-staging.netlify.app

Copy link
Contributor

@jpmedley jpmedley left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the contribution. I have a suggestion about it and we need to get the approval of the post author.

@una what do you think?

@aardrian
Copy link
Contributor Author

@jpmedley Let's pretend I am new to GitHub. I cannot find what you changed or requested to be changed.

If it is adding an article to this sentence: "…it is a WCAG failure under…", then I am totally on board with it.

@@ -232,6 +232,8 @@ p {
}
```

When you use `vw` units or limit how large text can get with `clamp()`, there is a chance a user may be unable to scale the text to 200% of its original size. If that happens, it is WCAG failure under [1.4.4 Resize text (AA)](https://www.w3.org/WAI/WCAG21/quickref/?showtechniques=144#resize-text) so be certain to [test the results with zoom](https://adrianroselli.com/2019/12/responsive-type-and-zoom.html).
Copy link
Contributor

@una una Oct 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change:

{% Aside 'warning' %}
Limiting how large text can get with max() or clamp() can cause a WCAG failure under 1.4.4 Resize text (AA), as a user may be unable to scale the text to 200% of its original size. Be certain to test the results with zoom.
{% endAside %}

Copy link
Contributor

@una una Oct 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for opening this PR! I agree it's important to note in there and wasn't aware of this caveat before regarding text accessibility.

(As an aside, this sounds like a browser bug that should be resolved, as zoom should always override preferences. Do you think this is worth bringing up as a bug?)

Let me know what you think of the update. I reworded it to be more focused on the primary content/be more direct and added a bit of styling that will call this out as a warning

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With one exception, I am totally fine with your edit. I would not pretend to be able to do your voice, so I tried to keep it as generic as possible.

The exception is that you replaced vw with max(), and while max() is a good add (thanks!), viewport units (including vh) have their own call-out in WCAG and are the most common reason today that I end up flagging this SC in audits: F94: Failure of Success Criterion 1.4.4 due to incorrect use of viewport units to resize text.

As for the browser bug question, maybe? We already convinced browsers to ignore that meta tag that prevents zooming at all, so there may be a case for a method to zoom without making users have to wade into the settings / guts. Would be happy to gather your thoughts separately (partly because I am too close to the issue, methinks).

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My requested change seems to be gone completely.

What I questioned was the need to say that this limitation is per the spec. Nearly every requirement of the web is because of a spec. We don't say it every time and don't need to because it's assumed. Is there more to this limitation than the fact that spec authors had to pick a number and it happens to be 200? Is so, then that's the explanation that should be here, not that it's in a spec.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I may be a bit confused here. I cited the WCAG Success Criterion that mandates the ability to scale text by at least 200%. That SC is encoded in global accessibility legislation as well, so WCAG is now more than a set of guidelines (it is not a spec), but is law. I linked to the SC directly because it provides reasons, techniques, known failures, and more. To explain all of that in this article would be well outside the scope of the article.

Does that address your concern?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FWIW, I would have been fine with @una's edit (and as the author I think she would have final say). But I am happy to see this approved and thanks for accepting it.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I messed that up. Corrected in #4112

@jpmedley jpmedley merged commit 4ff4150 into GoogleChrome:master Oct 21, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
cla: yes Contributor has signed the CLA
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants