I need help understanding this guideline about text-spacing. I'm wondering what is the purpose of these text style properties in the bulleted points. My understanding is that users should be able to override the text styles. That's what I got from reading this article. But then what is the purpose of the bullet points? I guess what I'm really confused about is the sentence "no loss of content or functionality occurs by setting all of the following and by changing no other style property".

I know there are some explanations in the Intent and Author Responsibility section but I guess I'm still confused?

In the Intent section, it says: "Each of the requirements stipulated in the SC's four bullets helps ensure text styling can be adapted by the user to suit their needs." And in the Author Responsibility section, it says: "Rather, it specifies that an author's content has the ability to be set to those metrics without loss of content or functionality." But I don't understand how these are related to users applying text styles (like enlargening the font and spacing) and ensuring that the author's content is not cut off.

Am I missing something? Am I just confused after reading this whole article?

Edit: Basically, if users will override the text style for their needs, what is the purpose of the text properties in the bullet points if some users might change it to something else?

link: https://www.w3.org/WAI/WCAG21/Understanding/text-spacing.html

[1]: https://i.stack.imgur.com/aFYzO.png


The guidelines in the bullet points all help make text more readable on a screen. Users might still wish to resize text using their browsers. If text becomes cut off or overlaps when resized, it becomes a loss of content failure.

From Understanding Success Criterion 1.4.12: Text Spacing:

Text Cut Off

The bottom portion of the words "Your Needs" is cut off in a heading making that text unreadable in Figure 1. It should read "We Provide a Mobile Application Service to Meet Your Needs."

Heading text truncated vertically.

Figure 1: Vertical text cut off is a failure.

In Figure 2 the last portion of text is cut off in 3 side-by-side headings. The 1st heading should read "A cog in the wheel." But it reads "A cog in the whe". Only half of the second "e" is visible and the letter "l" is completely missing. The 2nd heading should read "A penny for your thoughts". But it reads "A penny for your". The 3rd should read "Back to the drawing board." But it reads "Back to the drawi".

3 side-by-side headings with truncated text.

Figure 2: Horizontal text cut off is a failure.

Text Overlap

Heading text overlaps part of paragraph text

Figure 3: Overlapping text is a failure.

In Figure 3 the last 3 words "Groups and Programs" of the heading "Technologists Seeking Input from Groups and Programs" overlap the following sentence. That sentence should read, "You are invited to share ideas and areas of interest related to the integration of technology from a group or program perspective." But the words "You are invited to share ideas" are obscured and unreadable.

| improve this answer | |
  • Ok so it's not really related to users being able to override the text styles and adjust them? it's pretty much just a guideline on how to make text generally more readable rather than keeping it as default? – m.jung Jun 24 at 15:34
  • It's both -- for example, if your line height is so large that it scales in a way that makes elements cut off, that's problematic. It's important to test those scenarios. – Izquierdo Jun 24 at 16:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.