Skip to main content

Text Adjustment Features

AllAccessible provides 9 powerful text adjustment features that help people with visual impairments, dyslexia, and reading difficulties customize text

Written by Frank

Text Adjustment Features

Overview

AllAccessible provides 9 powerful text adjustment features that help people with visual impairments, dyslexia, and reading difficulties customize text for maximum readability.

Who This Is For

  • People with low vision

  • Users with dyslexia

  • Anyone who finds default text difficult to read

  • Older adults preferring larger text

What You'll Learn

  • All text adjustment features explained

  • How each feature helps readability

  • How to use text adjustments

  • Combining features effectively

Available Text Features

1. Text Size

What it does: Increase or decrease font size across entire website

How it helps:

  • Makes small text readable for low vision

  • Reduces eye strain

  • Accommodates presbyopia (age-related vision loss)

Adjustment Range:

  • Minimum: 80% (for large default text)

  • Default: 100%

  • Maximum: 200% (double size)

How to use:

  1. Open AllAccessible widget

  2. Go to "Text Adjustments"

  3. Use slider or +/- buttons

  4. Text scales immediately

WCAG Compliance:

  • Meets Success Criterion 1.4.4 (resize text to 200%)

  • Level AA requirement

📷 Text size comparison 100% vs 200%

2. Line Height

What it does: Increase vertical spacing between lines of text

How it helps:

  • Dyslexia: Prevents lines from blurring together

  • ADHD: Easier to track reading position

  • Low vision: Reduces crowding effect

  • Everyone: Improves readability

Adjustment Options:

  • Default: 1.0x (website's original)

  • Increased: 1.5x (50% more space)

  • Maximum: 2.0x (double spacing)

Recommended: 1.5x for most users

Visual Effect:

Default (1.0x):
This is a line of text.
This is another line.
This is the third line.Increased (1.5x):
This is a line of text.This is another line.This is the third line.

3. Letter Spacing

What it does: Add horizontal space between individual letters

How it helps:

  • Dyslexia: Prevents letter confusion (b/d, p/q)

  • Visual processing: Clearer letter recognition

  • Reading speed: Improves accuracy over speed

Adjustment Range:

  • Normal: 0px

  • Slight: 0.05em

  • Moderate: 0.1em

  • Wide: 0.15em

  • Maximum: 0.2em

WCAG Compliance:

  • Meets Success Criterion 1.4.12 (text spacing)

  • Level AA requirement

Visual Effect:

Normal: accessibility
Moderate: a c c e s s i b i l i t y
Wide: a  c  c  e  s  s  i  b  i  l  i  t  y

4. Text Spacing (Combined)

What it does: Applies optimal spacing to lines, letters, and words simultaneously

How it helps:

  • Combines line height + letter spacing + word spacing

  • Optimized ratios for maximum readability

  • One-click comprehensive spacing improvement

Applied Values:

  • Line height: 1.5x

  • Letter spacing: 0.12em

  • Word spacing: 0.16em

Who needs this:

  • Users with multiple reading challenges

  • Dyslexia + vision impairment combination

  • Anyone wanting "breathing room" in text

5. Text Alignment

What it does: Change how text aligns on the page

Options:

  • Left (default for most sites)

  • Right (for RTL languages)

  • Center (decorative)

  • Justify (equal edges, can be hard to read)

How it helps:

  • Right-to-left readers: Arabic, Hebrew

  • Cognitive disabilities: Certain alignments easier to process

  • Personal preference: Some users prefer centered

Recommendation: Usually left-aligned for LTR languages

6. Readable Font

What it does: Replace all website fonts with highly legible sans-serif

How it helps:

  • Low vision: Clean, simple shapes easier to see

  • Dyslexia: Eliminates confusing decorative fonts

  • Cognitive: Reduces processing load

  • Everyone: Maximum clarity

Font Characteristics:

  • Sans-serif (no decorative strokes)

  • High x-height (tall lowercase letters)

  • Open counters (space inside letters like 'a', 'e')

  • Distinct character shapes (1, l, I all different)

Common Use Cases:

  • Script fonts → Readable

  • Decorative fonts → Readable

  • Serif fonts → Sans-serif

  • Handwriting fonts → Clean type

Visual Comparison:

Decorative font: 𝓣𝓱𝓲𝓼 𝓲𝓼 𝓱𝓪𝓻𝓭 𝓽𝓸 𝓻𝓮𝓪𝓭
Readable font: This is easy to read

📷 Font comparison before/after

7. Dyslexia-Friendly Font

What it does: Apply OpenDyslexic font designed specifically for dyslexia

How it helps:

  • Dyslexia (10-15% of population): Reduces letter confusion and rotation

  • Reading disorders: Unique letter shapes prevent mixing

  • Anyone: Some people just find it easier

Font Features:

  • Bottom-weighted letters: Prevents mental rotation (b↔d, p↔q)

  • Unique shapes: Every letter distinctly different

  • Increased openings: Letters like 'c' and 'e' more open

  • Heavier baseline: Anchors letters to "ground"

Designed By: Abelardo Gonzalez specifically for dyslexia

Research:

  • Mixed results in studies (some users love it, others don't)

  • Personal preference varies

  • Trial recommended

Visual Comparison:

Standard font: bed, deb, bad, dab
Dyslexic font: bed, deb, bad, dab (with bottom weighting)

📷 OpenDyslexic font example

Try It: Best way to know if it helps is to test it!

8. Highlight Titles

What it does: Add visual emphasis to all headings (H1, H2, H3, etc.)

How it helps:

  • ADHD: Clear page structure

  • Cognitive disabilities: Understand content organization

  • Speed readers: Quick scanning

  • Everyone: Better content hierarchy

Visual Effect:

  • Background color behind headings

  • Border or underline

  • Icon before heading

  • Increased contrast

Benefit:

  • Quickly identify main topics

  • Understand page structure

  • Navigate to relevant sections

  • Scan content efficiently

📷 Highlighted titles on page

9. Word Spacing

What it does: Add space between words

How it helps:

  • Dyslexia: Prevents word running together

  • Visual processing: Clear word boundaries

  • Reading fluency: Reduces re-reading

Adjustment:

  • Normal: default word spacing

  • Increased: 1.25x

  • Wide: 1.5x

  • Maximum: 2x

Visual:

Normal: The quick brown fox jumps
Wide: The   quick   brown   fox   jumps

Combining Text Features

Common Effective Combinations

For Dyslexia

Combination:

  • Dyslexia font

  • Line height: 1.5x

  • Letter spacing: 0.12em

  • Reading guide (separate feature)

Result: Optimal dyslexia reading experience

For Low Vision

Combination:

  • Text size: 150-200%

  • Readable font

  • High contrast mode (visual feature)

  • Line height: 1.5x

Result: Maximum text readability

For Older Adults (Presbyopia)

Combination:

  • Text size: 125-150%

  • Line height: 1.5x

  • Readable font

  • Cursor enlargement (navigation feature)

Result: Comfortable reading for aging eyes

Text Feature Best Practices

For Users

Start Simple:

  1. Try one feature at a time

  2. See how it affects readability

  3. Add more features gradually

  4. Save your favorite combination

Don't Overdo:

  • Too many adjustments can make text weird

  • Find balance between readable and usable

  • 200% text size might break layouts

Save Preferences:

  • Widget remembers your settings

  • Works across all pages on site

  • Persists across browser sessions

For Site Owners

Test Your Site:

  • Try all text features

  • Verify text stays readable at 200%

  • Check layout doesn't break

  • Test on mobile devices

Design Considerations:

  • Use relative font sizes (em, rem)

  • Avoid fixed-width text containers

  • Test with dyslexia font

  • Ensure responsive typography

Accessibility Standards Met

WCAG 2.2 Success Criteria

1.4.4 Resize Text (Level AA):
✅ Text can be resized up to 200%

1.4.12 Text Spacing (Level AA):
✅ Line height: 1.5x minimum
✅ Letter spacing: 0.12x minimum
✅ Word spacing: 0.16x minimum

1.4.8 Visual Presentation (Level AAA):
✅ User can select foreground/background colors
✅ Line length doesn't exceed 80 characters (when possible)
✅ Text not fully justified

Technical Details

How Text Scaling Works

CSS Implementation:

/* AllAccessible applies: */
body {
  font-size: 150%; /* User's text size preference */
  line-height: 1.5; /* User's line height preference */
  letter-spacing: 0.12em; /* User's letter spacing */
}

Important:

  • Overrides website's default styles

  • Applied via injected CSS

  • Temporary (only while user has features enabled)

  • Doesn't change website's source code

Limitations and Edge Cases

What Works

✅ Body text
✅ Headings
✅ Navigation menus
✅ Form labels
✅ Button text
✅ Most paragraph text

What Might Not Work

⚠️ Text in images (can't be resized)
⚠️ Text in videos or captions
⚠️ Canvas/SVG text (sometimes)
⚠️ Fixed-size containers (may cause overflow)

Solution: Report issues to site owner, not AllAccessible limitation

Related Articles

Last Updated: October 2025
​Total Text Features: 9
​Availability: Starter plan ($10/month)
​WCAG Coverage: Level AA and AAA criteria met

Related Articles
Did this answer your question?