Font-size Is More Than The Size Of The Font

[dlyons]

tl;dr The meaning of larger or smaller text can be lost on users who use assistive technologies if authors don't use the right features like Headings. What are some reasons you change the font-size so we can be sure we're providing the most accessible way to present that information?

Recently, I was talking to a group about how they use various features of the RCE and two things caught my attention regarding the font-size picker. One of the them was "I make text smaller under an image, usually for a caption or attribution." And the other was "I break long pages up into sections with larger titles to separate each section." These are both good affordances for laying out content, but unfortunately they both run afoul of making the content as accessible to screen reader and keyboard-only users.

Let's examine that first use case: "I make text smaller under an image, usually for a caption or attribution." The "official" way to do this is using a "Figure Caption". Canvas doesn't support adding Figure Captions through the UI, but it's definitely something on my radar now! Figure Captions also don't have broad screen reader support just yet (screen readers read the text, but don't do anything fancy with it) but it does make for a nice layout. Most important to understand: Figure Captions do not replace alt text on images!

"A" in this image is regular text. "B" is a Figure Caption. (This text right here is this image's Figure Caption. Very meta!)

The case of the "bigger section titles" may be familiar to many of you. Most people at least have an idea of how Headings work, but Headings don't just change the font-size (and add some Gestalt-friendly padding). Headings also have structural meaning that assist keyboard-only and screen reader users navigate content, the same way the larger size and spacing helps sighted readers. The folks at IU and Princeton have a couple of my favorite guides for explaining and showing why you should care about using Headings correctly.

• Accessibility - Headings, Indiana University
• Digital Accessibility - Headings, Princeton University

"A" in this example is a Header. "B" is regular text with a larger font-size. "C" has the paragraph set to Header 2

So, how about you? Are you excited for a future where we support Figure Captions? Did the links above help you understand Headings? Do you use the font-size menu to embiggen or enshrinken your text? And if so, why? Share your use cases in the comments below!

[Steven_S]

There is a big learning curve to understanding how the unseen formatting impacts functions like screenreaders in ways that make a page more (or less) accessible. 

I have used the font size selector if the font on the screen looks too small or large.  Often this happens when unseen formatting comes with copied text, and so I have learned that it is more effective to find the html code and remove much of the prefix portion, but I have no real training in html. 

In some cases I might change the font and feel that the font starts out smaller or larger than I would like.  Changing the font size in those cases is about making sure the text is a consistent size for reading even if a different font is used.

[christopher_phi]

It is great to hear that you are considering support for figure captions! We use them frequently through the DesignPLUS tool that provides a way to add them through their WYSIWYG tool and they come in handy frequently. 

That is a good question of the use case for font size outside of headings. I could maybe see a use case for allowing an individual course to have a different (larger) base font size - but I wonder if providing every instructor with the ability to easily change font size causes more problems than it solves. 

Removing that ability might spur more people to understand and use headings - it may also cause some misuse of headings, but I think of the two "misuses" I would rather have a heading incorrectly for text that shouldn't be  heading used over large paragraph text that should be a heading.