Ensure that text can be resized without loss of content or functionality

Style panel
Check as complete

People with low vision sometimes resize text larger than the 16px default. When we set font sizes in absolute units, like px, the page doesn’t always respect the user’s preference and instead shows the text at the font-size authored.

Let’s look at some best practices to make sure users can resize text on your site.

Never use absolute units (px, pt) for lengths

Use relative units like em, %, and viewport width/height for all spacing and length properties.

Use rem for all font-size properties

Rems are a complex concept, but you can assume that 1 rem is equal to 16px.

  • Set body font size to 100% or 1rem, in order to respect the browser preference
  • Use rem and em units appropriately for spacing units depending on if an element needs to scale based on the body or the inherited type scale.

Don’t disable zoom

Disabling zoom in Webflow is only possible with custom code, so just avoid (or find and delete) custom code that disables zoom.

See also Don't disable zoom and Allow zoom without forcing horizontal scroll

WCAG reference:

1.4.4: Resize text

Back to checklist

Total progress

Congratulations on making the web a more accessible place. Celebrate your work on Twitter.
Celebration horn and streamer emoji
0 / 0
Hide progress
Show progress