text-spacing

The spacing between letters, words, and lines in text blocks should be sufficient for them to be legible to all users.

Who might be affected
Low Vision
Dyslexia
Attention Deficit

Description

Large blocks of text may be challenging to read for people with certain visual impairments or disabilities, such as dyslexia. Particularly dense text may become even less legible for these users. Moderately spaced text allows for higher readability; therefore, characters and word spacings should never be set below the font's default spacings. Line heights should be set to at least 1.15 times the text size.

This validation refers to the success criterion 1.4.12 text spacing. This success criterion concerns the user's ability to adjust the text spacing. Since this option does not exist in mobile operating systems, this validation checks for minimal text spacing that will be readable by all users.

Quick Fixes

Make sure your text follow these restrictions:

  • Line height (line spacing) to at least 1.15 times the font size;
  • Remove styling rules that reduce the letter spacings (tracking).
  • Remove styling rules that reduce the word spacings (kerning).

Word spacing is available on Android from version 10)

Word spacing

Android (Java):

pass
1//should be should >= 0 or default value is in Pixels.
2textView.getPaint().setWordSpacing(0.2f);
Fail
1textView.getPaint().setWordSpacing(-0.2f);

Android (Kotlin):

Pass
1//should be should >= 0 or default
2textView.paint.wordSpacing = 0.2f
Fail
1textView.paint.wordSpacing = -0.2f

Letter spacing

Android (.xml):

Pass
1 <TextView
2 android:id="@+id/sampleTextView"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:text="Hello, World!"
6 android:textSize="24sp"
7 android:letterSpacing="0.01"
8 android:textColor="@android:color/black" />
Fail
1 <TextView
2 android:id="@+id/sampleTextView"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:text="Hello, World!"
6 android:textSize="24sp"
7 android:letterSpacing="-0.01"
8 android:textColor="@android:color/black" />
9

Android (Java):

pass
1//should be should >= 0 or default in em units(relative to font size).
2textView.setLetterSpacing(0.2f);
Fail
1textView.setLetterSpacing(-0.2f);

Android (Kotlin):

pass
1//should be should >= 0 or default in em units(relative to font size).
2textView.letterSpacing = 0.2f
Fail
1//should be should >= 0 or default in em units(relative to font size).
2textView.letterSpacing = -0.2f

Line spacing

Android (.xml):

Pass
1 <TextView
2 android:id="@+id/sampleTextView"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:text="Hello, World!\nThis is a sample text with line height."
6 android:textSize="24sp"
7 android:lineHeight="28sp"
8 android:textColor="@android:color/black" />
Fail
1 <TextView
2 android:id="@+id/sampleTextView"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:text="Hello, World!\nThis is a sample text with line height."
6 android:textSize="15sp"
7 android:lineHeight="9sp"
8 android:textColor="@android:color/black" />

Android (Java):

pass
1// should be at least 1.15 times the font size or default
2textView.setLineSpacing(1.2f, 1.2f);
Fail
1textView.setLineSpacing(0.5f, 0.5f);

Android (Kotlin):

pass
1// should be at least 1.15 times the font size or default
2textView.setLineSpacing(1.2f, 1.2f)
Fail
1textView.setLineSpacing(0.5f, 0.5f)

How Users Are Affected

The text may be illegible or difficult to read for people with visual impairment and/or dyslexia.

WCAG Success criteria

This issue might cause elements to fail one or more of the following Success criteria:
1.4.12 Text Spacing (AA)