Asqatasun / Contrast-Finder

Contrast-Finder finds correct color contrasts (background / foreground) for web accessibility (a11y, WCAG, RGAA). https://app.contrast-finder.org
GNU Affero General Public License v3.0
55 stars 18 forks source link

Webapp > Help > Text size understanding : comments on pt => px conversion #136

Open ArnaudDelafosse opened 6 years ago

ArnaudDelafosse commented 6 years ago

Observed behaviour

In the "Help" > "Minimum ratio" > " Level AA" and "Text size understanding" sections, it is implied that 14pt is equivalent to 14px and that 18pt is equivalent to 18px.

Expected behaviour

I believe this is incorrect if you follow the W3C's own "Contrast (Minimum) Understanding SC 1.4.3" in the "Note 1" section where it says "The ratio between sizes in points and CSS pixels is 1pt = 1.333px, therefore 14pt and 18pt are equivalent to approximately 18.5px and 24px."

What I understand is that for a given standard font-size where body { font-size: 100%; } p { font-size: 1rem; } sets your paragraphs a font-size of (equivalent to) 16px, contrast ratios for level AA should be at least:

/!\ Reminder: do not use px to set your font sizes, these are pixel equivalences. Always use relative units like rem, em or %.

Steps to reproduce the behaviour

See this example on CodePen: https://codepen.io/ArnzWeb/full/WMdmGB/ (it's in French and I've voluntarily rounded 18.5 to 19px).

mfaure commented 6 years ago

Thanks @ArnaudDelafosse for your clever feedback! This note wasn't present at the time of the doc writing. I just grep'd some git logs and found it was introduced on May 23, 2016.

Would you feel comfortable with fixing the doc ?

ArnaudDelafosse commented 6 years ago

You're welcome, glad to bring a bit of help to this great tool. Yes I'm fine with amending the doc, I'll try as soon as I can.

dzc34 commented 6 years ago

files impacted:

ArnaudDelafosse commented 6 years ago

Once the suggestions I made for the Howto page are validated or not, I'll mirror that on the 2 remaining files.

dzc34 commented 6 years ago

Thanks @ArnaudDelafosse for your contributing! I splited your merge request #140 in two part for more easy review:

142 is now merged in develop branch.

dzc34 commented 6 years ago

other resources: