On Font-resize component
Recently I’m checking if I should include a font-resizer component in a web site.
According to WCAG:
WCAG 1.4.4 Resize text: Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality. (Level AA)
But we can conform to the guide with either:
- Relative font-size unit + browser’s zoom feature.
- Plus font resizer component in the web page.
Here is my findings:
Link: WebAIM on Font size
Fortunately, most browsers allow users to enlarge or shrink the font size according to their preferences. Users with low vision often alter the settings of their browsers to accommodate their needs. Some users use screen enlargement software to accomplish this task. In many ways, the font size is not as important as it used to be, because of the increased customizability of browsers and assistive technologies. However, it is important that your design accommodate increased text sizes without loss of readability or functionality.
Check your target audience for your project. If the users are more likely to benefit from the in-page font resizing due to minor visual disabilities or those that suffer from dyslexia, or (and I hope this isn’t the case anymore) if they’re locked into using IE6 then yes, it’s probably going to be useful to provide that option, but for current web design it’s more important to get your code in shape and use good HTML and you can let the users take control of how they want to experience the web.
In my findings, relative font-size and following the HTML spec is a must. While font-resizer is not a must in current web design, but it is still nice-to-have in case the user needs on-web-page help on how to resize font-size.
So may be instead of a font-resizer, we can provide a how-to-change-font-size guide.
Want productive tips and web technologies links like this in your inbox each week? Sign up for weekly dispatch each week. No spam ever. Just useful content: